网页布局与优化设计

《网页布局与优化设计》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、网页布局与优化设计摘要1一、前言2二、网页布局概述2（-）网页布局有关基本概念2（-）网页布局的步骤3（三）网页布局的类型4三、网页布局设计与优化5（-）变化与统一6（-）对称与均衡6（三）节奏与韵律6（四）对比与调和6（五）比例与适度7（六）重复与交错7四、结束语7参考文献9【摘要】网页布局设计是网站视觉设计研究中的重要环节之一，是将网页上的图片、文字、色彩、动画等视觉构成元素进行合理配置与表现的过程。网页布局设计既要满足实用功能，也要体现审美功能。研究网页布局的形式原理、概念要素与优化方法，既可以为建立网页的视觉秩序提供有效的途径，也可以为提升网页的艺

2、术性，满足受众的审美需求，提高网页信息传递的效率服务。【关键词】：网页设计，布局，搭配一、刖§网页是网站构成的基木元素。决定网页是否精美的因素有很多，最主耍的是网页内容以及色彩搭配，除此以外，还有一个非常重要的因素网页的合理布局（layout）。网页设计屮的布局就是把网页的各种构成要素（文字、照片、图像、图表、菜单等）在网页浏览器里有效地排列起來。在设计网页时，要从整体上把握好齐页面的布局，主耍是利用表格或网格等把网页设计的耍素协调安排起來。只有充分地利用，有效地分割有限的空间，创造出新的空间，并使用合理布局，才能制作出精美的网页。同时，随着网页制作技术和

3、浏览者需求的提高，网页设计被赋予了许多新的内容，主要表现在两个方面：首先是网页的整体设计。浏览者对整个网页浏览的过程屮，会自然而然的形成—种对网页整体的看法，这种看法是附带有感情色彩的，比如舒服与不舒服、好与不好等，这止是网页布局合理性的体现，是网页设计网页是网站构成的基木元素。是网页设计者将内容和色彩通过合理布局，合理搭配所产生的效果。其次是在网页设计中，必须考虑浏览者的方便程度并能明确地传达信息，进而兼顾视觉的造型性和美学的创造性，凸显出网页设计的齐个构成要素［1］。在网站林立、网页纷飞的今天，通过合理的布局，将网页屮具有闪光性的内容加以强化，既可以将

4、网页设计者的设计思路淋漓尽致的表达出來，同时也可以赢得浏览者的青睐。由此可见，耍完成一个精美网页的设计制作，如何将网页内容合理分布尤为重要。然而，网页的布局问题恰恰止是网页设计者感到最棘手的问题。在进行网页设计过程中，首先要有一个网页布局的整体概念，然后再通过布局工具加以实现。二、网页布局概述（-）网页布局有关基木概念网页设计不仅仅是把相关的内容放到网页屮就行了，它述要求网页设计者能够把这些内容合理安排，给浏览者以赏心悦目的感觉，这样才能达到内容与形式的完美结合，增强网站的吸引力。要做好页面设计，就必须先了解一些网页布局相关的基本概念。1、页面尺寸显示器的

5、大小及分辨率的高低决定显示页面的尺寸，网页的最大局限性在于页面显示无法突破显示器的范围。由于浏览器本身也占用了网页显示的一•部分，所以能显示网页的页面范围已经相当紧张。一般情况厂显示器在640*480像素的分辨率下,页面的显示尺寸为620*311像素；在800*600像素的分辨率下,页面的显示尺寸为780*428个像素；在1024*768分辨率下，页面的显示尺寸为1007*600像素。可以看出，显示器的分辨率越高，能显示的页面尺寸就越大［2］。2、整体造型造型就是创造出来的物体形彖，这里指页面的整体形象。尽管显示器和浏览器都是矩形，但对于页面的造型，可以充

6、分运用各种形状以及它们的组合：矩形，圆形，三角形，菱形等等，但图形与文木的结合应该层叠有序。3、页头页头又称Z为页眉，页眉的作用是定义页面的主题。比如一个站点的名字多都显示在页眉里。这样，浏览者一看就能知道该站点的主题是什么。4、文本文字是网页的主体，是传达信息的最重要的方式一方面是因为浏览网页上的文字和看书很相似，比较符合一般人的习惯，另一方面也因为文字所需要的存储空间非常小。文本的摆放位置决定着整个页面布局的可视性。在过去由于网页制作技术的局限，文木放置的位置灵活性非常小，随着Dhtml的兴起，文本已经可以放置在页面的任何位置［3］。5、页脚页脚是和页

7、眉相呼应。页眉是放置站点主题的地方，而页脚是放置作者或公司等齐种制作信息的地方。6、图片图片在网页中占有非常重要的地位。因为采用图片可以减少纯文字给人的枯燥感，巧妙的图像组合可以带给浏览者美的享受。7、多媒体多媒体一般指咅频、视频、动画、虚拟现实等形式。将多媒体引入到网页，可以在很大程度上吸引浏览者的注意。利用多媒体文件可以制作出更有创造性、艺术性的作品，它的引入使得网站成了一个有声有色，动静相宜的世界。(-)网页布局的步骤网页布局一般分为一下三个步骤：第一步：草案。新建的页面就好像一•张口纸，没有任何东西，这时候设计者可以任意发挥想象力，把能想象的景象画

8、到页面当中去。设计草案屈丁•创造阶段，不必去考虑细节功能，只需用简