第1章优秀网站赏析万维网使得浏览Internet变得非常简单,只要用鼠标单击,就可以显示图文并茂的网页,网页中可以包含声音、视频、动画等,这也是万维网在Internet中最受欢迎、使用最多的原因。课程引导在学习创建网站、制作网页之前,我们先浏览几个优秀的网站,对这些网站的主页进行分析,了解优秀网页的布局结构、色彩搭配、导航栏的设计、动画效果等。知识技能目标(1)欣赏优秀的网页,学习他人之长,激发学习网页设计的兴趣。(2)分析优秀网页的布局结构、颜色搭配、视觉效果,留下直观的第一印象,为学习制作网页奠定基础。(3)对网页的组成元素有一个初步印象。知识讲解1.1公司类网站赏析1.2旅游类网站赏析1.5班级网站赏析1.3体育类网站赏析1.4教育培训类网站赏析1.1公司类网站赏析首先让我们一起欣赏家电行业的优秀企业——海尔集团的网站,启动IE浏览器,在地址栏中输入海尔集团的网址:(回车),展显在眼前便是该网站独具特色的首页。该首页给人以清新、爽朗的感受,首页的整体布局为“上、中、下”三个版块,中间的主体内容又分为“左、中、右”三个版块。颜色主要采用浅蓝和玫瑰红为主,浅蓝色给人清爽、雅致的感受,玫瑰红给人温馨、浪漫的感受,颜色对比较为强烈,重点突出。首页题头的动化效果体现了海尔集团的理念和品质,让人既想到家的感觉又能记住该品牌。导航栏的颜色鲜明,文字与背景色对比强烈,引人注目。二级导航采用横式排列,其优点是不会遮住下面正文的内容。接下来让我们欣赏“凤凰古城旅游网”,让网站的网址是:,其首页如图1-1所示。1.2旅游类网站赏析图1-1凤凰古城旅游网的首页该首页给人的视觉效果是一种古朴的气息迎面扑来,整体色彩、图文搭配十分协调,咖啡色的运用和图片的搭配十分和谐。主页题头的凤凰古城图片恰到好处,突出了主题,同时也起到了广告作用。导航栏的文字颇具特色。首页的模块划分采用的是左右两大模块,内容划分清晰。接下来让我们一起欣赏“中国大众体育网”,让网站的网址是:,其引导页如图1-2所示,首页如图1-3所示。该网站的引导页整体视觉感受简洁、现代感较强。背景用大块的深绿色,给人安静、稳重的感觉。1.3体育类网站赏析在字体的运用上有大有小,有长有短,显得有对比,文字居中对齐,显得庄重。图片的动态效果突出主题,产生运动的视觉感受。该网站的首页整体视觉感受清晰、和谐。在板块布局上采用“左、中、右”结构,整体颜色采用绿色,既统一又有变化,主体突出。接下来让我们欣赏新东方教育网站,让网站的网址是:。该网站的首页主要列出了导航菜单和网站地图,简洁明了、排列整齐,便于浏览者查找自己所需的信息。底色采用白色,按钮采用蓝色,非常醒目。1.4教育培训类网站赏析图1-2中国大众体育网的引导页图1-3中国大众体育网的首页新东方教育网站的新闻网页如图1-4所示。图1-4新东方教育网的新闻网页该网页给人的视觉感受是和谐美观,在模块的划分上比较明显,采用“左、中、右”三个板块,左、中、又三块又分别划分多个内容板块,每个内容板块都采用了不同颜色和形式做标题装饰,可以一目了然看到所有内容的板块位置,在视觉方面也给人以醒目和新颖的感觉。颜色的搭配主要采用黄、绿色调,采用了类似色的搭配,给人以清新、和谐的视觉美感。主体之外左右两边采用了视觉强烈的动画广告,在颜色的运用上也与整体颜色搭配十分协调。接下来让我们一起欣赏武汉理工大学海事二班的网站,让网站的网址是:,其主页如图1-5所示。1.5班级网站赏析图1-5班级网站的首页该网站首页给人的感觉是重彩型视觉感受强烈。整个页面色彩运用大面积的蓝色渐变为底色,使文字内容不多的页面显得不空洞,整个色彩运用蓝色和绿色为主的搭配,类似色的运用给人以和谐统一的视觉效果。题头采用简单清晰的图片,给人以清新、大气、和谐的简单之美。模块划分也清晰,其中也采用了动画画面,从静态中突出灵动感。整体给人温馨、和谐梦幻的感觉。★课堂实践★浏览几个网站,对所浏览网站首页的特色和不足进行赏析说明,主要包括页面布局结构、颜色搭配、导航栏、文字效果、图片效果、动画效果等。从以下网站中选择两个网站进行赏析。(1)当当购物网站:(2)南开大学网站:(3)且听风吟文学网:(4)叱进军个人网站:my.6to23.com(5)携程旅游网:(6)中国体育资讯网:(7)太平洋电脑网:(8)班级网站:jkb0301.cqie.net★课外拓展实践★1.浏览以下网站,分析这些网站首页的特色和不足。(1)天津大学网站:(2)易趣网:(3)木叶之家个人网:(4)求职网:(5)开心购物网:(6)湖南张家界旅游网:(7)曙光人才网:.利用搜索引擎网站查找四川长虹集团、深圳TCL集团、九天音乐网的网址。★本章小结★本章主要欣赏了几个优秀网站的首页,通过分析对这些网站的布局结构、颜色搭配、视觉效果留下了初步印象。★习题★利用搜索引擎获取广东“李宁体育用品公司”的网址和“遛狗网”的网址,并简要说明这两个网站首页的特色。