第一章主页欣赏及页面分析.docVIP

第一章：主页欣赏及页面分析 课题名称：1．4 设计风格 教学目标 1．知识与技能目标 了解网页设计中形式与内容统一形式与内容统一 根据主题的内容决定网页风格。由于不同的设计领域和设计者差异，网页风格设计不尽相同。例如政府部门的网页风格一般显得比较严肃庄重；文化教育的网页风格倾向高雅大方；娱乐行业的风格设计比较轻松活泼；商务网页则贴近民俗，喜闻乐见，以功能性和理性见长。风格设计中过于强调设计者的个性展示，或者只求内容而缺乏艺术表现，网页设计都会变得空洞无力。同时风格设计中要确保网页上的每一个元素都有存在的必要性，不要为了炫耀而使用冗余的技术。那样得到的效果可能会适得其反。因为只有形式与内容的完美统一，才能体现出网页设计独具的分量和特有的价值。 观察图例中的网页效果，其中： 图1-4-1（软件公司\index.html）为公司形象和产品服务推广的企业网页，其风格设计就显得简洁、实用、追求功能上的严谨。这与图1-4-2（动漫地带\index.html）轻松活泼的设计风格形成鲜明对比。活泼的设计风格往往应用于儿童网页和一些文体娱乐网页设计中。 图1-4-3（女性网页\index.html）和图1-4-4（视觉设计工作室\index.html）用细线条来分割，用色块来产生空间力度，在增加神秘感的同时表现流行时尚，这对主题的体现无形中起了很好的衬托效果。 图1-4-5（一笑家园 \index.htm）的小桥流水、诗情画意为点缀家园更添古朴风情，充分表现了特有的设计风格。而图1-4-6（磊富艺术\index.htm）则采用装饰化、流行化的风格，通过运用色调等手段体现古典而不俗的装饰文化。 图1-4-7（个人笔记本\index.htm）和图1-4-8（闲雅斋\index.htm）打破常规，为浏览者创设了虚拟的电脑屏幕空间。在功能元素的布置上却遵循了人们的操作习惯，在功能上使浏览者更加方便。这种把握风格的独特性的同时兼顾到常规习惯的设计非常值得借鉴。 图1-4-9（温馨的家\index.htm ）显得简洁而整齐属于较为普通的设计风格。而图1-4-10（memo\default.htm）粗看非常凌乱，但贴近生活习惯，也容易被浏览者所接受。这种设计风格因其追求新颖和强调个性特征而在个人网页设计上较为成功。 图1-4-11（吉日小居个人主页\index.htm）和图1-4-12（思维创意空间\index.htm）则超越现实，以幻想空间来表达意愿。这样的设计风格使得网页环境往往显得特别优美，在体现一些倾向思维类主题的时候反而给浏览者超凡脱俗的感觉。 图1-4-13（简单生活\index.htm）和图1-4-14（爱情主页\index.htm）则采用更简洁的方式处理页面，去掉一些纷繁复杂的东西来突出所要表达的主题份量。这种设计风格在网页构成元素的处理上显得有些苛刻。在页面的布局上，采用自己独特的方式来约束网页中的应用元素，从而强化主题意境的呈现。在需要表达的主题思想较为单一，而且特征性强容易体现的一些网页的风格设计中使用。 图1-4-15（音乐歌曲\index.html）和图1-4-16（游戏玩家\index.html）则更倾向于功能性表达的设计风格。浏览者几乎通过网页页面上的任何一个元素都可以感知网页主题，并能通过页面特征非常容易涉入其中。这种设计风格的网页不仅主题专一、内容有很强的专业性，而且在页面元素的设计上能给视觉极大的冲击力。尽管专业性强，但是设计者往往会通过网页的外表，内容，文字，交流展示风格设计中包含的人性特点。有些显得温文儒雅；有些则执著热情或活泼易变；甚至是无拘无束、放任不羁。 当然风格往往不是以很单纯的一种方式反映出来，有时候采用多种形式相互结合，呈现出丰富多彩的表达方式。具体到网页设计，就要求设计者运用自己所拥有的各种方法和资源，包括所拥有的审美的素质、应用软件的能力、以及感受生活的敏锐的觉察力，来建立起自己独特的设计形式、独特的作风。换句话说设计者也应该有自己的风格。 观察与分析资源包提供的CI形象。 一、明确风格和主题、内容的一致性。 二、思考希望网站给浏览者的印象。（以下仅仅作为参考） 1、用一句话来描述网站点。 　　参考：有创意、专业、有(技术)实力、有美感、有冲击力 　　2、网站可以联想到的色彩。 　　参考：热情的红色、幻想的天蓝色、聪明的金黄色 　　3、网站可以联想到的画面。 　　参考：一份早报、一辆法拉利跑车、人群拥挤的广场、杂货店 　　4、风格具有人性化，网站所拥有的个性。 　　参考：思想成熟的中年人、狂野奔放的牛仔、自信憨厚的创业者 　　5、从设计者角度，希望网站给浏览者的印象。 　　参考：敬业、认真投入、有深度、负责、纯真、直爽、淑女 　　6、用一种动物来形容网站。 　　参考：雄鹰(目光锐利)、狮子(自信和威