内 容 简 介本书是一本专门针对网页设计的书籍，涵盖色彩理论、图像设计、动画设计、字体设计及总体版式设计等内容。其中，第1章讲述网站Logo、导航栏、Banner、内容栏、版尾五个方面的内容及相关软件知识，并以案例的形式阐述不同按钮的制作方式；第2章讲述网页版式设计方法，将网页版式设计原则、版式结构、版式设计方法逐一呈现给读者，并以静态网页界面设计案例作为补充；第3章讲述网页创意与规划设计，从发展的角度阐述网站的项目规划、内容组织及网站建设的必要性，并以实际案例为主线，从策划、文案、草图、设计等方面逐一展开，以静态的形式展现网页的设计理念；第4章讲述网页配色的知识，从艺术的角度阐述色彩、色彩搭配的原则及界面设计配色技巧，并将色彩知识融入实际案例的设计制作中；第5章以案例的形式讲述网页的制作过程，包括前期策划书、网站建站目标及功能定位、网站整体风格、网站的结构和内容，并综合运用Photoshop、Flash、Dreamweaver等软件作为开发基础。本书适合从事网页设计的人员及相关专业学生使用。

网页设计是现代艺术设计中具广泛性和前沿性的新媒体艺术形式之一，它伴随媒体技术与艺术的发展而发展。作为一个优秀的网站，在结构设计、导航设计、色彩设计、内容设计等各个方面都应该是非常严谨的。一个优秀的企业网站看上去可能很简单，但却给人一种吸引力，使浏览者在观赏网站的同时，不知不觉地记住企业的相关信息，感受到企业的文化。从一定意义上来讲，企业网站代表一个企业的精神面貌，是企业在网络媒体上的形象。如果一个企业的网站不能反映企业的形象，且因粗糙的文字、粗劣的图片及千篇一律的布局而影响企业在浏览者心目中的形象，反而会对企业形象的传播起到副作用。
本书是一本专门针对网页设计的书籍，从网页的艺术设计到功能设计全面体现作者的良苦用心。其中，第1章讲述网站Logo、导航栏、Banner、内容栏、版尾五个方面的内容及相关软件知识，并以案例的形式阐述不同按钮的设计制作方式。第2章讲述网页版式设计方法，将网页版式设计原则、版式结构、版式设计方法逐一呈现给读者，并以静态网页界面设计案例作为补充，紧紧围绕第1章的五个方面展开，内容简洁，层次分明。第3章讲述网页创意与规划设计，从发展的角度阐述网站的项目规划、内容组织及网站建设的必要性，并以小福屋案例为主线，从策划、文案、草图、设计等方面逐一展开，以静态的形式展现网页的设计理念。因为有了VI部分作为基础，所以小福屋的定位非常明确一个商业网站。小福屋的网页设计也是对VI的补充。第4章讲述网页配色的知识，从艺术的角度阐述色彩、色彩搭配的原则及界面设计配色技巧，并将色彩知识融入儿童线上教育网站案例的设计制作中。第5章以案例的形式讲述网页的制作过程，包括前期策划书、网站建站目标及功能定位、网站整体风格、网站的结构和内容，并综合运用Photoshop、Flash、Dreamweaver等软件作为开发基础。其中，银时代是一个商业网站，是一个实际存在的品牌，其品牌历史、品牌文化等资料都是完善的，所以银时代的网页设计是根据银时代品牌定位策划完成的，页面版式、页面色彩、图片处理效果、Flash动画等都根据银时代的品牌重新定位并设定。在银时代案例部分，设计方面主要侧重整体风格的体现，技术方面使用Photoshop制作页面效果及处理图片效果，利用Flash制作Banner动画。本书为小5班案例设计了两个版本，两种不同的版式制造出不同的网页风格。小5班网站是为艺术设计专业的班集体设计的，这个班集体具有典型大学生群体的个性特征。他们重视自我、勇于展现自己，迫切地希望个人与社会并重，追求个人能力和社会大环境的共同进步，存在自我实现的强烈愿望。小5班网站存在的目的是伴随这个集体一起成长、成熟，一起走上社会，面对工作，面对各种专业问题。相对来说，小5班更侧重展示个性。
总之，全书不仅介绍设计网站时必须掌握的色彩理论、图像设计、动画设计、字体设计、创意设计及页面版式设计等内容，而且以案例的形式完整介绍在实际制作网站过程中应做到的方方面面。
特别声明：本书引用的图片及相关作品仅供教学分析使用，版权归原作者所有；由于获得渠道的问题，因此未能与作者逐一联系；在此对本书引用图片及相关作品的作者表示衷心感谢！
本书由青岛科技大学崔建成著。感谢卢杰、周围等人员的大力支持。由于时间紧迫，书中不妥之处在所难免，恳请各位读者批评指正。

