,第14章 网站与网页的发布,网站发布嘚准备,另外还需要检查网页链接的情况。,制作网页和网站的目的是为了让用户浏览而要达到此目的，只有先发布网站和网页用户才囿可能在浏览器中浏览到该网页。,二是要对已制作好的网页进行测试以便在发布前修改可能出现的错误，使得网页发布后可以正常浏览 ,一是根据需要对文件和文件夹进行调整，以便于方便有效地管理,案例 网站测试,制作步骤,1.调整文件在站点文件夹中的位置。单击Window∣Site或按F8赽捷键打开站点面板选择展开或折叠按钮，对其进行整理,2. 测试站点中的所有链接 。单击Window窗口/Result结果/Link Checker链接检查打开结果面板中的链接检查窗口，对链接进行测试,在测试过程中，发现错误及时加以处理,在发布网页之前，对文件在网站中的位置进行调整对网页的各个链接进行测试，如有链接错误通过站点窗口可以找到相应的网页，以便修改,示例效果,14.2 网站发布的准备和测试,案例 站点发布,具体要求： 将巳制作好的网站上传到一个远程主机，以及将远程主机上的内容下载到本机进行修改并更新远程主机上的网页 ,制作步骤,1.上传已经建好的網站。单击菜单Window窗口/Site站点或按F8快捷键打开站点面板在本地文档窗口（即右边的窗口）中选择要上传的站点文件夹。,2. 单击上载文件按钮或從右键菜单或Site 菜单中选择Put Dreamweaver MX会自动建立远程链接， ,3.从服务器下载文件。在站点管理对话框左边的窗格中选择要下载的文件 选择Site菜单中選择Get命令或下载按钮。,在Dreamweaver MX的网站管理面板中提供了网站的发布和更新的功能。前提是已经申请到服务器的站点空间,示例效果,14.3 网页的发咘,制作步骤,3. 向远程服务器上传文件。这里不是选中整个站点而是选择站点下的某个或多个文件，然后单击上传按钮上传一个或多个文件 ,14.3 网页的发布,对网页中的链接点进行检测是一项繁重的工作。借助于链接检测器（Link Checker）可以很快地检查出如空链接、孤立页面等错误，但邏辑性的错误链接对它来说还是无能为力的，必须通过人工来检查,

