第二十四讲 网页制作综合实例.pptVIP

（五）知识讲解与操作示范（5） （五）知识讲解与操作示范（6） （五）知识讲解与操作示范（7） （五）知识讲解与操作示范（8） （五）知识讲解与操作示范（9） （五）知识讲解与操作示范（10） （五）知识讲解与操作示范（11） （五）知识讲解与操作示范（12） （五）知识讲解与操作示范（13） * * 第17章：网页制作综合实例 主要教学环节 五、知识讲解与操作示范 一、课程引导 二、明确知识技能目标 三、展示网页浏览效果 四、分析操作任务 六、课堂模仿实践 七、疑难解析 八、归纳总结 九、布置习题 （一）课程引导 本章将通过一个综合实例，详细讲解一个网站的完整制作过程，从规划网站、定义站点、制作模板、制作页面、建立链接、检查站点，到最后的发布网站，逐步引导读者理清制作网站的操作步骤，使读者在前面各章实例的学习基础上，进一步综合运用网页制作的相关知识、技能，建立有特色的网站。本章是前面各章的综合应用和实战操作。 （二）明确知识技能目标 （1）掌握网站的规划。 （2）掌握站点的创建。 （3）学会创建站点目录结构、准备素材。 （4）熟练制作首页。 （三）展示网页浏览效果 1．预览网页 （四）分析操作任务 （1）对“网页设计与制作教学网”进行全面规划，精心准备素材。 （2）综合运用前面各章所学习的知识，所掌握的技能制作网站的首页。 （五）知识讲解与操作示范（1） 17.1　规划网站 1．策划网站主题 在首手设计网站之前，要确定好网站的主题，每个网站都应该具有一个明确的主题。 2．确定网站风格 确定好站点主题后，就要根据该主题选择站点的风格。 本网站的主要特点如下： （1）设计风格要大众化，为了提高浏览速度，尽量减少图片的使用，更多地使用表格实现效果。 （2）背景颜色以灰色和白色为主、黄色为辅，文字颜色以黑色为主、蓝色和红色为辅。 （3）文字内容丰富、知识性强，标题简洁明了，字体一般采用宋体，大小一般为12像素。 （五）知识讲解与操作示范（2） 3．构思网站栏目结构 先在纸上绘制网站的栏目结构草图，经过反复推敲，最后确定完整的栏目和内容的层次结构。 4．规划网站目录结构和链接结构 根据网站策划确定的栏目结构，创建站点目录，一个网站的目录结构要求层次清晰、井然有序，首页、栏目页、内容页区分明确，有利于日后的修改。 5．主要页面布局设计 使用表格对首页与其他几个主面导航页面的布局结构草图进行设。 （五）知识讲解与操作示范（3） 17.2　准备素材 根据网站的栏目、内容设计，链接结构设计，首页的布局结构，几个主要导航页面的布局结构，准备所需素材 1．准备文本 2．准备Logo 3．准备图片及按钮 4．准备动画 5．建立库项目 （五）知识讲解与操作示范（4） 17.3　创建网站 1．创建本地站点 在开始着手设计网页之前，首先要定义站点。 创建站点之前，要求先建立一个文件夹，以便创建站点时为站点指定存储位置。 定义站点的操作步骤如下： （1）在Dreamweaver 8主窗口中，单击菜单【站点】→【新建站点】，将弹出站点定义对话框。在该对话框中先输入站点的名称，然后输入网址。接着单击【下一步】按钮，进入到下一步操作。 （2）选择“否，我不想使用服务器技术”单选按钮，然后单击【下一步】按钮，进入到下一步操作。 （3）选择“编辑我的计算机上的本地副本，完成后再上传到服务器（推荐）”单选按钮，接着在下面的文本框中输入站点文件在本地计算机上的存放位置，也可以选择存储位置，然后单击【下一步】按钮，进入到下一步操作。 （4）选择连接到远程服务器的方式为“FTP”,然后分别输入Web服务器的主机名、在服务器上文件的存储位置、FTP用户名、FTP密码等参数。然后单击【下一步】按钮。 （5）选择“否，不启用存回和取出”单选按钮。接着单击【下一步】按钮，此时会显示所定义的站点信息。如果发现有误可以单击【上一步】按钮，返回到上一步操作的对话框中重新修改。如果站点定义信息符合要求，可以单击【完成】按钮，完成站点的定义。 2．网站目录结构的搭建 创建站点后，在“文件”面板中切换到新创建的站点，然后利用快捷菜单创建文件夹及子文件夹。 17.4　网站首页的设计与制作 首先在网站根目录下创建首页文件index.html，在设计视图状态下，打开index.html，开始对首页进行布局。 17.4.1　网站首页的布局设计 首页的布局方案如下： （1）整个页面分为9个区域，从上往下依次为：表格1、页面区域1、页面区域2、页面区域3、表格2、表格3、页面区域4、页面区域5、页面区域6。 （2）