网页设计的构成要素分析
世纪华联 | 2011-12-02 00:03:33 | 阅读:6804
对于网页设计来讲,其信息内容的有效传达是通过将各种构成要素的设计编排来实现的。网页的构成要素包括文字、图形、图象、标志、色彩等造型要素及标题、信息菜单、信息正文、标语、单位名称等内容要素。
1.文字的编排与设计
文字作为信息传达的主要手段目前也是网页设计的主体,文字是网页中必不可少的元素,也是网页中的主要信息描述要素,所以网页中文字将占据相当大的面积,文字表现的好与坏将影响到整个网页的质量。网页文字的主要功能是传达各种信息,而要达到这种传达的有效性,必须考虑文字编辑的整体效果,能给人以清晰的视觉印象,避免页面繁杂零乱,减去不必要的装饰变化,使人易认、易懂、易读。不能为造型而编辑,忘记了文字本身是传达内容和表达信息的主题。
网页文字编排与设计,重要的一点在于要服从信息内容的性质及特点的要求,其风格要与内容特性相吻合,而不是相脱离,更不能相互冲突。如政府网页其文字具有庄重和规范的特质,字体造型规整而有序,简洁而大方;休闲旅游类内容网页,文字编辑应具有欢快轻盈的风格,字体生动活泼,跳跃明快,有鲜明的节奏感,给人以生机盎然的感受;有关历史文化教育方面的网页,字体编辑可具有一种苍劲古朴的意蕴、端庄典雅的风范或优美清新的格调;公司网页可根据行业性质、企业理念或产品特点,追求某种富于活力的字体编排与设计;个人主页则可结合个人的性格特点及追求,别出心裁,给人一种强烈独特印象。
在网页文字的编排与设计中,由于计算机给我们提供了大量可供选择的字体,导致字体的变化趋于多样化。这既为网页编辑提供了方便,同时也对编排与设计的选择能力提出了考验。虽然可供选择的字体很多,但在同一网页上,使用几种字体尚需精心编辑和考虑。一般来讲,同一页面上使用的字体种类最多只能有三四种。由于文本字体的显示是需要本地硬盘字体文件的支持的,所以在互联网上使用过多的字体是没有意义的。文字在视觉传达中作为页面的形象要素之一,除了表意以外,还具有传达感情的功能,因而必须具有视觉上的美感,能给人以美好印象,获得良好的心理反应。
2.图片的编排与设计
图片是文字以外最早引入到网络中的多媒体对象。网络可以图文并茂地向用户提供信息,成倍地加大了它所提供的信息量。而且图片的引入也大大美化了网络页面。可以说,要使网页在纯文本基础上变得更有趣味,最为简捷省力的办法就是使用图片。对于一条信息来说,图片对受众吸引也远远超过单纯的文字。
网络图片的特点:一个特点是图片质量不需很高。因为网络图片一般只显示于计算机的显示器上,受显示器最小分辨率的限制,即使图片的分辨率很高,颜色深度很大,我们的肉眼也经常无法把它和一幅处理过的普通图片区分开来。一般来说,分辨率为72dpi(dotperinch)是大多数图片最佳选择;另一个特点是,图片要尽量小。网络页面的图片用于网络的传输,受到带宽的限制,其文件尺寸在一定范围内越小越好。这也是适应信息高速公路的要求。文件的长度越小,下载的时间就会越短。
图片的位置、面积、数量、形式、方向等直接关系到网页的视觉传达。在图片的选择和优化的同时,应考虑图片在整体编辑计划中的作用,达到和谐整齐。要达到这样的效果,在页面图片的合理选用时,一要注意统一,二要注意悦目,三要注意突出重点,特别是在处理和相关文字编排在一起的图片时。
3.色彩的设计
网页在一定意义上说也是一种艺术品,因为它既要求文字的优美流畅,又要求页面的新颖、整洁,使用色彩可以产生强烈的视觉效果,使页面更加生动。而且,浏览者在浏览网页时,留下的第一印象就是页面的色彩设计,它的好坏直接影响阅读者的观赏兴趣。因此,色彩设计在网页设计中居于十分重要的地位。网页的色彩设计应把握以下几个方面:
首先是整个页面的色彩选择,确定一个主色调,可以有利于体现网站主题。我们现在看到的网页,一般以浅颜色为背景的居多,如浅灰色、浅黄色、浅蓝色、浅绿色。以浅颜色为底,柔和、素淡,配上深颜色的字,如黑色,读来自然、流畅,也有利于突出页面的重点,有利于整个页面的配色,更容易为大多数人认可和掌握。其他一些次要内容,如背景图片、线条适宜采用不抢眼的颜色,以免喧宾夺主。只有少量精心选择的元素,为了突出强调的需要,才采用明亮的色彩,这些彩色亮点就会产生强烈的视觉冲击,但如果用得太多了,就会形成一种均匀的噪声,而达不到强调的效果。
其次,在背景的色调搭配上一定要注意不能有强烈的对比,特别是同时使用色彩对立的颜色。大面积颜色适宜采用低比度,因为过于丰富的背景色彩会影响前景图片和文字的取色,严重时会使文字溶于背景中,不易辨识。所以,背景一般应以单纯为宜。如果需要一定的变化以增加背景的厚度,也应是在尽量统一的前提下的一种变化。例如在制用标题时,为追求醒目的视觉效果,可用比较深的颜色,配上对比鲜明的字体。实际上背景的作用主要在于统一整个网页的风格和情调,对视觉的主体起到一定的衬托和协调作用,一方面吸引网民的注意力,另一方面有助于体现网站的主题。
![](img/3.png)