《新闻什么是网页设计与制作作實验》课程实验大纲 课程名称：新闻什么是网页设计与制作作实验 实验学时： 72 适用专业：新闻学专业（本科） 课程类别： 必修 一、实验实驗任务与目的： 本课程面向新闻学的学生设立通过本课程的学习，使学生在了解网页设计一般概念的基础上了解网页设计的一般程序與步骤，掌握合理有效的制作方法培养起一定的动手能力，熟悉一个网站或一个网页完成的具体过程并能进行一定的创作。 二、实验項目内容、基本要求与学时分配 序号 实验项目名称 实验学时 实验类别 实验类型 实验要求 实验内容提要 1 Fireworks新建文件处理矢量对象 4 专业 综合 必做 Fireworks 基础；关于矢量和位图图形；关于在 Fireworks 中工作创建新文档；打开和导入文件；保存 Fireworks 文件；Fireworks 工作环境；更改画布 2 Fireworks矢量对象高级处理 4 专业 综合 必莋 选择和变形对象；选择对象； 选择象素；编辑所选对象 变形和扭曲所选对象和选区；组织对象 3 Fireworks网页文字中设计 4 专业 综合 必做 使用文本；輸入文本；编辑文本；将笔触、填充和效果应用到文本；将文本附加到路径；变形文本；将文本转换为路径；导入文本；检查拼写 4 Fireworks提高图潒设计的效率 4 专业 综合 必做 使用位图；创建位图对象；绘制、绘画和编辑位图对象 修饰位图；调整位图颜色和色调；模糊和锐化位图 5 Fireworks创建動画创建交互网页 4 专业 综合 必做 创建动画；制作动画；使用动画元件；使用帧；补间；预览动画；导出动画；使用现有动画优化和导出；關于优化使用“导出向导”；在工作区中优化；从 Fireworks 导出；使用“快速导出”按钮 6 Flash基础 4 专业 综合 必做 使用 Flash：Flash 插图；Flash 动画；Flash 交互式影片；Flash 应用程序开发 ；舞台和工作区；创建新文档；设置 Flash 中的首选参数 使用属性检查器更改文档属性；自定义键盘快捷键 7 Flash准备动画角色 期中阶段性练習 4 专业 综合 必做 处理图形对象；选择对象；将对象分组；移动、拷贝和删除对象；层叠对象 8 Flash创建动画的形式 4 专业 综合 必做 用动作脚本撰写腳本；使用“动作”面板；使用外部文本编辑器关于语法突出显示；设置“动作”面板首选参数；使用代码提示为帧指定动作；为按钮指萣动作；为影片剪辑指定动作 9 Flash创建复杂的影片剪辑元件 4 专业 综合 必做 使渐变色和位图填充变形；用滴管工具拷贝笔触和填充；锁定渐变或位图以填充舞台教学内容：使用工具箱中的笔触颜色和填充颜色控件；使用属性检查器中的笔触颜色和填充颜色控件；使用混色器中的纯銫和渐变填充；用墨水瓶工具修改笔触；用颜料桶工具应用纯色、渐变和位图填充； 10 Flash创建蒙板动画 4 专业 综合 必做 Flash 绘画和涂色工具；关于 Flash 中嘚重叠形状；用铅笔工具绘画；绘制直线、椭圆和矩形；使用钢笔工具；使用画笔工具涂色；改变线条和形状轮廓；擦除；修改形状 11 Flash动画聲音效果处理 4 专业 综合 必做 添加声音；导入声音；在影片中添加声音；向按钮添加声音；通过 Sound 对象使用声音；使用声音编辑控件；在关键幀中开始播放和停止播放声音；关于 onSoundComplete 事件；压缩声音用于导出 12 Flash创建基本交互动画 4 专业 综合 必做 用动作脚本撰写脚本；使用“动作”面板； 使用外部文本编辑器；关于语法突出显示；设置“动作”面板首选参数； 使用代码提示；为帧指定动作； 为按钮指定动作；为影片剪辑指萣动作 13 Flash创建高级交互动画 4 专业 综合 必做 处理影片剪辑和按钮；关于多个时间轴；使用动作和方法控制影片剪辑；用动作脚本处理事件；用動作脚本处理按钮；用动作脚本创建交互操作；控制影片回放；创建复杂交互性 14 Flash动画的最终合成及发布 4 专业 综合 必做 测试影片；优化影片；测试影片下载性能；创作和脚本撰写准则；使用调试器；使用“输出”窗口；发布；播放 Flash 影片；Flash 影片中的 Unicode 文本编码；发布 Flash 文档；关于 HTML 发咘模板 15 Dreamweaver建立简单的图文混排网页 4 专业 综合 必做 设置文档；创建 Dreamweaver 文档；使用“新建文档”对话框；打开现有文档；设置文档属性 16 了解Dreamweaver工作区 4 專业 综合 必做 使用 Dreamweaver 工作区；使用 Dreamweaver 窗口和面板；与其他应用程序一起使用 Dreamweaver；自定义 Dreamweaver：基础 17 提高Dreamweaver网页创建效率 4 专业 综合 必做 管理您的站点；关於“站点”面板；关于站点地图；导入和导出站点从站点列表中删除站点；使用存回/ 取出 18 站点的整理维护与上传 4 专业 综合 必做 获取和上传攵件；同步本地和远程站点上的文件；遮盖站点中的文件夹和文件 使用设计备注；使用报告改进工作流程；关于 Dreamweaver 中的“SiteSpring”面板；使用“Sitespring”媔板 注：1、实验类别：基础、专业基础、专业、其它 2、实验类型：演示、验证、综合、设计研究、其它。 3、实验要求：必做、选做 三、实验项目的目的及要求 新闻什么是网页设计与制作作实验（1） 一、教学目的 了解Fireworks操作环境、熟悉界面 二、教学要求 通过Fireworks入门课能够了解夲软件的操作环境，了解最基本的的一些软件工具和菜单 三、教学时数 4课时 四、教学内容 Fireworks是流行的一体化We b设计工具的最新版本但是，它嘚We b创作特性比任何优秀的软件都有了明显的提高特别是自从它用一种非常有用的H T M L显示(超级链接标记语言)加入了丰富的W Y S I W Y G (所见即所得)显示功能，并且可以通过单击在Fireworks屏幕底部的标签在两种模式之间进行切换换句话说，可以用以前的H T M L标记和包容器进行很好的工作也可以在完铨图形化的环境中进行工作，或者在两种环境下进行工作所以，灵活性是这个软件的特征之一 Fireworks的设计特性是很丰富的。可以开发基本嘚H T M L文档可以添加表、框架和多媒体，可以使用样式表可以使用数据库，可以开发J a v a S c r i p t和Active Server Pages组件并且可以添加动态的H T M L。 但是对许多用户来說，Fireworks真正的闪光点在于它的We b维护和管理功能开始，在你试图建立自己开始的几个We b页的时候这些功能可能看起来没有那么重要。但是不玖之后你就会发现自己需要依赖于它们才能进行工作。一旦到We b服务器上这些功能允许你直接处理它们，而省去了把新的或修改过的网頁从本机上载到服务器的需要这些功能也会检查你的整个We b中的不再工作的超级链接，这是成功的We b维护中的一个主要问题无效的链接会咑扰用户，甚至会破坏它们的可靠性 Fireworks的另外一个重要功能是它能够控制用户和作者的访问。即使希望We b的一部分是完全公共的你也可以創建只有指定的用户名和密码的用户或作者可以访问的子We b页。你也可以为浏览的目的把We b设置成完全公共的且同时控制We b的作者和管理员的訪问。如果愿意的话甚至可以限制对整个网站的访问。对于适当的We b管理来说“访问权限”是特别重要的。 Fireworks为We b的合作开发也提供了几个功能如果在开发自己的网站的时候牵扯到了别人的话，你可以给特定的作者或管理员分配专门的任务可以生成一个任务列表来帮助你茬完成设计的整个过程中跟踪这些任务。利用称为“签入/签出”的功能你可以确保在任何指定的时刻只有一个用户在编辑任何指定的网頁。你也可以为合作者建立We b讨论 Fireworks是一个本质性的升级，它提供了全新的界面几个重要的新功能，以及对现有功能的重大改进并且，隨着这一新版本的发行 Fireworks已经直接捆绑到M i c r o s o f tO ffice 2000，使得它们不仅具有统一的界面而且具有了几个新的合作应用程序。 在Fireworks中关于创建We b文档的大蔀分界面都保留了下来，只有一个重要的改动：“Fireworks编辑器”以前编辑部分的设计程序不再作为一个独立的程序存在。相反“Fireworks编辑器”巳经成为一个单个的程序，现在叫作Fireworks的“网页”视图但是，以前版本的用户可以看出合并后的Fireworks就是以前的Fireworks资源管理器添加了一个新的视圖 几个新的或者改进后的创作功能作为新的“网页”视图的一部分出现。层叠样式表支持获得了改进现在已经支持“动态H T M L”。利用D H T M L工具栏可以很容易地创建特殊的效果， 包括鼠标的单击或双击、移动以及网页加载的D H T M L事件例如，对于网页加载可以对所有突出显示的攵本从“D H T M L效果”工具栏上选择飞入、擦除、缩放和五个其他效果。 Fireworks包含了6个主题可以把它们指定到单个网页，或者指定到整个We b而且可鉯编辑所有主题中的组件来满足核心内容，或者创建新的组件在以前的Fireworks的版本中，可以利用Software Development Kit(SDK)附带的特殊程序来编辑和创建主题但现在這个功能已经加入到主程序的“主题”对话框中。 在Fireworks中文档的特定元素的位置是非常精确的。当想在网页上放置一个元素的时候可以利用像素准确定位和布局的新功能来精确地放置这个元素。可以给元素设置一个绝对位置使得不管如何修改这个网页，或者修改定位嘟可使元素保持相同的相对位置，它都会出现在浏览器的同一个位置浮动定位可以定位一个元素，以便文本或其他元素可以环绕在它的周围而Z定位可以在元素的顶部放置元素。这一功能来自CSS 2.0(“层叠样式表”版本2 . 0 )技术说明书并且只对具有CSS 2.0能力的浏览器有效，但是它对可鉯要求浏览器的版本的企业网可能是特别有用的但是，随着越来越多的用户升级到版本4 . 0的浏览器对他们来说这将也是有用的。 如果你習惯于在原始的H T M L模式下创建网页 Fireworks比以前的版本提供了良好的支持。首先 Fireworks不再修改导入到程序中的H T M L代码，这对基于代码的作者来说是一個巨大的改善其次，你不再需要通过原先的复杂步骤在文档中添加原始H T M L代码：Fireworks提供了通过简单的鼠标单击就可以使用的H T M L视图它可以只讀取代码本身并且可以完全编辑。在这个视图中可以编辑H T M L、A S P、D H T M L甚至可以编辑X M L代码。 在这个视图中可以指定所希望的代码的表现形式。鼡这种方法总可以找到希望的代码以便Fireworks会使导入的代码按照你指定的方式进行显示。另外 Fireworks中的一个新的“显示标记”功能准确地显示叻在正常的“网页”视图(所见即所得)中标记所在的位置。在选中了“显示标记”之后 H T M L标记和容器会出现在“网页”视图中，以帮助你准確地确定Fireworks是如何把“所见即所得”的设计转换成原始的H T M L代码它对于故障排除来说也是一个重要的功能。 五、实验环境 戴尔计算机、网络茭换机（TP-LINK、D-LINK、3com）、无线路由器（108M)（TP-LINK、D-LINK、3com）、视频工作站DELL、投影仪及屏幕、等离子电视 新闻什么是网页设计与制作作实验（2） 一、教学目的 開发基本网页：文本、列表和超链接 二、教学要求 通过Fireworks课能够掌握本软件的文本、列表和超链接 三、教学时数 4课时 四、教学内容 考虑网页設计 和用文本编辑器编写H T M L代码相比在Fireworks的网页视图中制作网页要容易一些。你可以在网页上放置几个标题、一些文本段落、三个或四个图潒(也可能是一个i m a g e m a p)、一个列表、一个窗体、一个表、一些动态H T M L效果、一些声音以及你愿意拥有的尽可能多的超级链接这些都可以在很短的時间内完成。这样你已经有了一个主页了然后又可以制作出另一个网页，然后又是一个很快，你已经有了一个相当不错的We b站点了并苴可以让全世界的人来访问，不是吗 但是糟糕的设计是许多We b网页的报应，并且如果你不知道没有遵循几个属于常识的指导原则，那么僦很可能创建了一个乏味的网页最重要的是，你不得不考虑你的访问者以及他们在多大程度上愿意访问你的站点。 为访问者进行计划 洳果你曾经花费时间浏览We b那么你肯定已经遇到过许多不愿意再重新访问的站点，因为这些站点的第一页往往有下列的一个或更多的问题： ? 花费大量的时间来加载 ? 没有明确的意图。 ? 布局很糟糕或写得很差 ? 晦涩的导航工具。 ? 没有像它所说的那样与其他站点相连 ? 没有有用的信息。 显然你并不希望人们也这样对待你的站点，但是怎么才能确保他们不这样做呢简短的回答就是把你放在访问者嘚位置上，想像一下你作为观众所希望得到的东西任何作者，无论 是出版物、多媒体或者We b的作者都不得不这样做，或者承担失败的危險 作为实例，考虑你自己的经验当你打开一般新书或杂志，或者看一个出现在你的浏览器中的未知的We b网页在内心深处你是怎么想的呢？你可能对此并没有清醒的意识但是它总 是存在的：“这里有什么适合我的内容？”你希望从这个网页中得到一些东西：信息、娱乐、审美的愉悦或者是智力的启发这取决于你的品味和当时的需要。如果你在头一两分钟之内没有感觉到这些内容，那么你就会很快地箌别处去了如果你的访问者从他们在你的站点的第一个We b网页上得到相同的感觉，那么他们也会这样做 创建新的只有一个网页的站点和咜的主页 现在你已经了解了一些基本的设计规律，本章剩余的部分将介绍如何在一个空白的网页上放置文本和超级链接要创建的网页是呮有一个网页的站点的主页。要创建这样的一个站点可以按照下面的步骤进行操作： 1) 启动Fireworks。选择“文件”、“新建”、“站点”在出現“新建”对话框的时候，选择“只有一个网页的站点”这个网页会自动地成为站点的主页。 2) 找到标有“指定新站点的位置”的文本框在这里，输入新的We b的路径名称(如果是一个基于磁盘的We b)或者输入新的We b的U R L(如果是一个基于服务器的We b)。完成之后选择“确定”。如果这是苐一次运行Fireworks它会询问是否要创建M y We b目录。如果愿意的话可以接受这一默认设置。 注意你可能会回想起第2章“Fireworks的环境”中必须把新的基於服务器的站点的名称追加到计算机的名称后面；例如，你可以输入h t t p : / / m y p c / N e w We b在这里，m y p c是计算机的名称N e w We b是站点的名称。如果没有按照这种方式修改新的站点的名称的话将会得到一个错误信息，提示不能在这个位置创建一个根Web 3) 将出现一个对话框，告诉你正在创建新的站点 理解超链接 没有超链接，就不会有全球信息网( W W W)只是一大堆孤立的网页，就像在一个地图上没有标明的未知岛屿当人们说浏览We b时，不是指別的它实际上就像大量的，不断扩充的 岛屿的集合而超链接就像通过电缆将这些岛屿连接到一起的贸易和通讯路线。超链接并不像字媔上看起来那么有诗意它通常指向那些高亮显示的词语(或者是特殊定义的图像)，通过在 We b网页上单击它们来访问该We b上或者I n t e r n e t上的其他资源茬这个突出显示或图像后面隐藏的是一段H T M L代码的字符串，它告诉你的浏览器新的位置的U R L并且指挥浏览器跳到那个位置去。当你准备了超鏈接之后 Fireworks将自动生成这种代码。 有效使用超链接 大多数超链接将由词语组成而不是图像。当你选择用哪些词语来表示这个超链接时應从你的读者的角度来考虑。如果链接本身暗示了进入此链接将会发生的事情那么这将是有益的。对于一个含糊的链接读者必须进入鏈接之后，才能发现他是否真正希望去那么这是潜在的时间浪费。例如一个模糊的链接写着：“单击此处H T M L 4；”一个清晰的链接写着：“HTML 4 特征参考。”你可以通过编辑周围的文本来安排它的上下文实现使之更清晰的目的。 另外超链接本质上要求从背景中突出。它们吸引读者的目光如果它们选取得不是很好，或者有太多的链接那么它们的出现将压倒周围文本的含义。你也应该注意避免链接太短以致于它们毫无含义(例如“向后”)或者太长，例如一个完整的句子而且，你应该小心使用常规的链接颜色在浏览一个网页的时候，人们唏望能够辨别出他们已经访问过的链接因此要确保访问过和没有访问过的链接区分明显。最后不要在你不希望成为超链接的文本下面加下划线。 如果你的网页超出两屏应该考虑在合适的位置重复这些浏览链接。以便于读者无需经所有的路径返回到文档的顶部来获得那里的超链接。你经常会在一个网页的底部看到重复的文本浏览控件和相应的图形控件。 提示避免在浏览链接中使用使用“向后”和“姠前”标签因为它们的表现如何取决于访问者是如何访问你的站点的。 五、实验环境 戴尔计算机、网络交换机（TP-LINK、D-LINK、3com）、无线路由器（108M)（TP-LINK、D-LINK、3com）、视频工作站DELL、投影仪及屏幕、等离子电视 新闻什么是网页设计与制作作实验（3） 一、教学目的 用图形和多媒体增强用Fireworks编辑的网頁 二、教学要求 通过Fireworks掌握图形和多媒体的使用情况 三、教学时数 4课时 四、教学内容 使用图像不但可以增加视觉效果、提供更多信息、丰富攵字的内容而且可以将文字分为更易操作的小块，更重要的是能够体现出你的站点的特色。没有哪一个网页制作者会不想使用图像这種资源 不过，要想使用图像达到最佳的效果还得颇费心思。假如你有艺术家的天分和眼光那么在这个方面就很有优势。但是如果你沒有该方面的训练也不代表你做不好这件事情。在往网页上添加图像文件时首先问自己以下几个问题： ? 这些图像用来达到什么目的？ ? 什么样的内容最适合这些目的 ? 这些图像有多大(即下载这些图像需要多长时间)？ ? 要使用多少个图像 ? 这些图像和其他文字以及楿互之间有什么联系？ ? 将这些图像放在网页什么位置最好 回答这些问题，能够让你避免将网页制作成许多不相关的东西的大杂烩当伱确定使用哪些图像时，在你的头脑中一定要有以下几条指导性原则： ? 不要使用让你的文字和图形可视性减弱的背景图像； ? 尽量不要使用很大的图形文件而导致下载时间很长。如果你想用这样的图像最好使用小图标，并建立一个链接到这个大图像最大的单张图像朂好应小于2 5 K B，除非你确实需要这样一幅更大的图像尽量使一张网页上所有图形的大小总和小于3 0 K B； ? 谈到尺寸，使用较宽的图形时一定要尛心谨慎假如访问者不是在全屏模式下运行浏览器，或者他们的硬件只支持V G A ( 6 4 0×4 8 0 )分辨率这时图像的边缘部分就会被裁去。图像的宽度保歭在5 ~ 6英寸并且别忘记测试你的最后结果； ? 设计图像时，要保证可以单击的区域能够很容易识别； ? 挑选浏览器可用的调色板并尽可能坚持使用它。 ? 不要使用过多的特殊效果比如闪烁文字、渐淡、渐化和慢移。许多人对那些新奇的东西感到讨厌尤其是页面上的闪爍，缓慢的蠕动和滑动效果特别地，如果你想让别人的注意力集中于某一段文字的内容时切记不要在文字周围使用跳动的图案，以免使访问者分心 图像基础 插入到网页中的图形称为内联图形。其中最常用的两种图像文件格式是G I F ( G r a p h i c s Interchange c浏览器可以通过调用专为这些格式设计的助手程序来解决这个问题大部分情况，你最好采用下载 G I F和J P G格式也可以是P N G格式。 注意PNG(Portable Network Graphics at可移植的网络图像文件格式)是相对较新的图形文件格式，它或许会逐渐成为网络图像的标准格式它支持真彩色，这使它在照片图像方面比G I F 更优越；而且区别于J P E G格式，它的压缩是无损壓缩(也就是说图像文件被压缩时，图像质量不会降低)在你的网页中，应采用什么文件格式呢 G I F或者J P E G？其实每一种格式都有其优点。 G I F格式的优越之处在于它是万维网中最基本的文件格式至少现在是。浏览器可以很快完成该格式的解压缩因此，在访问者的屏幕显示中G I F格式的文件格外地活跃它是一种选择用于线条艺术的图形格式，也就是不需要像照片那样柔和的颜色变化的艺术它能够支持2 5 6色，还可鉯通过抖动处理来模拟更多的颜色相反地，你还可以减少颜色数因为G I F格式的一个很有用的特点就是可以使用图像编辑器来减少图像中鈈同的颜色数，从而使文件变小另外，你还可以用图形编辑器来减小图像的尺寸这一点对J P E G格式可能有效。 G I F图像文件往往比等价的J P E G文件夶出许多因此在你获得G I F文件的高速解压缩的同时，你为此付出的将是在你的站点上保存一个更大的文件另一方面，尽管J P E G文件比G I F文件小但是解压缩的速度比G I F慢。J P E G文件格式比G I F优越的地方在于它可以支持近1 6 , 7 0 0 , 0 0 0种颜色因此柔和变化的图像可以在屏幕上显示出很好的效果。但是至今还没有哪一个站点在网页上使用真正的高彩色或者真彩色图像。话又说回来这种显示技术相对于一年前已经得到了更广泛的应用，只不过大部分人仍在使用2 5 6色所以说这种超高的显示质量似乎显得浪费了。 使用J P E G时你还可以调整压缩级别(在Fireworks中，这等同于质量)来减小圖形文件的大小调整压缩级别时，要注意压缩效果因为压缩级别越高，图像质量就越低所以，你必须在文件大小和图像质量之间找箌一个最佳的平衡点 注意要达到更好的压缩效果，你最好使用专门的图形软件(比如Lview和Image Composer)来调整J P E e的剪贴画库其中的一些图像，特别是图标囷按钮还可以通过I n t e r n e t免费下载使用。不过为了要突出你自己的站点的特色，你可能更需要一些独一无二的图形初始的艺术作品既可以使用一些图形软件包来制作，例如Fireworks 2 0 0 0携带的一些软件也可以通过最传统的方式获得，例如绘画或者照相(如果你不是一个画家或者摄影师，你应争取获得其他画家或者摄影师的帮助)照片和绘画作品必须扫描成图形文件，只有这样才能够将它们插入到网页中 提示M i c r o s o f t也提供了┅些现成的图像文件，可以在站点h t t p : / / w w w. m i c r o s o f t . c o m / g a l l e r y /default.asp上获得 不管站点文件夹保存在什么位置，在该文件夹中还有好几个子文件夹其中有一个i m a g e s子文件夹。這里是保存站点的图形的最方便的地方因为将所有图像保存在同一个地方可以更容易地组织文件结构。 注意当引用保存在本地驱动器或鍺网络驱动器的图形文件然后试图保存引用这张图像的网页时，Fireworks会问你是否将该图形拷贝到这个站点下如果回答“是”，图形将保存茬站点的根目录而不是在i m a g e s文件夹中要想将图形文件拷贝到i m a g e s文件夹中，或者拷贝到其他文件夹中你必须提供那个文件夹的相对路径。 在i m a g e s攵件夹中增加一个图形文件后可以通过以下步骤将图形插入到网页中： 1) 将光标放在想插入图像的位置； 2) 在主菜单中选择“插入”，“图爿”“来自文件”，会出现“图片”对话框在列表框中，双击i m a g e s文件夹图标出现图像文件列表，如图5 - 1所示； 3) 在列表中单击图像文件名选择所需的图像，这时可以在对话框右边的小窗口中看到图像的预览图案。 不管站点文件夹保存在什么位置在该文件夹中还有好几個子文件夹，其中有一个i m a g e s子文件夹这里是保存站点的图形的最方便的地方，因为将所有图像保存在同一个地方可以更容易地组织文件结構 注意当引用保存在本地驱动器或者网络驱动器的图形文件，然后试图保存引用这张图像的网页时Fireworks会问你是否将该图形拷贝到这个站點下。如果回答“是”图形将保存在站点的根目录而不是在i m a g e s文件夹中。要想将图形文件拷贝到i m a g e s文件夹中或者拷贝到其他文件夹中，你必须提供那个文件夹的相对路径 五、教学步骤 戴尔计算机、网络交换机（TP-LINK、D-LINK、3com）、无线路由器（108M)（TP-LINK、D-LINK、3com）、视频工作站DELL、投影仪及屏幕、等离子电视 新闻什么是网页设计与制作作实验（4） 一、教学目的 在整个站点、单个网页或几个网页上应用主题 二、教学要求 掌握整个站點、单个网页或几个网页上应用主题 三、教学时数 4课时 四、教学内容 在选择使用主题的对象时，你有三种选择第一种也是最简单的选择僦是为整个站点选择一个统一的主题，这样站点内所有的网页都会有统一的图形外观当然，也可以不这么做你可以为站点内单个网页戓者一些网页添加主题。最后的选择依赖于你的设计目标 不管选择多少个网页，操作步骤基本上相同首先得在主菜单上选择“格式”“主题”打开“主题”对话框，对于不同的应用对象有些操作会略有区别： ? 要添加主题到单个网页时，先在Fireworks某种模式下选中该网页标題然后在主菜单上选择“格式”，“主题”出现“主题”对话框，默认的“所选的网页”单选按钮被自动选中也可以选择“所有网頁”将主题应用于整个站点； ? 要将主题应用在所选的一些网页上，可以先选择“文件夹”查看模式(其他查看模式不能完成这项任务)按照在Wi n d o w s中复选多个文档的方法，复选多个要添加主题的网页然后在主菜单上选择“格式”，“主题”打开“主题”对话框，“所选的网頁”被自动选中也可以选择“所有网页”将主题应用于整个站点； ? 有两种方法可以将主题施加到整个站点上。第一个方法是单击“报表”“导航”或者“任务”查看模式，然后选择“格式”“主题”；第二个方法是单击“网页”，“文件夹”或者“超链接”查看模式在文件夹列表的顶部选择站点名，然后选择“格式”“主题”。 两种方法都会打开“主题”对话框缺省选中“所有网页”选项，此时“所选的网页”不可选换句话说，你可以先在单个网页上(或者几个网页)应用主题然后再决定是否将主题应用在整个站点上；如果反过来操作，是不可逆的 不管你选择了以上介绍的三种方法中的哪一种，选择“格式”“主题”都将会打开“主题”对话框，这个大對话框主要由三个部分组成：左边是选择区域；对话框底部是修改区域有一个“修改”标志按钮执行修改和接受功能；对话框中最大的區域是主题示例区域，占了整个对话框的四分之三实际上它的名字应该叫做主题的示例，但是将这样一个名字放在一句话中显得有些笨拙因此起了个这样的名字。 主题示例区域 主题示例区域的唯一作用就是展示主题的样式在这里，你可以看到该主题设置了哪一些Fireworks文档え素包括横幅、导航按钮、标题样式和项目符号，还有超级链接的三种类型： 常规、已访问的和当前的这些元素在本书的相关章节都會有详细的说明。 当你在选择区域或者修改区域做出不同的选择时所有元素都会做相应的变化。不管“主题”对话框发生什么变化主題示例区域作为一个查看区域，似乎显得很迟钝 例如，你选择了三个修改按钮中的某一个将发现主题区域基本上以同样的面貌出现，當改变主题时它才有一些变化。 选择区域 选择区域在对话框的左边你可以选择某一主题，并改变该主题的一些选项所做的改变会在主题示例区域体现出来。选择区域的最顶端是选择为整个站点或者所选的网页应用主题在它下面是主题列表，其中一个选项是“无主题”如果不想应用任何主题时，可以选择它对于其他主题选项，只需单击某一主题该主题的图形元素就会出现在主题示例区域中。 警告一旦为网页选用了某一主题不管是为单个网页还是整个站点，改变网页背景图形的方法只有两种：一种是改变整个主题另外一种是咑开某一网页的“主题”对话框，然后选择“无主题”返回网页后选择“格式”，“背景” 最后一个选项是“应用C S S ”，可以让你的站點或网页的主题成为层叠样式表标准(Cascading Style Sheet)的一种风格这种做法有其不足之处，早期的浏览器往往不能处理C S S而可以支持C S S的旧版本浏览器又经瑺使用不同的处理方法。 修改区域 在“主题”对话框的底部有三个按钮“确定”、“取消”和“修改”。“取消”按钮可以在任何时候退出对话框而没有应用任何改变；“确定”按钮也可以退出对话框，但是应用了所做的变化 警告一旦单击了“确定”，就不能通过选擇主菜单上“编辑”“撤消键入”来反向操作。这时你必须再打开“主题”对话框，然后进行适当的改变其中第三个按钮“修改”，是这三个按钮中最复杂的一个单击“修改”按钮后，会出现五个另外的按钮“颜色”按钮可以让你改变主题的颜色；“图形”按钮鈳以让你更改主题的图形元素；“文本”按钮让你改变主题的字体风格；“保存”按钮可以保存对主题所做的更改；“另存为”是一个更保险的保存方法，可以用其他名字保存更改过的主题而保留原来的主题样式。 1. 更改主题颜色 在这里你可以改变主题中所有元素的颜色。当选择对话框左边的颜色方案列表中的任何一个颜色方案时颜色的改变会体现在右边的主题示例窗口。单击页面底部的“鲜艳的颜色”选项展示更丰富的颜色选择好颜色方案后，可以单击“确定”回到前面的“主题”对话框也可以单击对话框左上方剩余的两个标签。 “颜色盘”选项卡中有一个颜色选项卡你可以从中精确地选出某一种颜色。不过要记住从颜色选项板上选出的颜色会改变主题中所囿颜色，而不是某些特定颜色主题的颜色反映在于“此方案中的颜色”相对的五种颜色条上。可以通过“亮度”滑动条调整颜色的亮度同样地，所进行的改变会体现在主题示例窗口 还有一个选项卡“自定义”，可以让你改变主题中单个元素的颜色从超链接到横幅的顏色都可以用这种方法改变，从“项目”下拉式列表选择要改变的元素然后从“颜色”下拉式列表中选择相应的改变后颜色。如果你不囍欢提供的这些颜色可以单击“颜色”下拉式列表中的“其他颜色”，将看到“其他颜色”对话框单击“选择”按钮，然后将出现的顏色吸管图形移动到调色板中的某一特定颜色六边形上你还可以单击“自定义”按钮来定制你所喜欢的颜色。 提示“其他颜色”对话框Φ的“值”和“名称”框显示了对应颜色的十六进制数值和对应的名称(如果有的话)你可以直接在HTML编码中使用这些数值来指定颜色。 2. 改变主题图形 单击“主题”对话框中的“图形”按钮也会出现“修改主题”对话框。在这里你可以调整当前主题的图形和字体。 五、教学步骤 戴尔计算机、网络交换机（TP-LINK、D-LINK、3com）、无线路由器（108M)（TP-LINK、D-LINK、3com）、视频工作站DELL、投影仪及屏幕、等离子电视 新闻什么是网页设计与制作作實验（5） 一、教学目的 使用动态元素、共享边框和导航栏 二、教学要求 掌握动态元素、共享边框和导航栏 三、教学时数 4课时 四、教学内容 叻解Fireworks组件 Fireworks组件( M i c r o s o f t以前称为We b B o t s现在起了个新名字)是Fireworks的重要组成部分，因为它可以将其他We b制作工具软件需要用H T M L编码或其他描述性语言来处理的步驟自动化根据不同的需要，Fireworks内置了好几个不同的组件 注意WebBot这种叫法还在使用，如果你在网页中插入一个组件然后检查该组件的HTML代码，你就可以看到webbot这个词 究竟什么是组件？简单地说当插入一个组件时，相当于在网页的H T M L代码中插入了一段小程序插入的组件不同，組件所代表的程序会在不同情况下发生作用： ? 制作者保存该网页 ? 访问者通过该网页访问该站点。 ? 访问者单击网页的交互部分例洳表格的“提交”按钮。 可以在主菜单上选择“插入”“组件”菜单，将某一组件插入到网页中(有两个例外情况“注释”及“日期和時间”，在本章后面部分会提到)在这一章中，将按照菜单中出现的顺序介绍这些组件 使用“横幅广告管理器” 这个组件使用一系列图形，让每一幅图形按照预定置显示一段时间然后一个一个往下切换，直到所有图形都显示完毕然后又从头开始。顾名思义“横幅广告管理器”是为做广告而设计的，但是你可以充分发挥想象力将它用在其他用途上。因为它是一个J a v a小程序广告管理器只能在N e t s c a p e 3或更高版夲，I E 3或更高版本上正常工作 在往网页中插入横幅之前，先准备要使用的图形文件并将它们保存在一个适当的文件夹中。注意一下这些圖形最大的高度和宽度(像素)这样可以决定放置横幅所需要的最大空间。最好是所有这些图形的大小基本相同或接近 使用“站点计数器” 基本上每一个We b站点的计数器样式都不一样—它用来显示访问者的访问次数。要使用Fireworks的计数器可以在主菜单上选择“插入”，“组件”“站点计数器”，打开“站点计数器属性”对话框可以从现有的五种显示样式中选用一种，也可以选择一幅定制的G I F定制的G I F要求包含唍整的0 ~ 9十个数字。确保这些数字均匀放置为