《网页制作基础教程.doc

第1章 使用Dreamweaver建立网站 本章的教学目标为： （1）了解网页和网站的概念，特别是主页的概念；能够分析网站的结构。 （2）了解Dreamweaver 的操作界面。 （3）学会规划网站的结构；能够画出网站结构图。 （4）熟练掌握建立网站的方法。 （5）能够创建网站地图；能够更改网页的标题。 本章的教学建议： 本章的教学核心是创建一个网站。这包括了解网站的相关概念，熟悉制作网站的工具，规划出网站结构草图，到最后创建出一个网站的全过程。对于网站、网页等概念性的东西，可以根据实际情况进行删减，毕竟对于计算机专业的学生来说，这些不是新的概念。而对于Dreamweaver操作界面的讲述需要花一些心思。怎样通过一个巧妙的例子，将Dreamweaver的操作特点讲清楚是一个难点，如果仅仅是依次介绍，就显得太枯燥了。 本章还要向学生传达一个信息：制作网站前的准备工作与制作网站的操作同样重要，尤其是素材的搜集与网站结构草图的规划。要认识到制作一个网站是一个复杂的体系工程，这与使用Word制作一个文档是存在区别的。 对于具体的操作步骤，教材介绍的非常详细，建议让学习者按照课本自己操作。 课时安排：2课时 本章的教学内容： 1.1网页与制作工具 1.1.1认识网页 简单地说，网页就是把文字、图形、声音、影片等多种媒体形式的信息，以及分布在因特网上的各种相关信息，相互链接起来而构成的一种信息表达方式。 在浏览网站时看到的每个页面则是这本书中的一页，我们称之为“网页”。 在进入网站后显示的第一个页页，我们称其为“主页”。主页就像一本书的目录，它是所有网页的索引页。通过单击主页上的超级链接，可以打开这个网站中的其他网页。 1.1.2 HTML HTML语言， Hyper Text Markup Language，即超文本标识语言。 HTML语言是一种超文本标记语言，它用来描述某个事物应该如何合理地显示在计算机屏幕上。 用文本文件编辑软件可以打开HTML文件或编辑HTML文件。 显示HTML文件的内容必须借助因特网浏览器。 用HTML语言来编辑网页存在许多缺点。 1.1.3网页制作工具 网页制作软件可以实现主页制作者与HTML语言的分离，我们只需在编辑器中输入文本或图片，网页制作软件将帮助我们将这些文本或图片转换成相应的HTML语言代码。 在众多网页制作软件中，FrontPage是一种比较简单的软件。除了Frontpage 以外，还有许多制作网页的软件，如Hotdog等，其中最著名的是ADOBE公司的Dreamweaver，它和该公司的另外两个产品Flash（动画制作工具），Fireworks（图像编辑工具）一起称为“网络三剑客”。 1.2使用Dreamweaver建立一个网站 1.2.1 Dreamweaver的操作界面 Dreamweaver，面板在网页编辑的过程中，通过单击面板的按钮来为网页添加相应的元素，如图片、表格、、Flash等属性面板用于显示所选中的网页元素的属性，并可在属性面板上修改。Dreamweaver的其它面板都在窗口右半部分，并采用了展开与折叠功能，单击可以展开面板，同时该按钮变成状，单击它可以将面板折叠起来。 用鼠标单击菜单栏上的“文件”，在弹出的菜单中选择“关闭”，可以关闭打开的网页。 1.2.2 画出网站结构图 为全面地展示一个主题，往往需要制作若干个网页，把这些网页互相链接起来，就构成了一个网站，也称为Web站点。 在开始建立网站之前，首先要确定网站的主题，根据主题确定这个网站需要由多少个网页构成，以及这些网页之间的关联关系等画出结构图，这样不但可以帮助规划网站结构，使网站条理清楚、主题鲜明，还可以确定各个网页的内容，方便大家思考各网页之间的链接方式。 1.2.3建立一个网站 在Dreamweaver MX工作窗口中，单击“站点新建站点，Dreamweaver MX工作窗口。 1.2.4在网站中添加网页 在浮动面板“文件”项的“站点”选项卡中，将鼠标指针移到站点名称上，单击右键，从弹出的快捷菜单中选择“新建文件”，站点文件夹被展开，同时自动建立了一个名为“untitled.htm”的网页。 1.2.5更改网页名称 网页建立以后，名称栏中的“untitled.htm”处在选定状态，可直接输入网页文件名。 1.3创建网站地图 1.3.1创建网站地图 创建网站地图可以规划和管理网页之间的关系，同时实现网页之间的导航。 单击“站点”选项卡中的“展开/折叠”按钮，按住“站点地图”按钮，从弹出的菜单中单击“地图和文件”，打开“站点地图”窗口。 在窗口右侧文件列表中找到 “index.htm”，用鼠标右键单击该文件名，在弹出的快捷菜单中单击“设为首页”。 在左侧窗口中单击“index.htm”网页文件图标，使其右边出