02 Dreamweaver站点

1、第2章 Dreamweaver站点,2.1 设计Web站点的基本流程 2.2 站点文件管理 2.3 站点资源管理 2.4 管理模板和库 实例1 网站同步更新 实例2 设置页面属性,2.1 设计Web站点的基本流程,站点设计的一般基本流程如下图所示。,2.1.1 构想站点主题 2.1.2 设计站点风格 2.1.3 收集建站素材 2.1.4 站点规划 1. 站点结构 好的站点结构有助于加快站点的设计，提高工作效率。在规划站点的结构前一般要先描绘出其结构图，如下图所示。,2. 站点导航 许多站点都会包含多个页面，如何让用户知道存在的网页并且访问它们，是网站创建者必须考虑的问题。一般地，在网站创建时应

2、该规划站点的浏览机制，给用户提供清晰的浏览方法，采用标准统一的页面组织方式，这样才可以使用户轻松自如地访问到每一个想要访问的网页。 可以采用以下方法来规划站点的浏览机制： （1）创建返回主页的链接。 （2）使用搜索和索引。 （3）显示网站专题目录。 （4）显示用户访问的当前位置。 （5）反馈。,2.1.5 定义站点 有两种设计Dreamweaver站点的方法：使用“站点定义向导”，可以逐步完成设计过程；使用“站点定义”对话框的“高级”选项卡，它可以根据需要分别设置本地、远程和测试文件夹。 1. 向导定义站点 2. 高级定义站点 “本地信息”分类可用于设置站点名称、本地存放网站文件的文件夹、存放

3、站点图像的文件夹等。 “远程信息”用于设置站点访问方式及其与访问方式相关的信息。 “测试服务器”用于在设置好“远程信息”之后来测试远程服务器。,2.1.6 设计网页 2.1.7 检查链接 2.1.8 上传网页 完成站点的设计之后，可以通过Dreamweaver CS3或者CuteFTP等工具上传到远程服务器上。要使其他人可以访问该网页，必须将它们上传到 Web 服务器，即使 Web 服务器运行在本地计算机上也必须进行上传。 2.1.9 后期更新维护 上传网站之后，通过浏览器浏览网页，检查其效果，进行进一步的调整，包括对不满意的地方的更改，错误的更正等。一个站点需要经常更新，以保证其内容新颖，从

4、而留住用户和吸引更多的用户。,2.2 站点文件管理,2.2.1 查看文件和文件夹 可以在“文件”面板中查看文件和文件夹，单击“”命令，打开“文件”面板，如下图所示。 文件列表显示了站点目录下所有的文件夹及文件。用户可以在文件面板上进行文件和文件夹的操作，如文件的新建、删除和重命名等。,2.2.2 比较文件 Dreamweaver可以使用文件比较工具，比较“两个本地文件单字加两个标点”、“两个远端文件”、“本地文件与远端文件”、“远端文件与本地文件”、“将打开的文件与远端文件进行比较”。在本地处理某个文件并怀疑该文件在服务器上的副本已由他人进行了修改时，比较本地和远程文件十分有用。完成该任务前，

5、必须用远程设置定义一个Dreamweaver 站点。 2.2.3 存回和取出文件 1. 使用“文件”面板取出文件 2. 使用WebDAV存回和取出文件 Dreamweaver 可以连接到使用WebDAV（基于Web的分布式创作和版本控制）的服务器，WebDAV是一组对HTTP协议的扩展，允许用户以协作方式编辑和管理远程Web服务器上的文件。,2.2.2 比较文件 Dreamweaver可以使用文件比较工具，比较“两个本地文件单字加两个标点”、“两个远端文件”、“本地文件与远端文件”、“远端文件与本地文件”、“将打开的文件与远端文件进行比较”。在本地处理某个文件并怀疑该文件在服务器上的副本已由他

6、人进行了修改时，比较本地和远程文件十分有用。完成该任务前，必须用远程设置定义一个Dreamweaver 站点。 2.2.3 存回和取出文件 1. 使用“文件”面板取出文件 2. 使用WebDAV存回和取出文件 Dreamweaver 可以连接到使用WebDAV（基于Web的分布式创作和版本控制）的服务器，WebDAV是一组对HTTP协议的扩展，允许用户以协作方式编辑和管理远程Web服务器上的文件。 2.2.4 站点地图 站点地图是站点结构布局工具。可以快速地设置整个站点结构，然后创建站点地图。 1. 定义主页 在显示站点地图之前，必须先定义站点的主页，主页只是地图的起点，主页可以是站点中的任意

7、页面。 2. 查看站点地图 3. 修改站点地图,2.3 站点资源管理,2.3.1 资源管理面板 资源就是用来制作网页和设计站点的元素，例如图像和电影文件。 资源管理器面板如下图所示。,各按钮的功能如下： （1） ：图像文件，可以是GIF、JPEG或PNG格式的图像。 （2） ：HTML文档和CSS样式表中使用的颜色，包括文本颜色、背景颜色和链接颜色等。 （3） ：站点文档中包括的外部链接，可以有FTP、HTTP、HTTPS、JavaScript、E-mail（mailto）和本地文件协议（file:/）。 （4） ：Macromedia Flash格式的电影。资源管理器只显示SWF文件（压缩格

8、式），不能显示FLA文件（Flash源文件格式）。 （5） ：Macromedia Shockwave格式的电影文件。,（6） ：QuickTime或MPEG格式的电影（Movies）。 （7） ：Javascript或VBScript脚本文件。注意，直接嵌入HTML文件的脚本不在资源管理器中显示，只有独立的Javascript或VBScript脚本文件才能显示。 （8） ：模板提供一种在多个页面使用同一页面布局的方法。 （9） ：库条目是可在多个页面中使用的元素，库条目修改时，相应页面的元素也随之修改。,2.3.2 在页面中添加资源 在资源面板中可以通过拖动或使用“插入”按钮将多种资源添加到

9、文档中。颜色和URL还可应用于所选文本或其他元素，模板只能应用于整个文档。 1. 向页面添加图片 2. 改变文本的颜色 3. 添加链接 4. 将模板应用到当前文档,2.3.3 使用收藏夹资源 收藏夹资源站点列表中资源的引用，Dreamweaver CS3会跟踪站点列表并在收藏夹中显示站点资源。 1. 添加和删除资源 2. 资源重命名 3. 为资源分组,2.4 管理模板和库,为了保证站点的风格统一，经常会在所有的页面中使用相同的布局。在Dreamweaver中，有创建模板功能，设计一个模板，再基于模板来创建新的网页，以保证整站风格一致。当需要更改整个网站布局时，无需一一更改每个页面，只需要更改模板页，就完成了对整个站点的更改，这给网站更新带来了极大的方便。 有时在设计网页时，同一个站点里可能会多次使用到某一个元素（如图片），而且又需要保证它在每个页面都一致。这时就需要把它存入库中，然后再在网页中调用它。当需要对它进行更改时，无需逐页更改，只更改库中的该元素就可以了。,实例1 网站同步更新 可以借助文件同步化功能来同步