(以2课时为单元) 课题： 第土二章第12节 目的要求， （1)了解站点规划流程 (2)掌握网页规划与设计 教学内容： 1.站点规划 2.站点设计与素材准备 重点与难点： 重点：站点规划 难点：站点的规划与设计 教学方法：多媒体教学 手段：学生练习为主，教师引导为辅。 教学步骤： 布置网站建设项目，规划网站，采集素材 复习提问： 网页配色基础 作业题目： 预习内容： 课时分配： 教学环节 复习提问新课讲解课堂讨论小节 作业布置 时间分配3 89 5 3 0
（以 2 课时为单元） 课题： 第十一章 第 1-2 节 目的要求： （1）了解站点规划流程 （2）掌握网页规划与设计 教学内容： 1. 站点规划 2. 站点设计与素材准备 重点与难点： 重点：站点规划 难点：站点的规划与设计 教学方法：多媒体教学 手段：学生练习为主，教师引导为辅。 教学步骤： 布置网站建设项目，规划网站，采集素材 复习提问： 网页配色基础 作业题目： 预习内容： 课时分配： 教学环节 复习提问 新课讲解 课堂讨论 小节 作业布置 时间分配 3 89 5 3 0
第11章 网站建设综合实训 随着网络科技的发展，Internet已经成为企业宣传自己的重要途径之一。拥有一个好的 商业网站就是企业最好的名片。建立商业网站不仅可以让客户了解企业，提高企业的知名度： 而且更能突破时空的限制，为企业在网络时代创造更多的商机。 在木章中，将详细介绍一个商业网站的建设讨程。 【本章学习目的】 本章通过详细讲解商业网站建设过程，读者掌握规划网站、页面布局的技术、网站的制 作流程。 一、站点规划 方面。制作网站首先是规划出一个具休的方案，以此作为进一步工作的依据。它包括以下儿 1.确定建设网站的目标 创建网站的第一步就是确定网站的目标。本章要创建的网站是一个小型的商业网站， 网站的目标就是要让客户了解该企业的概况、产品信息、相关技术、产品购买方法以及联系 方式等。通过该网站能够建立从客户到公司的有效沟通渠道。 2.分析目标用户对站点的需求 访问该网站的用户主要是已有的客户和潜在的浏览者，所以在制作网站时，考虑如何为 已有的客户提供完善、周到的服务，比如：新产品的推广、技术支持、在线订购，同时考虑 到如何吸引到更多的消费群体，并分析这种消费潜力到底有多大。 3.确定网站风格 在确定了网站的目标和功能之后，接下来就要针对用户需求对网站的风格进行定位。本 网站定位于提供企业信息类网站。 本网站所有页面均采用灰色加草绿色的配色方案，严谨中透者人文化气息，页面全部采 用“T”布局，顶部为横条网站标志，下方左边为导航条，右面显示具体内容的布局。 (1)考虑网络的技术问题 考虑多种浏览器和不同分辨率的兼容性，采用浏览器的分辨率：800*600，兼顾 1024*768。运用的技术有：表格、模板、CSS样式、F1ash动画等。 二、素材准备与站点设计 1、绘制首页草图 首页的设计时应该注意以下几个问题： ●框架清晰，重点突出： 色彩搭配既要能够吸引浏览者的注意力，又不要过于花哨，过于浓烈的色彩反而容易引 起浏览者的反感 ●文字和图片相辅相成。 2、素材准备 ·有了总体结构，还要进行基本素材的收集，比如文本、动画、图片、音乐、视频素材等
第11章 网站建设综合实训 随着网络科技的发展，Internet 已经成为企业宣传自己的重要途径之一。拥有一个好的 商业网站就是企业最好的名片。建立商业网站不仅可以让客户了解企业，提高企业的知名度； 而且更能突破时空的限制，为企业在网络时代创造更多的商机。 在本章中，将详细介绍一个商业网站的建设过程。 【本章学习目的】 本章通过详细讲解商业网站建设过程，读者掌握规划网站、页面布局的技术、网站的制 作流程。 一、站点规划 制作网站首先是规划出一个具体的方案，以此作为进一步工作的依据。它包括以下几个 方面。 1. 确定建设网站的目标 创建网站的第一步就是确定网站的目标。本章要创建的网站是一个小型的商业网站， 网站的目标就是要让客户了解该企业的概况、产品信息、相关技术、产品购买方法以及联系 方式等。通过该网站能够建立从客户到公司的有效沟通渠道。 2. 分析目标用户对站点的需求 访问该网站的用户主要是已有的客户和潜在的浏览者，所以在制作网站时，考虑如何为 已有的客户提供完善、周到的服务，比如：新产品的推广、技术支持、在线订购，同时考虑 到如何吸引到更多的消费群体，并分析这种消费潜力到底有多大。 3. 确定网站风格 在确定了网站的目标和功能之后，接下来就要针对用户需求对网站的风格进行定位。本 网站定位于提供企业信息类网站。 本网站所有页面均采用灰色加草绿色的配色方案，严谨中透着人文化气息，页面全部采 用“T”布局，顶部为横条网站标志，下方左边为导航条，右面显示具体内容的布局。 (1) 考虑网络的技术问题 考虑多种浏览器和不同分辨率的兼容性，采用浏览器的分辨率：800*600，兼顾 1024*768。运用的技术有：表格、模板、CSS 样式、Flash 动画等。 二、素材准备与站点设计 1、绘制首页草图 首页的设计时应该注意以下几个问题： ⚫ 框架清晰，重点突出； ⚫ 色彩搭配既要能够吸引浏览者的注意力，又不要过于花哨，过于浓烈的色彩反而容易引 起浏览者的反感； ⚫ 文字和图片相辅相成。 2、素材准备 ⚫ 有了总体结构，还要进行基本素材的收集，比如文本、动画、图片、音乐、视频素材等
这其中有些可以自己制作，比如使用fireworks制作图片、ash制作动画等：有些可以 通过其他途径获得，比如在网上下载，购买素材光盘等等
这其中有些可以自己制作，比如使用 fireworks 制作图片、flash 制作动画等；有些可以 通过其他途径获得，比如在网上下载，购买素材光盘等等
教案首页 (以2课时为单元) 课序：32 第十二章第36节 目的要求：通过本节上机实操练习 (1)网页设计与制作 (2)掌握WEB服务器的配置 (3)掌握站点的测试、上传与发布 教学内容： 1.网页设计与制作 2.WEB服务器的配置 3.站点的测试、上传与发布 重点与难点： 重点：网页设计与制作 难点：WEB服务器的安全配置 教学方法：多煤体教学 手段：学生上机练习为主，教师辅导为辅。 教学步骤： 1.设置WEB服务器 2.站点测试与上传。 复习提问： 作业题目： 预习内容： 课时分配： 教学环节 复习提问 新课讲解课堂讨论 小节 作业布置 时间分配
教案首页 （以 2 课时为单元） 课序：32 第十一章 第 3-6 节 目的要求：通过本节上机实操练习 （1）网页设计与制作 （2）掌握 WEB 服务器的配置 （3）掌握站点的测试、上传与发布 教学内容： 1. 网页设计与制作 2. WEB 服务器的配置 3. 站点的测试、上传与发布 重点与难点： 重点：网页设计与制作 难点：WEB 服务器的安全配置 教学方法： 多媒体教学 手段：学生上机练习为主，教师辅导为辅。 教学步骤： 1. 设置 WEB 服务器 2. 站点测试与上传。 复习提问： 作业题目： 预习内容： 课时分配： 教学环节 复习提问 新课讲解 课堂讨论 小节 作业布置 时间分配
三、网页制作 1、创建站点 在Dreamxeaver8.0中，执行“站点”莱单|“新建站点”命令，弹出“站点定义” 的对话框。 2、创建网站结构 ·目录结构 网站的目录结构是指你建立网站时创建的目录。目录结构的好坏，对于网站本身的上传、维 护、内容未来的扩充和移植有着重要的影响。将文件分门别类地放在不同的文件夹下。 ·链接结构 网站的链接结构是指页面之间相互链接的拓扑结构。如果把每个页面比喻成一个固定 点，那么链接就是两个固定点之间的连线。一个点可以和一个点连接，也可以和多个点连接， 3、页面模板的制作 使用模板来创建网站的好处是快速建立具有统一风格的多个网页，提高网站设计与制作 的效率。 添加页面间链接 网站中的页面已基本做好了，但是它们现在只是一张张散页，还没有形成一个有机的整 体。下面我们就要添加页面间链接。页面链接的添加是在模板中进行。 四、WEB服务器的配置 本节将详细介绍在本地计算机发布网站的方法。即本地计算机设置为Wb服务器。在同 网络中的用户都可以通过浏览器访问此Wb服务器，如果本地计算机有一个公有的P地 址，并设置DNS的域名解析，那它就是一个真正意义上可被internet上用户访问的web服 务器了。 五、站点的上传与发布 1、申请网站空间 网页制作完成，就需要把它放到Internet上，让全世界的人都看到。 对于大型企业来说，可能会选择自架服务器（即山.4所述）或主机托管，对于中小型 企业或个人网站，常常会选用虚拟主机。本小节内容是针对建站的个人爱好者，选择免费的 个人空间。 2、上传和发布站点 主页空间也申请成功后，接下来最重要的就是上传网页，给Internet上用户浏览。上 传网页的方法有很多种，这里介绍比较常用的CuteFTP软件上传。 CuteFTP是一个基于文件传输协议(FTP)的客户端应用软件，通过它，用户无需知道协议 本身的细节，就可以充分利用TP强大的功能，轻松地在全球范围内的远程FTP服务器间上 传、下载文件。 六、站点的维护与更新 当一个站点设计完成发布之后，就进入了系统维护和更新阶段
三、网页制作 1、创建站点 在 Dreamweaver 8.0 中，执行 “站点”菜单｜“新建站点”命令，弹出“站点定义” 的对话框。 2、创建网站结构 ⚫ 目录结构 网站的目录结构是指你建立网站时创建的目录。目录结构的好坏，对于网站本身的上传、维 护、内容未来的扩充和移植有着重要的影响。将文件分门别类地放在不同的文件夹下。 ⚫ 链接结构 网站的链接结构是指页面之间相互链接的拓扑结构。如果把每个页面比喻成一个固定 点，那么链接就是两个固定点之间的连线。一个点可以和一个点连接，也可以和多个点连接。 3、页面模板的制作 使用模板来创建网站的好处是快速建立具有统一风格的多个网页，提高网站设计与制作 的效率。 4、首页的制作 5、添加页面间链接 网站中的页面已基本做好了，但是它们现在只是一张张散页，还没有形成一个有机的整 体。下面我们就要添加页面间链接。页面链接的添加是在模板中进行。 四、WEB 服务器的配置 本节将详细介绍在本地计算机发布网站的方法。即本地计算机设置为 Web 服务器。在同 一网络中的用户都可以通过浏览器访问此 Web 服务器，如果本地计算机有一个公有的 IP 地 址，并设置 DNS 的域名解析，那它就是一个真正意义上可被 internet 上用户访问的 web 服 务器了。 五、站点的上传与发布 1、申请网站空间 网页制作完成，就需要把它放到 Internet 上，让全世界的人都看到。 对于大型企业来说，可能会选择自架服务器（即 11.4 所述）或主机托管，对于中小型 企业或个人网站，常常会选用虚拟主机。本小节内容是针对建站的个人爱好者，选择免费的 个人空间。 2、上传和发布站点 主页空间也申请成功后，接下来最重要的就是上传网页，给 Internet 上用户浏览。上 传网页的方法有很多种，这里介绍比较常用的 CuteFTP 软件上传。 CuteFTP 是一个基于文件传输协议（FTP）的客户端应用软件，通过它，用户无需知道协议 本身的细节，就可以充分利用 FTP 强大的功能，轻松地在全球范围内的远程 FTP 服务器间上 传、下载文件。 六、站点的维护与更新 当一个站点设计完成发布之后，就进入了系统维护和更新阶段
1、站点的维护 保持站点有效地运转是一项长期的工作。对于商业网站来讲，对维护工作的要求更严格。 在此简要介绍一些站点维护过程中要注意的事项。 ·保证服务的安全 网站的安全性是网站能够生存的一个必要条件。服务安全不仅要保护用户的数据不会被 泄露，还要保证服务的有效性。用户能在任何时候得到必要的服务，而且服务的内容同网站 的介绍是一致的， ·及时回复用户反馈 在企业的Wb站点上，要认真回复用户的电子邮件和传统的联系方式如信件、电话垂询 和传真，做到有问必答。最好将用户进行分类，如售前一般了解、售中和售后服务等，由相 关部门处理，使网站访问者感受到企业的真实存在，产生信任感。 2、站点的更新 网页浏览者的随意性决定了网站要能够持久的吸引用户，必须要不断地更新内容，对用 户保持足够的新鲜度。在内容上要突出时效性和权威性，并且要不断推出新的服务栏目，不 能只是在原有的基础上增加和删减，必要时甚至要重新建设。 另外，要持续推广站点，保持公众的新鲜感。可以考虑如下建议： ·在各大搜索引擎上登记自己的网站，让别人可以搜索到网站。 用Q,MSN等通讯工具，把网站地址传给其他潜在访问者。 可以在BBS上作宜传，把网站地址写在签名里。 ·多和别的网站做友情链接
1、站点的维护 保持站点有效地运转是一项长期的工作。对于商业网站来讲，对维护工作的要求更严格。 在此简要介绍一些站点维护过程中要注意的事项。 ⚫ 保证服务的安全 网站的安全性是网站能够生存的一个必要条件。服务安全不仅要保护用户的数据不会被 泄露，还要保证服务的有效性。用户能在任何时候得到必要的服务，而且服务的内容同网站 的介绍是一致的。 ⚫ 及时回复用户反馈 在企业的 Web 站点上，要认真回复用户的电子邮件和传统的联系方式如信件、电话垂询 和传真，做到有问必答。最好将用户进行分类，如售前一般了解、售中和售后服务等，由相 关部门处理，使网站访问者感受到企业的真实存在，产生信任感。 2、站点的更新 网页浏览者的随意性决定了网站要能够持久的吸引用户，必须要不断地更新内容，对用 户保持足够的新鲜度。在内容上要突出时效性和权威性，并且要不断推出新的服务栏目，不 能只是在原有的基础上增加和删减，必要时甚至要重新建设。 另外，要持续推广站点，保持公众的新鲜感。可以考虑如下建议： ⚫ 在各大搜索引擎上登记自己的网站，让别人可以搜索到网站。 ⚫ 用 QQ,MSN 等通讯工具,把网站地址传给其他潜在访问者。 ⚫ 可以在 BBS 上作宣传,把网站地址写在签名里。 ⚫ 多和别的网站做友情链接
综合实训 1.背景知识 根据本学期所学过的关于网页设计与制作的知识，并结合所学的网络知识，着手进行商 业网站的规划、设计与制作。 2.实训准备工作 首先要确定网站的主题，然后在internet上准备素材和创作网站。 3.实训腰求 (①)网站设计方案的确定 要求：首先确定访客群体的需求特点：其次确定站点结构、配色方案：最后确定网页的 布局方案。 (2)设计网站首页及其它页面 要求， ·首先使用fireworks绘制首页和其它页面草图 ·制作网页主页：切割图片、制作动画、添加样式、录入文字： ·制作其他页，完善优化网站。 (3)写出实训报告和提交作品 要求：提交实训报告的电子文档和打印文档，提交作品的电子版。 4.课时安排：30课时。 5.实训指导 (1)网站设计方案的确定 可根据下面推荐的主题选择网站主题或自定义一个网站主题，如表所示 表推荐网站主思 综合门户 娱乐静戏 卡通漫正 网络数码 建筑装峰 美容时尚 手机西讯 登校教有 生活购物 服饰品牌 医疗保健 食品饮料 文化艺术 休闲体育 交友社区 公可展示 个性展示 儿童宠物 汽车品牌 影视音乐 风景旅游 确定网站主题后，其次确定站点结构，并画出网站结构图，确定配色方案：最后确定网 页布局。 (2 设计网站首页及其它页面 步骤1草图的设计采用fireworks或photoshop来绘制，技术可选择采用FLASH动画、 多媒体特效、JAVASCRIPT/VBSCRIPT技术、JAVA APPLET等。 步骤2主页的制作 L.创建一个本地站点命名为w,站点内包含一个子目录im阳gs作为图像文件夹： :人在适当的 修或绘制的主页草图，添加行为 出为TL文件
综 合 实 训 1. 背景知识 根据本学期所学过的关于网页设计与制作的知识，并结合所学的网络知识，着手进行商 业网站的规划、设计与制作。 2. 实训准备工作 首先要确定网站的主题，然后在 internet 上准备素材和创作网站。 3. 实训要求 (1) 网站设计方案的确定 要求：首先确定访客群体的需求特点；其次确定站点结构、配色方案；最后确定网页的 布局方案。 (2) 设计网站首页及其它页面 要求： ⚫ 首先使用 fireworks 绘制首页和其它页面草图； ⚫ 制作网页主页：切割图片、制作动画、添加样式、录入文字； ⚫ 制作其他页，完善优化网站。 (3) 写出实训报告和提交作品 要求：提交实训报告的电子文档和打印文档，提交作品的电子版。 4. 课时安排：30 课时。 5. 实训指导 （1） 网站设计方案的确定 可根据下面推荐的主题选择网站主题或自定义一个网站主题，如表所示。 表 推荐网站主题 综合门户 娱乐游戏 卡通漫画 网络数码 建筑装饰 美容时尚 手机通讯 学校教育 生活购物 服饰品牌 医疗保健 食品饮料 文化艺术 金融财经 休闲体育 交友社区 公司展示 个性展示 儿童宠物 汽车品牌 影视音乐 风景旅游 确定网站主题后，其次确定站点结构，并画出网站结构图，确定配色方案；最后确定网 页布局。 （2） 设计网站首页及其它页面 步骤 1 草图的设计采用 fireworks 或 photoshop 来绘制，技术可选择采用 FLASH 动画、 多媒体特效、JAVASCRIPT/VBSCRIPT 技术、JAVA APPLET 等。 步骤2 主页的制作 1. 创建一个本地站点命名为www，站点内包含一个子目录images作为图像文件夹； ⚫ 修改绘制的主页草图，添加行为，输出为HTML文件； ⚫ 制作动画，插入到在网页适当的位置；
·在网页中录入文字： ·完成主页设计。 3 内容页制作 规划内容页的版面， 可选用模板或框架结构： 。根据模板或框架结构生成内容页。 步骤4添加页面链接 步骤5站点的测试与上传 测试站点：检测网页有无垃圾代码，链接是否准确 站 点上传：在internet.上，申请免费个人空间：利用FTP工具，上传整个站点：打开浏 览器，浏览站点是否有误。 ·写出实训报告和提交作品 实训报告的内容大致包括以下几个方面： (叙述网站的建设意义所在) 3)网站的风格及配色方案 4)网站的架构设计（画出网站结构图） 5)首页的设计简述及内容页的设计构思 6)网站完成后的自查：网站在本地和上传到服务器中有无图片和动画无法显示或链接失效 笔情况 7)网站完成后，你打算如何做进一步的推广，请写出网站推广的方案
⚫ 在网页中录入文字； ⚫ 完成主页设计。 步骤3 内容页制作 ⚫ 规划内容页的版面，可选用模板或框架结构； ⚫ 根据模板或框架结构生成内容页。 步骤4 添加页面链接 步骤5 站点的测试与上传 ⚫ 测试站点：检测网页有无垃圾代码，链接是否准确。 ⚫ 站点上传：在internet上，申请免费个人空间；利用FTP工具，上传整个站点；打开浏 览器，浏览站点是否有误。 ⚫ 写出实训报告和提交作品 实训报告的内容大致包括以下几个方面： 1） 网站名称及网站的类型 2） 简述网站的建设方案（叙述网站的建设意义所在） 3） 网站的风格及配色方案 4） 网站的架构设计（画出网站结构图） 5） 首页的设计简述及内容页的设计构思 6） 网站完成后的自查：网站在本地和上传到服务器中有无图片和动画无法显示或链接失效 等情况 7） 网站完成后，你打算如何做进一步的推广，请写出网站推广的方案