2.2 网页布局的基本方法
合理的网页布局是指将网页中的各个构成元素（如文字、图形图像、网页标志和导航等）在网页中进行排版，并从整体上调整好页面中各个部分的分布与排列。
在网页的视觉设计中，设计师需要充分、有效和合理地布局网页中的有限空间，从而制作出更优秀的网页。
2.2.1 网页的布局设计
网页的布局设计并不是随便地将网页元素放置到网页中，而是对网页元素进行有序的排列。合理的网页布局可以使网页变得美观和实用。
网页中的文字、图形和图像等构成元素的排列是否协调决定了网页带给浏览者的阅读感受，因此，如何才能让网页看起来美观、大方和实用是网页设计师在布局网页时首先需要考虑的问题，如图2-5所示。
图2-5 美观的网页设计
网页的布局方式决定了该网页带给浏览者的视觉感受和可用性，因此，在设计网页布局时，设计师应多参考优秀的网页布局方式，在仔细观察其他网页布局方式的同时，征求别人的建议，从而将丰富多彩的网页内容在有限的空间里以最好的方式展示出来，如图2-6所示。
图2-6 有效地利用网页空间
2.2.2 网页布局的原则
合理的网页布局离不开规则的约束，当一个网页有了一定的约束后，会显得更加规范。合理的网页布局原则包括保持网页的协调性、一致性、流动性、均衡性和强调性等，如图2-7所示。
图2-7 合理的网页布局
• 协调性：将网页中的每个构成元素有效地结合或者联系起来，为浏览者展现美观、实用的网站界面。
• 一致性：网站整个页面的构成部分要保持统一的风格，使其在视觉上整齐、一致。
• 流动性：网页布局的设计能够让浏览者根据自己的感觉浏览网页，并且页面的功能能够根据浏览者的兴趣链接到其感兴趣的内容上。
• 均衡性：将网页中的每个构成元素都进行有序的排列，并且保持网页的稳定性。
• 强调性：在不影响整体设计的情况下，把网页中想要突出展示的内容用色彩搭配或者留白的方式最大限度地展示出来。
另外，在合理地布局网页时，设计师需要考虑网页的醒目性、创造性、造型性、可读性和明快性等因素，各个因素的释义如表2-1所示。
表2-1 各个因素的释义
如图2-8所示，该网页给浏览者的感觉是简单和清爽，其运用了非常简单的布局方式来展示网站的产品及其相关信息，使得网页不会显得拥挤和繁杂。
同时展示商品的大图被分割成两部分，并为商品图片添加了一些鼠标移入、移出和悬停效果，使网页显得更加具有造型性；右上角图片的缺失部分和蓝色文字，也为网页添加了一些创造性。
图2-8 网页的视觉效果
提示
图文平衡性：平衡性是指网页中的文字、图像等要素在页面空间中分布均匀，这样网页会给浏览者一种平稳的感觉。页面中的任何一个元素，如果没有达到平衡的效果，就会引起浏览者视觉上的不适。
内容对称性：对称性并不是要求页面中所有的内容都统一对称，而是局部打破对称，去除页面呆板和死气沉沉的感觉。在适当的时候制造一点变化，网页会有不一样的效果。
布局疏密度：留白是一种巧妙的设计技巧，可以体现在疏密度中。疏密度是指不需要整个网页使用一种样式，要适当留白，运用空格、改变行间距和字间距等方式制造一些变化的效果。
视觉对比性：所谓对比是指使用不同的色调、色彩、形态等来表现网页效果，从而形成鲜明的视觉效果。
设计师如果合理利用这个技巧，就能够创造出富有变化的效果。
合理的布局比例：比例适当在网页布局设计中非常重要，虽然不一定要遵循黄金分割定律，但比例一定要协调，否则网页会显得混乱和参差不齐。