网页是计算机网络最基本的,网页的概念网页是计算机网络最基本的信息单位它实际是一个文件.doc...

网页的概念网页是计算机网络最基本的信息单位它实际是一个文件

DREAMWEAVER 8.0 网页制作教案(一)

邝翠珊 cskuang@ 826

一、网网页网页是计算机网络最基本的信息单位,它实际是一个文件,存放在世界某个角落的某一台计算机中,当我们在浏览器输入网址后,网页文件会被传送到你的计算机,这样就可以利用网页来访问计算机了网页分类1)静态网页:网页中包含文字图片2)动态网页:网页中包含文字图片以及交互功能.两者的主要区别:是否包含交互功能《自动控制原理》精品课程

网站：是众多网页的集合。

(二)、网页的基本构成元素：

包含图片，文字，超级链接，动画，表单，视频音频等元素中的一种或多种

(三)、网页的页面设计：

(1)、网页布局：网页布局是根据你所设计网站类型而设计的，不同的网站有不同的风格，一般包括了标题栏，页眉区(通常包含网站标志)，导航区，正文区、页脚。 例：校园建筑设计学习网站

(2)、配色原则：网页设计要达到赏心悦目的目的，需要注意色彩的搭配与风格的设计。例：麦当劳

(3)、版面编排：例：清华大学

版面美感实用，美感是令人感觉舒服的主要因素之一 “经营位置”。作为一种版面，既有文字，又有图片。文字有大有小，还有标题和正文之分;图片也有大小，而且有横有竖之别。图片和文字都需要同时展示，不能简单地罗列在一个页面上，这样往往会搞得杂乱无章。必须根据内容的需要，将图片和文字按照一定的次序进行合理的编排和布局，使它们组成一个有机的整体可以依据如下几条来做：

1.主次分明，中心突出。在一个页面上，必然考虑视觉的中心，这个中心一般在屏幕的中央，或者在中间偏上的部位。因此，一些重要的文章和图片一般可以安排在这个部位，在视觉中心以外的地方就可以安排那些稍微次要的内容，这样在页面上就突出了重点，做到了主次有别。

2.大小搭配，相互呼应。较长的文章或标题，不要编排在一起，要有一定的距离，同样，较短的文章，也不能编排在一起。对待图片的安排也是这样，要互相错开，造成大小之间有一定的间隔，这样可以使页面错落有致，避免重心的偏离。

3.图文并茂，相得益彰。文字和图片具有一种相互补充的视觉关系，页面上文字太多，就显得沉闷，缺乏生气。页面上图片太多，缺少文字，必然就会减少页面的信息容量。因此，最理想的效果是文字与图片的密切配合，互为衬托，既能活跃页面，又使主页有丰富的内容。

网站设计的原则 内容明确(２) 网页色调和谐，布局清晰。(３) 网站有效的导航条使人很容易从每一页上访问网站的任何部分每一页同样的位置上都有相同的导航条(４)避免长文本页面避免使用过大的图像不要使用横。 避免错误链接保证链接有效。Dreamweaver 软件的启动

四、Dreamweaver 8.0操作界面

DREAMWEAVER 8.0操作界面

(一)工作区的组成结构：

(二)、Dreamweaver面板和面板组：

(三)菜单栏中各个菜单的基本作用：

文件：包括对文件的各种操作。

编辑：包含了对文件的拷贝，粘贴，查找与替换等命令。

查看：使用查看菜单可以查看文档的相关内容。

插入：用于将对象插入文档中。包括图片标记、flash动画、视频、表格、超级链接、日期、水平线等：属性可以在属性面板中进行可视化设置

修改：可以使用修改菜单更改选定页面元素的属性。

文本：可以设置文本的格式，如段落格式、字体、文本环绕排版及停止文本环绕等。

命令：提供各种命令的访问。

站点：提供用于管理站点以及上传和下载文件的菜单项，可以创建站点和对 已有站点进行编辑

窗口：提供对Dreamweaver中的所有面板，检查器和窗口的访问。

帮助：提供了对Dreamweaver文档的访问。

五、定义一个站点

举例：Dreamweaver学习网站

(一)、定义一个站点

在正式开始制作网页之前，最好先定义一个新网站，这是为了更好地利用站点窗口对站点文件进行管理，也可以尽可能的减少一些错误的出现，如路径出错，链接出错我提倡的做法是：建立一个文件夹用于存放网站的所有文件，再在文件内建立几个文件夹，将文件分类，如图片文件放在image文件夹内，HTML文件放在文件夹内。文件的命名也是非常重要的，随便乱起些名字，做到一看文件的名字就知道是什么内容的文件。提倡用英文或者拼音给文件命名，不要使用中文的名字因为有的对中文支持不太好，有可能出现链接的错误选择>管理站点。 在弹出的对话框中，接下来需要给站点起一个名字，

这里起名为,按下一步

按下一步按钮，选择是否使用服务器技术。因为实例建立的是一个静态站点，就选择“否，我不想使用服务器技术”。

按下一步按钮，因为要传到网上的虚拟主页空间，就要选择“编辑我的计算机上的本地副本，完成后再传到服务器上”。

按下一步，选择要定义的本地根文件夹这里选择点“选择”按钮，因为没有