第10章__网站布局与配色

第10章 网站布局与配色,网页设计已经渐渐走向成熟，毫无修饰的网站必定会很快地被人遗忘，所以在制作网站之前，首先要考虑网站的整体视觉效果。在网站整体视觉效果中，主要是网页的色彩搭配与网页布局。前者决定了浏览该网站的第一印象；而后者则决定网站中的信息是否为合理的安排。,1,2,10.1 网页布局,网页设计也属于平面设计，所以平面设计中的构成原理同样适用于网页设计。网页布局可以从两方面理解，一种是结构布局，另一种是艺术布局。,10.1.1 结构布局,无论是在纸上布局，还是通过软件布局，都需要了解网页中最基本的布局方式。 1“国”字型网页布局 2拐角型网页布局 3左右框架型网页布局 4封面型网页布局,3,10.1.2 艺术布局,平面构成的原理已广泛地应用于网站构成设计、工业造型设计、建筑设计、商业美术设计、染织美术设计以及舞台美术设计中。本节将带领读者了解平面构成在网站设计中的作用。,4,10.2 色彩基础知识,一个网站拥有漂亮的色彩，不但可以给人留下深刻的印象，而且也可以产生很好的视觉效果。所以，网页设计师们在色彩的使用上需要深思熟虑。 网页设计是一种特殊的视觉设计，它对色彩的依赖性很高，色彩设计同时还是网站风格设计的决定性因素之一。,5,10.2.1 色彩理论,自然界的色彩虽然各不相同，但任何有彩色的色彩都具有色相、亮度、饱和度这三个基本属性，也称为色彩的三要素。 1色相 2饱和度 3亮度,6,10.2.2 216网页安全色,216网页安全颜色是指在不同硬件环境、不同操作系统、不同浏览器中都能够正常显示的颜色集合，这些颜色在任何终端浏览用户显示设备上的显示效果都是相同的。所以使用216网页安全颜色进行网页配色可以避免原有的颜色失真问题。,7,10.2.3 网页配色方法,了解什么是颜色三要素，什么是网页安全颜色后，就是如何利用色彩来设置网页的色彩。下面从3个方面详细介绍了网页色彩搭配。 1网页自定义颜色 2色彩推移 3色彩采集,8,10.3 配色方案,认识何为网页安全颜色，以及简单的网页配色方法后，就是如何更好地利用色彩表达网页中的宗旨，与如何使不同的颜色合理的搭配在一起。,9,10,10.3.1 色彩分析,色彩对人的头脑和精神的影响力，是客观存在的。色彩的知觉力、色彩的辨别力、色彩的象征力与感情，这些都是色彩心理学上的重要问题。,11,10.3.2 色彩对比,两种以上的色彩，以空间或者时间关系相比较，能比较出明显的差别，并且产生比较作用，被称为色彩对比。 1色相对比 2明度对比 3纯度对比 4面积对比 5综合对比,10.3.3 色彩调和,“调”是调整、调理、调停、调配、安顿、安排、搭配、组合等意思。“和”可做和一、和顺、和谐、和平、融洽、相安、适宜、有秩序、有规矩、有条理、恰当，没有尖锐的冲突，相辅相成，相互依存，相得益彰等解释。,12,10.4 网站中的色彩应用,网站的色彩设计有其自身的色彩应用规律。为求得良好的整体效果，选定的色彩组合要结合框架设计来分配色彩面积和位置。如果要以突出的色彩设计形成网站风格，就需要有计划性地思量色彩布局和色彩组合。,13,14,10.4.1 色彩分类,在网页中，色彩根据其作用的不同，可以分不同的色彩，其作用也各不相同。 1网页静态色彩 2网页动态色彩 3网页强调色彩,15,10.4.2 网页色彩规则,在网站中使用色彩，要多方面考虑，既要使网站风格独特，也要考虑到网站的功能性与实用性。这样才能使网站既有欣赏价值，还具有实用价值。下面就从单个网页以及整个网站两大方面来介绍网页色彩的规则。 1特色鲜明 2搭配合理 3单色的使用 4可读性的色彩设计 5色彩计划,10.4