第二讲常见网站分析.docVIP

第二讲 常见网站分析（１） 【教学内容】 商业网站的分类和分析 个人网站的分类和分析 【教学目的】 掌握设计各类网站的基本原则和基本配色规则。 【教学重、难点】 重点：网站风格如何表现 难点：实际的运用 【教学方式】 讲授 网络的发展，使得互联网上的网站也越来越多，怎么才能设计一个令人满意的页面呢?本节和下节课我们将针对众多网站的网页风格来进行分析。 一、商业网站的分类和分析 ??? 企业网站的制作要体现企业的文化，在企业网页的制作中色调和版式决定企业的风格和文化，这对企业整体品牌的影响是至关重要的。通过企业的网页作为平台，让顾客了解企业的基本信息，所以制作企业网站时，首先要结构清晰，其次，所浏览的内容要很容易让浏览着找到。 图3-2-1 ??? 如图3-2-1，利顿是历史悠久的茶类品牌，我们在平时常见的利顿红茶、利顿冰茶都是其产品。在该企业站点中，突出体现的不是利顿的悠久历史，而是其丰富的产品线、茶叶的历史和有关人体健康的信息。 该站点的内容组织围绕利顿的产品线进行。利顿产品的名称、商标、图形、功能和应用领域等信息一览无余，利顿冰茶通过艺术图片展现在首页的左边，因此，站点所要突出的是产品的内涵。通过利顿健康中心，浏览者可以获得大量有关茶的信息，使他们从潜意识中接受利顿关注消费者健康的理念。其实，在有关茶的历史中，浏览者可以了解利顿茶品的悠久历史，客观上起到激发消费欲望的作用。另外，该站首页使用了利顿品牌所常用的黄色，这既是在网上扩大品牌效应，也是对公司整体形象的统一应用，从而构成了企业识别系统（CIS）的重要部分。页面采用黄、绿色，在绿色中，将黄色的扩张感和蓝色的收缩感相中庸，将黄色的温暖感与蓝色的寒冷感相抵消。这样使得绿色的性格最为平和、安稳。整个页面给人感觉活泼、友善。 图3-2-2 ??? 如图3-2-2，在这个页面中，采用了大面积的浅灰和白色，以存托LOGO的鲜艳色彩，并在导航处配以高亮度的小色块，使得这个页面清新自然，简洁大方。 图3-2-3 ??? 如图3-2-3，这两个页面都是建筑类的网站，前者无论从布局还是色调都能体现出科技感和时代感，从这个页面中，我们能感受到建筑给人以雄伟、宏大的感觉以及建筑和艺术结合的东西。从布局上看，这个页面布局结构清晰，层次分明，这个版面简洁明快。 后者是一个以古代建筑为主题的网页，这个网页突出一个静的气氛，网站的图片很漂亮，而网页本身的设计能够紧紧围绕着图片而进行，看久了，真有那种久违的宁静。建筑类的网页制作要能体现出建筑的风格、品味、艺术性，因为建筑既是科学的，又是艺术的。 图3-2-4 ??? 如图3-2-4，这是一个服装类的网站，服装网站的主要特色就是网页的主体突出。这个页面整体感觉清晰自然又不失时尚，原因就是其色彩和构图的完美搭配。所用到的素材很多，但是整个图片的风格能与页面融合在一起。页面中使用了较多的线条分割，从线条的变化来衬托出内容的多样性。紫橙色的渐变斜条是本例的点睛之笔。 图3-2-5 ??? 如图3-2-5，这是一个电子产品的商务网站，采用大面积的红色给人以较强的视觉冲击，产品素材图片立体的表现形式，能增加空间感。从布局上看，本例的布局方式非常简单，因为文字信息相对较少，所以产品的效果占了大部分位置，正好与产品介绍主题吻合。整个页面给人以精致的感觉。 　 ??? 总的来说，商业网站的设计要与企业的整体形象一致，图片、文字的艺术化处理，能使网页更加美观，更加丰富，但是要添加适当。商业网站一定要将网站的LOGO尽可能放在每个页面最突出的位置，最常用和最简单的方式是将自己网站的英文名称做LOGO。 二.个人网站 ??? 个人网站的设计就比企业网站要自由得多，不同的行业，不同兴趣和爱好的网页制作者，不同的设计目的，所设计出来的网页会有很大不同。一个好的网页设计，不一定很优美，很技巧，但在搭配上很和谐，也可能很个性。正如中国的名言：仁者见仁，智者见智。不同风格的网站，都会在网络上找到属于自己的知音。 图3-2-6 ??? 这个页面整体给人感觉庄重婉约，因为个人主页内容较少，所以采用的是厂字型结构，色彩搭配上采用的蓝色调，在基本蓝的基础上作了明度的变化，使得整个色彩过渡柔和自然，采用少量的黄色点缀，中和蓝色的冷感。 图3-2-7 ??? 这个页面是个人主页的引导页面，规则对称的花朵、云式纹路，滴血的眼睛、发光的背影，颜色回归最质朴的乡村田野，有股孩子气的天真。很多的个人引导页面都采用这个布局方式，将突出自己品味和个性的一幅图片放到页面当中，充分展示自己。 ??? 通过上面的分析，我们可以总结，色彩和布局是影响网页整体风格的最重要两个因素。树立网站的风格可以从以下几个方面入手： ??? 色调：是活泼还是庄重，是素