《网页设计与制作》电子教案课程课件PPT 第一章.ppt

第1章 网页设计与制作基础 本章学习目标 网页设计与制作基础 Dreamweaver MX窗口介绍 网页制作的一般流程 1.1网页设计与制作基础 1.1.1概述 (1) 网页也称为Web页或网页文件。它由超文本标记语言（HTML）的文件格式来构造。网页中包含了文本、图像、动画、声音以及其他信息。网页文件通常放在连接互联网的服务器上，采用超级连接的方式将他们组织在一起。 1.1.1概述 (2) 网页也称为Web页或网页文件。它由超文本标记语言（HTML）的文件格式来构造。网页中包含了文本、图像、动画、声音以及其他信息。网页文件通常放在连接互联网的服务器上，采用超级连接的方式将他们组织在一起。 1.1.2网页制作软件 网页通常包含这样一些对象:文本、图像、表格、框架、表单、组件、链接、文件、超链接、多媒体、各种插件等。由于网络的迅速发展，网页的需求量很大，网页的复杂性也越来越高，因此，软件生产商开发了许多专门用于网页制作的工具软件。这些软件多采用直观易用的图形界面，无需编辑程序代码，就可以轻松的制作出美观漂亮的网页。这类软件通常也称为所见即所得的网页编辑制作软件。 本书介绍的软件是Macromedia公司的Dreamweaver MX网页设计制作软件。在Dreamweaver MX启动时会弹出如下窗口为了方便读者与老版本衔接学习本书采用Dreamweaver 4.0的经典样式。 1.2.3 Dreamweaver MX窗口介绍 Dreamweaver MX经过安装并输入正确的序列号之后，用户就可以在Windows的启动菜单中找到Dreamweaver MX的启动命令，点击该命令即可启动Dreamweaver MX。启动后的窗口界面如图1-1所示。 1.2网页制作的一般流程 网页上的内容通常较为丰富，有文字、图片、线条、表格、链接等。因此，网页制作时需要作前期准备工作。 1.2.1站点的内容规划(1) 在着手建立站点之前，需要做一些前期准备工作，通常称为规划站点。它包括站点的定位，考虑该站点的主要浏览对象的特点，如性别、年龄、职业等；站点提供的主要内容，如电脑、文学、科普等；在确定了浏览对象和网站的定位以后，还要搜集资料，凡是制作网页可能用到的文档、图片、声音、动画等，均应分门别类存储在磁盘上备用。 1.2.1站点的内容规划(2) 制作网页时还要注意一些问题： 第一，合理安排主页内容，主页应该简洁清晰、一目了然，重点突出，图文有序。 第二，网页上要善用图片，色彩协调，格调一致，但又要注意图片不可过大，以免影响浏览时的下载速度。 第三，要易于导航，尽量减少链接级数，尽快通过链接接触到实际内容，否则会使浏览者失去兴趣。 第四，即要美观实用，又要有新颖的创意，网页上要有一些与众不同的闪光点。 1.2.2站点的定义 (1) 如果有了站点文件夹，必须先经过定义，将这个站点纳入到Dreamweaver的管理范围内。在Dreamweaver中可以定义多个站点，但只有一个站点是当前站点。 1.2.2站点的定义 (2) 1．定义站点 定义站点的具体操作步骤如下： （1）打开“站点”菜单，选择“定义站点”命令，出现“定义网站”对话框。如图1-4所示。 （2）在“定义网站”对话框中，单击“新建”按钮，出现“站点定义”对话框。如图1-5所示。 图1-5“站点定义”对话框 （3）在“站点定义”对话框中输入站点名称和站点所在的路径，单击“确定”后返回“定义网站”对话框。 1.2.2站点的定义 (3) （4）单击“定义网站”对话框中的“完成”按钮站点就定义好了，并且会自动打开站点文件窗口。“定义网站”的命令菜单如图1-6所示。定义好的站点如图1-7所示。 1.2.2站点的定义 (4) 2．选择当前站点 如果定义了多个站点，而要选择一个当前站点，具体的操作方法为： （1）打开“站点”菜单，选择“定义站点”命令，出现“定义网站”对话框。 （2）在对话框中选择需要打开的网站，单击“完成”按钮，则该网站就成为当前站点。 1.2.3在站点中定义网页或文件夹 建立站点并定义为当前站点之后，就可以在站点中添加文件夹或网页了。 1.2.2站点的定义 (5) 1．在站点中添加网页 添加网页的具体操作方法如下： （1）打开“站点”菜单，选择“打开站点”命令，选择“网络安全”，即可出现图1-7的“站点文件视图”。 （2）选中宿主文件夹（欲在其中建立网页的目标文件夹，如“站点－留言板”），打开“文件”菜单，选择“新建文件夹”命令即可，如图1-8所示。 1.2.2站点的定义 (6) 添加文件夹的方法与此类似，只要选择“新建文件”命令即可。 注意：在Dreamweave