《单元11整合与发布网站》由会员分享，可在线阅读，更多相关《单元11整合与发布网站（34页珍藏版）》请在金锄头文库上搜索。
1、网页设计与制作 任务驱动式教程,单元11 整合与发布网站,教学环节,【教学导航】,【操作准备】,（1）创建所需的文件夹，拷贝所需的资源 （2）启动Dreamweaver CS6 （3）创建本地站点,【引导训练】,【任务10-1】整合与发布“E游天下”网站,本单元“引导训练”的任务卡如表11-1所示。,【引导训练】,（1）创建一个网页文档index.html。 （2）设置网页的标题、Meta属性、关键字、说明和刷新属性。,【任务描述】,【任务10-1-1】新建网页文档index.html,【任务实施】,（1）新建一个网页文档 在站点文件夹“单元11”中创建一个名称为“index.html”或“d
2、efault.html”的网页文档。 （2）设置网页标题 在【文档】工具栏的“标题”文本框输入网页标题“E游天下”。 （3）设置网页的Meta属性、关键字、说明和刷新属性 分别设置网页所使用的编码语言等Meta属性、站点关键字、站点说明和站点刷新属性，网页index.html的HTML代码如表11-3所示。 （4）保存该网页，预览其效果。,【引导训练】,（1）设置网页index1101.html的图像热点超链接。 （2）设置网页index1101.html导航栏的超链接。,【任务描述】,【任务10-1-2】设置网站主页的超级链接,【任务实施】,1设置图像热点超链接 在网页index1101.h
3、tml的地图中分别绘制矩形热点区域，然后设置热点超链接。网页index1101.html中插入的地图以及热点超链接的HTML代码如表11-4所示。 2设置导航栏的超链接 打开子文件夹“webPage”中的网页top_nav.html，切换到【代码视图】窗口，添加必要的HTML代码，为相应的文字设置超级链接。 设置网页top_nav.html一级导航条中文字“E游调查”链接的网页地址为“/Unit07/task07-1/0701.html”，目标为“_parent”，一级导航条中文字及超链接设置对应的代码如表11-5所示。 为网页top_nav.html二级导航条中的菜单文字“张家界”、“黄山”
4、、“千岛湖”、“上海”和“九寨沟”设置链接，其中菜单文字“上海”链接的地址为“/Unit06/task06-1/0602.html”，目标为“_blank”，二级导航条中的菜单文字及超链接设置对应的代码如表11-6所示。,【引导训练】,对“E游天下”网站进行测试。,【任务描述】,【任务10-1-3】测试“E游天下”网站,【任务实施】,1测试网页 （1）检查链接 利用Dreamweaver CS6提供的【链接检查器】选项卡可以方便地检查错误链接，检查方法如下： 切换到已建立的站点“单元11”，在Dreamweaver CS6主界面中，选择命令【站点】【检查站点范围的链接】，将显示如图11-2所示
5、的检查结果。,图11-2 【链接检查器】选项卡中显示“断掉的链接”,【任务实施】,在“显示”下拉列表框中选择“外部链接”选项，则可以显示本网站中所有的外部链接，以便对外部分链接进行管理，如图11-3所示。,图11-3 【链接检查器】选项卡中显示“外部链接”,【任务实施】,在“显示”下拉列表框中选择“孤立文件”选项，则可以显示本网站中所有的孤立文件，以便对孤立文件进行管理，如图11-4所示。,图11-4 【链接检查器】选项卡中显示“孤立文件”,【任务实施】,（2）检查浏览器的兼容性 在Dreamweaver CS6主界面中，选择命令【文件】【检查页】【浏览器兼容性】，验证结果如图11-7所示。,
6、图11-7 “浏览器兼容性”的检查结果,【任务实施】,2测试本地站点 （1）检查链接 这一次检查链接不再利用“链接检查器”来检查错误链接，而是通过浏览网页逐个检查链接，主要检查是否有空链、断链和链接错误；页面之间是否能顺利切换；是否有回到上层页面或主页的渠道等。 （2）检查页面效果 检查网页中的脚本是否正确，是否会出现非法字符或乱码；文字显示是否正常；是否有显示不出来的图片；SWF动画画面出现时间是否过长；网页特效是否能正常起作用等。,【任务实施】,2测试本地站点 （3）检查网页的容错性 检查网页的表单区域的文本框中输入字符时是否有长度的限制；表单中填写信息出错时，是否有提示信息，并允许重新填
7、写；对于邮政编码、身份证号码之类的数据是否限制其长度等。 （4）检查兼容性 在Dreamweaver CS6中制作的网页在其他浏览器（例如Firefox、Opera、Netscape）中显示是否正常；在纯文本模式下检查整个网站的信息表现力。,【任务实施】,3用户测试 以用户身份测试网站的功能。主要测试内容有：评价每个页面的风格、页面布局、颜色搭配、文字的字体、大小等方面与网站的整体风格是否统一、协调；页面布局是否合理；各种链接所放的位置是否合适；页面切换是否简便；对于当前访问位置是否明确等。 4负载测试 安排多个用户访问网站，让网站在高强度、长时间的环境中进行测试。主要测试内容有：网站在多个用
8、户访问时访问速度是否正常；网站所在服务器是否会出现内存溢出、CPU资源占用是否不正常等。,【任务实施】,5创建网站报告 在Dreamweaver CS6主界面中，选择命令【站点】【报告】，弹出【报告】对话框。在“报告在”下拉列表框中选择生成站点报告的范围，如图11-11所示，可以是当前文档，整个当前本地站点、站点中的已选文件或文件夹。 在“报告在”下拉列表框中选择“整个当前本地站点”选项， 然后在“选择报告”框中单击选择所需要的报告选项。然后单击【运行】按钮，生成站点报告。,【引导训练】,清理文档是将制作完成的网站上传到服务器之前，需要做的一项重要工作。清理文档也就是清理一些空标签或者Word
9、中编辑HTML文档所产生的一些多余的标签，最大限度地减少错误的发生，以便更好地被浏览者访问。,【任务描述】,【任务10-1-4】清理网页文档,【任务实施】,（1）打开需要清理的文档。 （2）在Dreamweaver CS6主界面中，选择命令【命令】【清理XHTML】，打开【清理HTML/XHTML】对话框，在“移除”选项组中选择“空标签区块”、“多余的嵌套标签”等复选框，也可以在“指定的标签”文本框中输入所要删除的标签。在“选项”选项组中选中“尽可能合并嵌套的标签”和“完成时显示动作记录”复选框。然后单击【确定】按钮，Dreamweaver CS6自动开始清理工作。清理完毕会弹出一个【Drea
10、mweaver】的“清理总结”对话框，报告清理工作的结果，在该对话框中单击【确定】按钮即可。 （3）选择命令【命令】【清理Word生成的HTML】，打开【清理Word生成的HTML】对话框，在该对话框中进行相应的设置之后，然后单击该对话框的【确定】按钮即可。 清理完毕弹出如图11-18所示的“清理Word HTML结果”对话框，然后单击该对话框的【确定】按钮即可。,【引导训练】,尝试申请一个域名或申请主页空间。,【任务描述】,【任务10-1-5】申请域名与申请空间,【任务实施】,1申请域名 域名分国内域名和国际域名两种。国内域名由中国互联网中心管理和注册的，中国互联网中心的网址是：http:/
11、，注册申请域名首先在线填写申请表，收到确认信后，提交申请表，加盖公章、交费就完成了。 2申请空间 可以通过“百度”网站搜索提供免费主页空间的网站，在“百度”网站“百度搜索”文本框中输入“申请免费的主页空间”，然后单击【百度搜索】按钮，将会搜索出所有包含“申请免费主页空间”字样的信息。然后完成申请空间的操作即可。,【引导训练】,把网页文件上传到Web服务器，即发布网站。,【任务描述】,【任务10-1-6】发布网站,【任务实施】,1上传文件 （1）使用Dreamweaver CS6上传文件 启动Dreamweaver CS6，打开【文件】面板，选择上传的文件或文件夹，然后单击【上传文件】按钮上传文
12、件。 如果在上传文件之前如果没有设置过远程服务器，会弹出提示定义远程服务器的对话框。 单击【是】按钮，打开【站点设置对象】对话框，并自动切换到【服务器】选项卡。 在【站点设置对象】对话框的【服务器】选项卡中，单击【添加新服务器】按钮，弹出一个对话框，在该对话框的“基本”选项卡中分别输入“服务器名称”、“FTP地址”、“用户名”和“密码”等信息。,【任务实施】,单击【高级】按钮切换到“高级”选项卡，根据需要进行必要的设置即可。 服务器的信息设置完成后，单击【保存】按钮，接下来就可向服务器上传网站文件了。 网站上传完毕，单击站点管理器上方的【展开以显示本地和远端站点】按钮，就可以看到站点文件已被上
13、传到主机目录中了。 也可以在上传文件之前，单击【连接到远端服务器】按钮，先与远端主机连接，然后再上传文件。 （2）使用CuteFTP上传文件 2获取文件 获取文件之前同样要连接远端服务器，获取文件的操作如下： （1）在远端服务器浏览窗口中选择需要获取的文件或者文件夹。 （2）单击【获取文件】按钮，文件即会被下载到本地站点中。,【引导训练】,分析宣传与推广网站的方法和途径。,【任务描述】,【任务10-1-7】宣传与推广网站,【任务实施】,1注册到搜索引擎 2参加广告交换组织 3借助网络广告 4添加到网址导航网站 5通过邮件推广 6利用友情链接 7BBS宣传 8传统宣传方式,【引导训练考核实战】,
14、本单元的“引导训练”考核评价内容如表11-7所示。,表11-7 单元11“引导训练”考核评价表,【同步训练】,【任务描述】,【任务10-2】整合与发布“快乐旅游”网站,表11-8 单元1“同步训练”任务卡,本单元“同步训练”的任务卡如表11-8所示。,【同步训练考核实战】,本单元的“同步训练 ”考核评价内容如表11-10所示。,表11-10 单元11“同步训练 ”考核评价表,【拓展训练】,【任务描述】,【任务10-3】整合与发布“爱旅游”网站,表11-11 单元11“拓展训练”任务卡,本单元“拓展训练”的任务卡如表11-11所示。,【拓展训练考核实战】,本单元的“拓展训练 ”考核评价内容如表11-13所示。,表11-13 单元11“拓展训练 ”考核评价表,【单元小结】,一个网站开发完成后必须经过认真的测试才能发布，以免浏览网站时出现一些错误。一个网站要发布在服务器上去，才能被他人浏览。本单元主要介绍了整合网站、测试网站、申请网站域名和网页空间、发布网站、宣传与推广网站等。,快乐学习、高效学习,