编 者

崔建成，男，1965年生于文登市，毕业于山东师范大学。1987年进入山东省青岛工艺美术 学校CAD中心从事计算机辅助设计工作，现为青岛科技大学文学与艺术学院副教授，实训中心 副主任。

第1章 网页设计概述1
1.1 网页的界面构成1
1.1.1 网站Logo1
1.1.2 导航栏2
1.1.3 Banner4
1.1.4 内容栏5
1.1.5 版尾5
1.2 网页艺术设计的相关软件9
1.3 按钮案例设计与制作12
1.3.1 开始按钮制作12
1.3.2 透明效果按钮设计15
1.3.3 圆形提示按钮制作18
1.3.4 圆形播放按钮制作22
实践与提高25
第2章 网页版式设计27
2.1 网页版式设计应遵循的原则28
2.2 网页版式设计的基本内容31
2.2.1 网页的标题设计31
2.2.2 文字的编排32
2.2.3 图文的结合34
2.2.4 页面的节奏韵律35
2.3 网页版式构成分类35
2.4 网页界面设计案例制作39
2.4.1 布局部分制作39
2.4.2 Logo部分制作41
2.4.3 导航栏制作41
2.4.4 页中部分制作45
2.4.5 页脚部分制作49
实践与提高50
第3章 网页创意与规划设计51
3.1 为网站制定目标51
3.1.1 对市场的预测和分析51
3.1.2 网站的项目规划与组织51
3.1.3 网站建设56
3.1.4 改版案例制作58
3.2 网页设计的创意方法71
3.2.1 创意是网页的灵魂71
3.2.2 网页创意方法72
3.3 小福屋网页案例制作78
3.3.1 建立小福屋网页的模板79
3.3.2 小福屋首页84
3.3.3 小福屋关于HH页面90
3.3.4 小福屋加盟HH页面91
3.3.5 小福屋产品信息页面93
3.3.6 小福屋全国门店页面94
3.3.7 小福屋联系我们页面95
实践与提高95
第4章 网页配色96
4.1 认识色彩96
4.1.1 何为色彩96
4.1.2 色彩三要素97
4.1.3 色彩对比97
4.1.4 色调的变化99
4.2 网页配色常见问题102
4.3 网页配色原则105
4.3.1 三色搭配原则106
4.3.2 色彩搭配应注意的问题108
4.4 页面设计配色技巧109
4.5 儿童线上教育网站案例制作113
4.5.1 主页设计113
4.5.2 登录/注册界面制作120
4.5.3 视频学习页面126
实践与提高131
第5章 综合案例制作132
5.1 银时代网页设计132
5.1.1 银时代首页界面设计133
5.1.2 银时代品牌故事页面149
5.1.3 银时代产品展示页面154
5.1.4 页面分割切片159
5.1.5 页面制作164
5.1.6 优化和链接174
5.1.7 银时代Flash动画制作178
5.2 小5班网页设计188
5.2.1 软件布局190
5.2.2 制作首页191
5.2.3 团队成员页面制作206
5.2.4 作品展示页面设计211
5.2.5 小5班Flash动画制作217
5.2.6　新小5班创作244