信息发布与网页设计-dreamweaver1-3

2019/2/5,1,信息发布与网页设计,DREAMWEAVER 1-3 信息学院 信息发布与网页设计课题组 2019年2月5日星期二,返回,2019/2/5,2,3.1 概述,Macromedia 公司总部在美国加州，行业占有约85%的市场份额，全球知名软件公司，现被Adobe（阿道贝）以 34亿美元收购。 网页制作三剑客： Dreamweaver Flash Fireworks,2019/2/5,3,3.1 概述,Adobe的其它著名软件有 Acrobat PDF阅读、打印 Photoshop 平面设计 Illustrator等 矢量图形软件 PageMaker 排版软件 Framemaker 大型排版软件,2019/2/5,4,3.1.1 DW主要功能,DW 是快捷高效的网页编辑工具； DW 提供了完善的站点管理机制； 使网页和数据库相关联，支持DHTML和CSS标准，创造极具表现力和动感效果的网页。 可同该公司的其它软件无缝结合协同工作， （如Flash、Friework等） 。,2019/2/5,5,3.1.2 DW 新增功能,规范化 站点管理 设置本地及远程站点信息、设置站点地图布局 文件的上传和下载 在站点地图中操作站点文件 显示或隐藏站点地图中的文件 查看站点地图中的一个分支,2019/2/5,6,3.1.2 DW 新增功能,对XML、DHTML的支持 支持XML结构化数据，用于电子商务目的。 支持主要的DHTML文本标记，DHTML格式的文件可以动态装载，以便及时更新。,2019/2/5,7,3.2 DREAMWEAVER MX工作环境,首次启动Dreamweaver，的起始页面。,2019/2/5,8,3.2.1 DW 界面说明,2019/2/5,9,3.2.1.1 标题栏,标题栏 DW 标记 应用程序名称 文档的标题和名称 标题为网页的标题 名称是文档保存在磁盘上的名称 窗口按钮,2019/2/5,10,3.2.1.2 菜单栏,菜单栏 包括【文件】、【编辑】、【查看】、【插入】、【修改】、【文本】、【命令】、【站点】、【窗口】、【帮助】 等10个菜单项，如图：,2019/2/5,11,3.2.1.3 工具栏,菜单中经常使用的功能的快捷操作按钮。 在网页编辑状态，可以通过菜单【查看】、【工具栏】、【文档】|【标准】，来设置是否显示工具栏。如图：,2019/2/5,12,3.2.1.4 视图选择、状态栏,三种视图供选择: 设计视图 代码视图 代码和设计视图 状态栏 标记选择器 点击左边的【标记选择器】，如，可进行代码选择。右击【标记选择器】，可对标记进行进一步处理。,2019/2/5,13,3.2.1.6 插入面板,选择菜单【窗口】中的【插入】命令，可以设置是否显示“插入面板”，其中包含了多种不同类型的按钮，默认的是【常用】类型。,2019/2/5,14,3.2.1.6 插入面板续,单击“类型选择”下拉菜单，选择“显示为制表符”，则出现如下样式： 点击该面板右上角的图标，从中选择“显示为菜单”，则还原为原来样式。,2019/2/5,15,3.2.1.7 属性面板,点击菜单【窗口】中的【属性】，设置是否使用属性面板； 属性面板用于设置文档窗口中所选元素的属性，选择的元素不同，属性设置面板上的内容也不同。 注意使用属性设置面板的左上、右上、右下按钮。,2019/2/5,16,3.2.1.8 浮动面板,浮动面板是一个工具集合控制框架，可以将各种浮动窗口、面板放置其中，组合成选项卡的形式。 通过浮动面板进行设置，方便、直观。 浮动面板可以任意拖放、停靠，管理方便。 通过【窗口】菜单，可以选择不同面板。,2019/2/5,17,3.2.1.6 联机帮助,菜单【帮助】或按F1键，即可启动。 直接启动帮助 在浏览器中，可以从目录中直接选择感兴趣主题，查看相应的帮助信息。,2019/2/5,18,3.3 DW基本操作,DW文件操作： 网页编辑 创建站点 编辑站点 设置首页 使用站点地图,2019/2/5,19,3.3.1 文件操作,打开文件 可打开多种格式的文件，如：html、shtml、asp、js、xml、css等等。 直接打开网页文件 【文件】、【打开】，选择文件。 在框架中打开网页文件 当前文件为框架文件时，可用该方式，【文件】、【在框架中打开】，该方式只能打开html文件。,2019/2/5,20,3.3.1 文件操作,新建文件 创建常规网页文件 【文件】、【新建】、【常规】，选择“类别”及“基本页”； 通过模板创建 【文件】、【新建】、【模板】，选择已有模板创建网页。,2019/2/5,21,3.3.1 文件操作续,存储文档 保存 另存为 可改变名称或类型 保存全部 框架中的全部网页 另存为模板,2019/2/5,22,3.3.2 创建站点,站点由多个网页组成，每个网页包括文字、图形、表格、声音、视频、动画等。 设计一个网站，就是组织好这些内容，优化和装饰。 做好网站三要素：创意、美工、技术 基本要求：简洁、条理清楚、实用和美观。 开发之前，应先建立一个本地站点，用来分类保存、管理创建网页的素材、图像等。,2019/2/5,23,3.3.2.1 创建站点步骤,设计站点 定义本地站点 设置站点远程服务器 文件的上传和下载 设置设计提示 设置站点地图布局,2019/2/5,24,3.3.2.1 设计站点,合理的结构可加快站点的设计，提高效率。首先建立一个根文件夹（根目录），在其中创建多个子文件夹。分门别类地存储不同类别的文件，如图像、声音、动画等。 使用合理的文件名。文件名应该便于理解；最好使用英文文件名，以避免不必要的错误。,2019/2/5,25,3.3.2.1 设计站点续1,建立本地站点的基本思路如下： 对站点进行规划 了解站点目的 确定它要提供什么服务 网页中包含什么内容 创建站点的基本结构 建立合理的文件夹结构 开始制作具体的网页 定义本地站点 通过定义站点向导定义站点 直接定义站点,2019/2/5,26,3.3.2.1 通过向导定义站点,建立站点目录 在操作系统下建立站点根目录，并在其中建立相应的子目录，以便存放不同类型的文件。 启动DW，选择菜单【站点】、【管理站点】、【新建】、【站点】。 选择【基本】选项卡，输入一个站点的名称，如“风景”，单击【下一步】。,2019/2/5,27,3.3.2.1 通过站点向导定义站点,选择“否，不使用服务器技术”； 选择“编辑我的计算机上的本地复本”，选择已建立的本地根目录地址； 在“如何连接到远程服务器”中选择“无”； 【完成】。 关闭“管理站点”对话框。,2019/2/5,28,3.3.2.2 直接定义站点,建立站点根目录及相应子文件夹。 打开“管理站点”对话框，【新建】、【站点】。 选择【新建】选项卡。 选择“分类”中的“本地信息”，输入站点名称，选择“本地跟文件夹”。 自动刷新本地文件列表，启用缓存。 确定、完成,2019/2/5,29,3.2.2.3 设置站点远程服务器,对站点远程服务器的设置同样可以通过定义站点向导来设置和直接设置两种方法实现。 直接定义站点远程服务器 启动DW，选择菜单【站点】、【管理站点】，选择站点，单击【编辑】。 在“高级”选项卡中，选择左边“分类”中的“远程信息”。,2019/2/5,30,3.2.2.3 设置站点远程服务器2,在“访问”下拉菜单中选择一种服务器访问方式，这里选择“本地/网络”。 在“远端文件夹”中，选择地址。 确定，并关闭“管理站点”对话框。 点击“文件浮动面板”中的“扩展/折叠”按钮，显示站点管理窗口。 简介“站点管理窗口”。,2019/2/5,31,3.2.2.4 文件的上传和下载,在设置了本地站点信息和远程信息后，就可以进行本地站点与远程站点间文件的上传于下载了。操作在“站点管理窗口”中实现。 上传 从“本地文件”中选择文件或文件夹，单击“上传文件”按钮。 下载 从“远端站点”中选择文件或文件夹，单击“获取文件”按钮。,2019/2/5,32,3.2.2.5 添加设计说明,“设计提示”指在设计一个文档过程中，输入的提示信息，这些提示将随文件一起保存。以后打开文档时可以先显示提示信息，以了解设计思路。 在网站中打开一个具体的网页，执行菜单【文件】、【设计备注】，在对话框中进行具体的设置。,2019/2/5,33,3.2.2.6 设置站点地图布局,选择【站点】、【管理站点】，编辑具体的站点。 在“高级”中选择“站点地图布局”进行设置。 主页：选择主页文件 列数、列宽：默认 图标标签：设置显示方式 选项：显示隐藏文件及相关文件,2019/2/5,34,3.3.3 编辑站点,打开本地站点 选择菜单【站点】、【管理站点】，使用“直接定义站点”的方法，即可打开本地站点。 在“文件浮动面板”中，通过“站点”下拉菜单选择站点。 修改站点 通过菜单【站点】、【管理站点】，对具体的站点进行属性的设置。 删除站点 方法同上。删除站点并不删除站点中的内容，只删除DW与本地站点之间的关系。这表明站点只是文件的组织形式。,2019/2/5,35,3.3.3.1 编辑站点,复制站点 创建多个结构相同或相似的站点时，可以先复制，然后再进行进一步的修改。 设置服务器访问类型 先定义一个本地站点 选择菜单【编辑】、【首选参数】 在左侧选择“站点”，进行具体的设置。,2019/2/5,36,3.3.3.2 使用站点地图,站点地图用树形结构图显示站点中文件的链接关系，在站点地图中可以添加、修改、删除文件间的链接关系。 查看站点地图 通过“文件浮动面板”中的“扩展/折叠”按钮，打开“站点管理窗口”。 选择菜单【查看】、【站点地图】；或使用工具栏中的【站点地图】按钮打开站点地图。,2019/2/5,37,3.3.3.2 使用站点地图2,在站点地图中操作站点文件 创建文件夹 选择本地站点文件列表窗格中的已有文件夹，执行菜单命令【文件】、【新建文件夹】。 创建文件 方法同上，注意名称、类型,2019/2/5,38,3.3.3.2 使用站点地图3,文件的移动和复制 删除文件或文件夹 使用站点地图选择多个文件 使用Ctrl、Shift 向站点地图中链接现存的网页 在站点地图中选择一个网页文件，选择菜单【站点】、【链接到已有文件】，并选择一个具体的文件。,2019/2/5,39,3.3.3.2 使用站点地图4,向站点地图增加新文件并建立链接 选择文件 【站点】、【链接到新文件】 输入新文件的名称、标题及原文件的链接文本。 改变网页标题 【查看】、【显示网页标题】，直接修改 【文件】、【重命名】 创建新的主页 【站点】、【新建首页】,2019/2/5,40,3.3.3.2 使用站点地图5,显示或隐藏站点地图中的文件 设置文件为隐藏、显示 在站点地图中选择一个或多个文档，选择菜单【查看】、【显示/隐藏链接】。 显示、隐藏“隐藏文件” 【查看】、【显示标记为隐藏的文件】,2019/2/5,41,3.3.3.2 使用站点地图6,查看站点地图中的分支 在站点地图中，选择一个文件 【查看】、【作为根查看】 或点击右键， 【作为根查看】 使用“”、“”号 点击工具栏下方“站点导航”条中的上级文件，可以返回。,2019/2/5,42,3.3.3.2 保存站点地图7,可以将站点地图保存为图像文件 菜单【文件】、【保存站点地图】 输入文件名、选择文件类型和保存位置，保存。,2019/2/5,43,3.4 文本和页面属性,工具及菜单命令介绍 创建网页 文本修饰 页面的布局及属性设置,2019/2/5,44,文本属性设置,文本属性设置面板 使用菜单【窗口】、【属性】命令；或快键【ctrl】【f3】，可以显示和隐藏文本属性设置面板。,2019/2/5,45,常用对象按纽,插入面板【常用】选项卡 【常用】选项卡包含用于创建和插入最常用对象（如图像、表格和层）的按钮。,2019/2/5,46,工具及菜单命令介绍,插入面板【页面布局】选项卡 在制作网页之前，应该