论网页设计的布局及色彩搭配

减小字体 增大字体 作者:沈双卉  来源:www.zhonghualunwen.com  发布时间:2009-12-28 13:55:51

  网页设计就是依据网站宗旨,把造型、结构、信息、色彩等视觉元素有机地统一在网页中,并对网页风格等进行整体设计。其目的主要是利用造型的原则和规律,合理的分配和排列文字、图形等视觉元素,以便准确、系统、有效地传达信息。
  
  1网页设计的布局
  
  网页设计实际上就是平面设计,不过目的性、时效性更强。每一次网页设计都可以看成平面设计,不同的是设计网页不仅是把相关内容放到网页中就行了,它还要求网页设计者能够把这些内容合理安排,给浏览者以赏心悦目的感觉,这样才能增强网站的吸引力。网页设计者能够随意控制页面上所有的元素,但假如不知道什么是约定俗成的标准或者说大多数浏览者的浏览习惯,那么就不可能在此基础上加上自己的东西,从而被广大浏览者所接受和欣赏。这些概念,也就是人们常说的章法。要做好页面设计,就必须先了解一些网页布局相关的基本概念。
  1.1页面尺寸显示器的大小及分辨率的高低决定显示页面的尺寸,网页的最大局限性在于页面显示无法突破显示器的范围。由于浏览器本身也占用了网页显示的一部分,所以能显示网页的页面范围已经相当紧张。一般情况下,显示器在640*480像素的分辨率下,页面的显示尺寸为620*311像素:在800*600像素的分辨率下,显示器的分辨率越高,能显示的页面尺寸就越大。
  1.2整体造型造型就是创造出来的物体形象,这里指页面的整体形象。尽管显示器和浏览器都是矩形,但对于页面的造型,可以充分运用各种形状以及它们的组合:矩形,圆形,三角形,菱形等等,但图形与文本的结合应该层叠有序。
  1.3页头页头又称之为页眉,页眉的作用是定义页面的主题。比如一个站点的名字人多都显示在页眉里。这样,浏览者一看就能知道该站点的主题是什么。
  1.4文本文字是网页的主体,是传达信息的最重要的方式。一方面是因为浏览网页上的文字和看书很相似,比较符合一般人的习惯,另一方面也因为文字所需要的存储空间非常小。文本的摆放位置决定着整个页面布局的可视性。在过去由于网页制作技术的局限,文本放置的位置灵活性非常小,随着Dhtml的兴起,文本已经可以放置在页面的任何位置。
  1.5页脚页脚是和页眉相呼应。页眉是放置站点主题的地方,而页脚是放置作者或公司等各种制作信息的地方。
  1.6图片图片在网页中占有非常重要的地位。因为采用图片可以减少纯文字给人的枯燥感,巧妙的图像组合可以带给浏览者美的享受。
  1.7多媒体多媒体一般指音频、视频、动画、虚拟现实等形式。将多媒体引入到网页,可以在很大程度上吸引浏览者的注意。利用多媒体文件可以制作出更有创造性、艺术性的作品,它的引入使得网站成了一个有声有色,动静相宜的世界。
  1.8导航栏的位置导航栏能让我们在浏览时容易地到达不同的页面,是网页元素非常重要的部分,所以导航栏一定要清晰、醒目。一般来讲,如果内容非常多,就要考虑用“国字型”或拐角型;如果内容不算太多而一些说明性的东西比较多,则可以考虑标题正文型;那几种框架结构的一个共同特点就是浏览方便,速度快,但结构变化不灵活。
  
  2网页设计的色彩搭配方法
  
  在网页设计中,色彩成为一个非常重要的研究对象,约翰内斯•伊顿是最早引入现代色彩体系的教育家之一,具有非常敏感的形式认识,他坚信色彩是理性的,只有了解色彩的科学构成,才能进行有色彩的自由表现。
  2.1明确网站的主题、服务对象及用色彩要表达的目的要确定一个网页用什么色彩合适,即什么色彩适合什么网站。你必须要先弄明白该网站的主题和它的服务对象,以及你通过色彩希望达到的目的。
  2.2确定网页的主色调根据网站的主题、服务对象及用色目的,给网站的网页选一个主色调,以形成一定风格。整个网页最好只有一个主色调。主调色彩一般可用公司的标准色,这符合公司的形象战略,可以提升公司形象。
  2.3根据主调色选择辅助色彩主调色确定后,还可选一至两种辅助色配合使用,整个网页的色彩最好控制在三色之内。如果整个网页采用单色调,即只用一种色相,其辅助色只是在明度和纯度上作调整,间用中性色。采用单色调,易形成一种风格,在网页的局部要采用少量小面积的对比色以达到丰富页面的效果,
  2.4确定背景和文本的色彩背景和文本的色彩对比要尽量大(一般明度对比为3∶1到5∶1),以便突出主要文字内容,但不要过于亮丽,以免造成过强刺激的视觉效果。正文和标题的背景色可以不同,一般正文的背景色用淡雅色较佳,标题的背景色可用较鲜艳的。背景色如果以白色等淡色为主,其文本色要用低明度有彩色,这种搭配较利于阅读。
  2.5最后确定超链接、超链接翻转效果当前超链接及已访问的超链接的色彩超链接的文本色彩,与其它文本的色彩要有差别,以利于浏览者进一步链接;如果利用翻转效果,其翻转效果的色彩应与超链接色彩不同,这样可以突出已选到的超链接,但翻转效果的色彩可以与当前超链接的色彩相同;已访问的超链接的色彩可以与超链接的色彩相同,也可以不同。
  
  参考文献
  [1]刘佳,王倩.网页设计中的色彩表现[J].美术大观,2007,(11)
  [2]胡亚卓.浅谈网页设计[J].科教文汇,2008,(2)
 

Tags:

作者:沈双卉
  • 好的评价 如果您觉得此文章好,就请您
      100%(1)
  • 差的评价 如果您觉得此文章差,就请您
      0%(0)

文章评论评论内容只代表网友观点,与本站立场无关!

   评论摘要(共 0 条,得分 0 分,平均 0 分) 查看完整评论