《Dreamweaver 网页设计 教学课件 ppt 作者 吴权威 王绪溢 第七章》由会员分享，可在线阅读，更多相关《Dreamweaver 网页设计 教学课件 ppt 作者 吴权威 王绪溢 第七章（61页珍藏版）》请在金锄头文库上搜索。
1、1,第7章 网站的发布与管理,7-1 发布网站前的准备工作 7-2 发布网站文件 7-3 管理网站,返回,2,7-1 发布网站前的准备工作,7-1-1 网站管理窗口 7-1-2 更改文件夹名称 7-1-3 设置首页文件 7-1-4 利用网站地图查看文件的链接状况 7-1-5 查看网站链接状况 7-1-6 修改错误的链接,返回,3,7-1-1 网站管理窗口,Dreamweaver内建FTP功能，方便把网站送出去，并且提供了一些好用的网站内部管理功能。 网站管理窗口包含了网站文件、测试服务器、网站地图与网站地图和文件等4种视图模式，在网站文件模式下可以看到远程和本地端的文件，以方便进行两端的管理；
2、而在网站地图模式下则可以很清楚地看到所有网页的链接关系。,4,网 站 文 件,5,测试服务器,6,网 站 地 图,7,网站地图和文件,8,7-1-1 网站管理窗口,文件管理面板的方法：打开文件面板后，接着选择扩展/收合按钮。,选择 按钮,9,7-1-1 网站管理窗口,展开网站管理窗口后，在“显示”栏中选择要打开的网站名称，则本地端就会像资源管理器一样，将网站中的文件以层级列出来，而左边则会显示远端站点内容。,10,7-1-1 网站管理窗口,远程网站,选择要开 启的网站,本地端网站,11,7-1-1 网站管理窗口,以下就是网站管理窗口的工具按钮名称说明：,返回,12,7-1-2 更改文件夹名称,
3、（1）选择要更改的文件夹后，接着单击鼠标左键。,13,7-1-2 更改文件夹名称,（2）原先的文件夹名会出现可输入的状态，输入新名称后，按下回车键。,14,7-1-2 更改文件夹名称,（3）出现“更新文件”对话框后，列表中会列出所有要修改的网页，移动鼠标单击“更新”按钮。,返回,15,7-1-3 设置首页文件,第一次打开网站结构图要先设置首页文件，完成设置后，就可以看到网站结构图了。 （1）选择要设置首页的文件后，单击鼠标右键，再从弹出的快捷菜单中选择“设成首页”。 （2）单击 网站地图按钮，再从弹出的菜单中选择“仅地图”。,16,7-1-3 设置首页文件,选择“仅地图”,17,7-1-3 设
4、置首页文件,出现网站地图后，会显示所有文件之间的链接关系，呈现网站的整体结构。,显示网站地图,返回,18,7-1-4 利用网站地图查看文件的链接状况,网站地图的根目录为首页文件，也可以指定任何一个文件，作为根目录来查看链接状态。 方法：选择要查看链接的网页，单击鼠标右键后，再从弹出的快捷菜单中选择“作为根查看”。,19,7-1-4 利用网站地图查看文件的链接状况,指定的网页文件就会变成暂时的根目录 。 优点：不用变更首页的设置，就能查看网站内各文件的链接状况。,Appliance.htm 文件为根目录,显示根目录下 的链接文件,20,7-1-4 利用网站地图查看文件的链接状况,在网站结构图上方
5、的网站导航会显示首页文件到该网页的链接，只要选择首页文件的index.htm即可回到以首页为树根的网站结构图。,选择index.htm即可回到以首页为树根的网站地图,单击按钮也可以展开链接的关系,返回,21,7-1-5 查看网站链接状况,移动鼠标到菜单栏执行“站点”“检查站点范围的链接”命令。 出现链接检查程序面板后，在“显示”下拉列表中可以选择断掉的链接、外部链接和孤立文件3种链接状态的结果。,有问题的 链接文件,22,7-1-5 查看网站链接状况,断掉的链接：显示错误的超链接，可能指定的链接文件已不在或文件名改变了。 外部链接：Dreamweaver会列出网站中所有外部的链接，但是必须自己
6、动手连到指定的网站去检查。 孤立文件：网站经过多次的更新，难免会留下一些用不到的文件，这时就可以将这些孤立的文件删除，以免占用网页空间，因为这些文件在发布时都会被送到服务器上。,返回,23,7-1-6 修改错误的链接,（1）打开链接检查程序面板后，双击链接错误的文件。,双击鼠 标左键,24,7-1-6 修改错误的链接,（2）打开文件后，Dreamweaver会自动选取错误的地方，接着移动鼠标单击 浏览文件按钮。,显示链接错 误的图片,选择 按钮,25,7-1-6 修改错误的链接,（3）出现“选择图像源文件”对话框后，从列表中选择正确的链接文件，接着单击“确定”按钮。 （4）回到编辑画面后，移动
7、鼠标到菜单栏执行“文件”“保存”命令。 将文件修改并保存后，Dreamweaver会自动将链接检查程序面板中的错误文件删除。 超链接检查不仅能找出网页链接的错误，图文件内嵌媒体等各种文件的链接有错时，也都可以检查出来。,返回,26,7-2 发布网站文件,7-2-1 连接服务器 7-2-2 上传文件 7-2-3 上传更新后的文件 7-2-4 让计算机与网站同步更新,返回,27,7-2-1 连接服务器,在发布网站前，首先要申请一个网页空间，申请完空间后，接下来就要联机到指定的服务器，才能将网站的文件上传。 （1）切换到网站管理窗口画面后，接着移动鼠标选择“定义测试服务器”。,选择“定义测 试服务器
8、”,28,7-2-1 连接服务器,（2）出现站点定义窗口后，在“分类”列表中选择“远程信息”，接着从“访问”列表中选择“FTP”。,选择“远程信息”,选择“FTP”,29,7-2-1 连接服务器,（3）在“FTP主机”栏输入FTP主机地址，接着在“登录”栏输 入登录名称，然 后在“密码”栏输 入登录密码并勾 选“保存”，表示 自动保存密码， 最后单击“确定” 按钮。,输入相关设置,30,7-2-1 连接服务器,（4）设置好要上传的服务器地址后，移动鼠标单击 联机至远程主机按钮，连接远程服务器。,选择此按钮,31,7-2-1 连接服务器,当 联机至远程主机按钮变成绿灯后，表示已连接成功，单击 与
9、远程主机离线按钮则会中断联机。,联机成功,远程网 站内容,返回,32,7-2-2 上传文件,（1）移动鼠标选择要上传的文件或文件夹，再单击 上传文件按钮。,33,7-2-2 上传文件,（2）出现“相关文件”对话框，询问是否要上传包含的相关文件，接着移动鼠标单击“是”按钮，则此网页内所有相关的文件都会一起上传到远程服务器上。,34,7-2-2 上传文件,上传成功后，在远程网站这边就会看见被上传的数据及其相关文件。,上传相 关文件,返回,35,7-2-3 上传更新后的文件,（1）移动鼠标到菜单栏执行“编辑”“选择较新的本地文件”命令。 （2）Dreamweaver会自动对照远程服务器的文件日期或是
10、远程没有的文件，若是不相同，则在本地端网站会将这些文件反白选择起来，接着再选择上传文件按钮，就可以上传更新后的文件了。,36,7-2-3 上传更新后的文件,自动选取文件,37,7-2-3 上传更新后的文件,在上传文件时，若出现下面的窗口，建议将文件夹名称改成英文，以免造成错误。,返回,38,7-2-4 让计算机与网站同步更新,Dreamweaver使用文件同步化功能，会自动和远程服务器比较，找出新的数据后，自行选择要上传或删除哪些文件，轻轻松松完成同步更新的动作。 （1）移动鼠标到菜单栏执行“站点”“同步”命令。 （2）出现“同步文件”后，从“同步”栏中选择“整个飘香咖啡馆站点”，接着在“方向
11、”栏中选择“放置较新的文件到远程”，然后勾选“删除本地驱动器上没有的远端文件”，最后单击“预览”按钮。,39,7-2-4 让计算机与网站同步更新,（3）出现显示所有要上传文件的窗口后，若是取消勾选“上传”，则不会将此文件上传更新，完成设置后单击“确定”按钮。,40,7-2-4 让计算机与网站同步更新,（4）上传完成后，状态区会显示已经更新信息，接着单击“关闭”按钮结束同步。,取消勾选不上传的文件,显示更 新信息,选择此按钮,41,7-2-4 让计算机与网站同步更新,在同步文件窗口的方向栏中，若选择从远程下载较新文件，则会将远程较新的数据下载；选择上传与下载较新文件，Dreamweaver会自动
12、对比两端文件的新旧，决定上传或下载；若是勾选删除本地驱动器上没有的远端文件，则会将远程多余的文件删除。,返回,42,7-3 管理网站,7-3-1 清查网站 7-3-2 检查网站与浏览器的兼容性 7-3-3 替网页加上备注,返回,43,7-3-1 清查网站,将网站上传到远程服务器前，可以利用报表（Report）功能，将网站从头到尾检查一遍。 （1）移动鼠标到功能栏执行“站点”“报告”命令。 （2）出现“报告”对话框后，在“报告在”栏中选择“整个当前本地站点”，接着在“选择报告”列表中勾选要检查的项目，然后单击“运行”按钮。,44,7-3-1 清查网站,选择“整个当前本地站点”,勾选要列出 报告的
13、项目,45,7-3-1 清查网站,出现网站报告面板后，会列出检查后的报告，在列表中显示有问题的文件，双击文件，可以打开文件修正，选择存储报告按钮，则可以将检查的结果存成.xml格式文件。,46,7-3-1 清查网站,列出错误文 件的报告,47,7-3-1 清查网站,在报告窗口中，“报告”栏内的4个选项说明如下： 目前文件：只检查目前正在编辑的网页文件。 整个当前本地站点：检查整个站点的内容。 站点中选择的文件：只检查目前在站点管理窗口中被选择的文件。 文件夹：检查站点中指定文件夹里的文件。,返回,48,7-3-2 检查网站与浏览器的兼容性,（1）打开“目标浏览器检查”面板后，移动鼠标单击 检查
14、目标浏览器按钮，接着从弹出的菜单中选择“为整个站点检查目标浏览器”。,选择“为整个站点检查目标浏览器”,49,7-3-2 检查网站与浏览器的兼容性,（2）列出有问题的文件后，接着移动鼠标单击 浏览报表按钮。,选择 按钮,50,7-3-2 检查网站与浏览器的兼容性,选择浏览报表按钮后，会自动打开浏览器，并显示检查结果报告，列出IE和Netscape浏览器的错误总数和错误的内容 。,列出IE和Netscape浏览器的错误总数,51,7-3-2 检查网站与浏览器的兼容性,报告中会显示错误的文件位置，并且说明错误的HTML指令位置。,显示错误的文件和说明错误的地方,返回,52,7-3-3 替网页加上备
15、注,（1）选择要备注的文件后，移动鼠标到菜单栏执行“文件”“设计备注”命令。 （2）出现“设计备注”对话框后，在“状态”栏中选择网页目前的开发进度等级，接着移动鼠标单击 按钮新增日期，并在“备注”栏输入备注的内容，然后勾选“文件打开时显示”，最后单击“确定”按钮。,53,7-3-3 替网页加上备注,选择状态等级,输入备注内容,勾选此项,选择此按钮 新增日期,54,7-3-3 替网页加上备注,也可切换到“完整”选项卡将不需要的备注删除。 回到网站管理窗口后，刚才所选择文件的备注栏就会出现 图标，表示此文件有设置备注的内容。,55,7-3-3 替网页加上备注,有备注内 容的文件,56,7-3-3
16、替网页加上备注,若是备注功能被关闭了，可以到站点定义窗口的“分类”列表中选择“设计备注”，然后再勾选“维护设计备注”。,57,7-3-3 替网页加上备注,若是站点管理窗口中文件的备注栏没有出现图标，可以到站点定义窗口的“分类”列表中选择“文件视图列”设置，接着在字段设置列表中选择“备注”，然后在“选项”栏勾选“显示”。,58,7-3-3 替网页加上备注,选择“文件 视图列”,选择“备注”,勾选“显示”,在网页上设计的备注内容并不会内嵌在文件里，Dreamweaver会自动在网站文件夹中建立一个_notes文件夹，并将相关备注内容存储在里面。,返回,59,小 结,1.站点管理窗口包含了网站文件、测试服务器、网站地图和网站地图与文件等4种查看模式，在网站文件模式可以看到远程和本地端的文件，以方便进行两端的管理；而在网站地图模式则可以很清楚的看到所有网页的链接关系。 2.在链接检查程序
