文档介绍：本章通过实例介绍综合运用网页三剑客──Photoshop、Flash和Dreamweaver来制作网页的基本方法。
第13章使用网页三剑客制作网页
学****目标
掌握使用Photoshop CS3处理网页图像的方法。
掌握使用Flash CS3制作Flash动画的方法。
掌握使用Dreamweaver CS3布局网页的方法。
实例概述
在这个实例中,将创建一个影视站点。通过这个实例的学****可以掌握以下内容。
• 分析网站结构,勾画网站草图。
• 使用Photoshop CS3制作网站标志、宣传标语和导航图像。
• 使用Flash CS3制作主页Flash动画。
• 使用Dreamweaver CS3制作主页面。
• 使用Dreamweaver CS3创建二级页面模板。
• 使用模板创建二级页面。
制作的网站主页面如图所示。
实例概述
实例概述
二级页面模板如图所示。
网站策划
在实际工作中,制作网站的第1步就是要搞清楚需要在网页中发布哪些信息,如何安排网站的层次结构。这里给读者做一个范例,虽然例子比较简单,但是网站策划的原理和方法是相同的。
首先要确定网站的层次结构,可以简单划出网站的结构图。在这个实例中,将制作个人影视网站,网站的结构可以分为两级,如图所示。
网站策划
网站的第1个页面是首页,称为一级页面,它又分为“节目”、“海报”、“剧本”“演员”、“商务”和“社区”6个栏目。“节目”介绍各种类型的影视信息;“海报”介绍影视剧照信息;“剧本”介绍一些编剧通过网络提交的影视剧本信息;“演员”介绍演职员信息;“商务”介绍影视商务信息;“社区”是在线影视论坛。
在设计好网站结构以后,要对页面进行设计,要先搞清楚需要在页面上放置哪些内容。如图所示是设计的首页方案。在这个页面中,按照页眉、主体和页脚的顺序进行页面布局。页眉部分放置的是网站logo、banner和导航栏,主体部分放置的是flash宣传动画,页脚部分放置的是一些联系信息。
网站策划
“节目”等6个栏目的页面称为二级页面,它们可以采用相同的内容结构,而各自的内容不同就可以了。如图所示是设计的二级页面方案。在二级页面中,改变了导航栏的位置,由首页的页眉处移到二级页面主体部分的左侧,右侧放置各自栏目的具体内容。
定义站点
首先需要在Dreamweaver CS3中定义一个本地站点,然后根据主页栏目在站点中创建文件夹和文件。在定义一个本地站点时,必须设置存储这个站点的所有文件的位置。