第9章_网页制作.pptVIP

第九章 网页制作基础 概述 网页制作工具 配置WEB服务器 HTML 制作基础 级联样式表（CSS）技术 使用多媒体 网页布局技术 9.1 概述 9.1.1 基本概念 一、Web Web是以HTML语言和HTTP协议为基础、提供面向Internet服务、具有一致用户界面的全球信息网络，具有交互性、动态性和多平台等特性。 Web访问流程： 9.1 概述 二、HTTP协议 超文本传输协议（Hyper Text Transfer Protocol，简称HTTP）是Web浏览器和Web服务器用来交换信息的一种Internet协议，该协议允许用户使用一个客户端程序（如Web浏览器）通过URL在Web服务器上检索文本、图形、声音等信息。 三、超文本 超文本（Hypertext）也是普通的文本，但是可以通过标记控制文本的显示格式，也可以嵌入链接、图形和其他多媒体信息，因此超文本也常称为超媒体（Hypermedia）。 9.1 概述 四、超链接 超链接（(Hyperlink）是指从一个网页指向另一个目的端的链接。 五、HTML语言 HTML是Hyper Text Markup Language的简称，用来描述Web页面。HTML通过在正文文本中嵌入各种标记，使普通正文文本具有超文本的功能。 HTML文件的扩展名：“.htm”或“.html” 生成方式： 手工直接编写 自动转换 由Web服务器上的程序动态生成 9.1 概述 六、DHTML语言 动态HTML（简称DHTML）是一种即使在网页下载到浏览器以后仍然能够随时变换的HTML。 DHTML有3个主要特征，即动态样式、动态内容和动态定位。动态样式是指改变网页的外部显示特征，动态内容是指更换显示在页面上的文本或图像，而动态定位是指移动页面上的文本和图像 DHTML技术：脚本语言（如JavaScript）、文档对象模型（简称DOM）和级联样式表（简称CSS）等。 9.1 概述 9.1.2 网页制作步骤 （1）收集、整理资料 （2）规划、创建站点 （3）制作网页(构建页面框架、导航条、返回首页链接） （4）站点测试 （5）站点的更新与维护 9.1 概述 9.1.3 网页制作原则 （1）整体规划 （2）站名有创意 （3）主题鲜明 （4）网页通用 （5）导航要明朗 （6）动画不宜过多 （7）图像优化 （8）定期更新 9.2 网页制作工具 Microsoft公司的FrontPage Macromedia公司的网页制作“三剑客”：Dreamweaver、Flash和Fireworks 它们都提供了一个可用于创建、设计和编辑Web站点及其相应页面的“所见即所得”的制作环境。 9.2 网页制作工具 9.2.1 网页制作方式 HTML方式：使用纯文本编辑器（如“记事本”）直接编写页面的HTML代码。 可视化方式：使用可视化制作工具和环境（如FrontPage、Dreamweaver），以“所见即所得”的直观方式设计页面内容，制作工具将自动生成相应的HTML代码。 两种方式各有优劣、相辅相成：先用可视化方式设计页面布局和内容，然后用HTML方式检查、修改自动生成的HTML代码。 9.2 网页制作工具 9.2.2 FrontPage 制作初步 FrontPage 2002 工作界面 9.2 网页制作工具 网页创建示例 例9.1 制作一个如图9.4所示的带滚动字幕“欢迎进入网页世界!”的简单页面。 9.2 网页制作工具 创建站点 创建站点就是创建一个文件夹，然后将有关文件放入这个文件夹中。 例9.2 使用FrontPage的“个人站点”模板创建一个“个人主页”网站。 9.2 网页制作工具 打开网页 FrontPage 可打开当前站点中的网页或本地文件系统中任意位置的网页文件，甚至打开 Web 上的远程网页 例9.3 使用FrontPage打开微软公司的主页 9.2 网页制作工具 9.2.3 Dreamweaver 制作初步 采用 Mac 机浮动面板的设计风格 Dreamweaver 8.0工作界面 9.2 网页制作工具 网页创建示例 例9.4 制作一个含有翻转图片（即，当鼠标移到一张图片时，原来的图片切换为另一张图片，鼠标移开后，又恢复为原图片）的页面。 使用“属性”面板格式化文字 选择菜单“插入”→“图像对象”→“鼠标经过图像”命令，设计一个“鼠标经过图像” 9.3 配置Web服务器 9.3.1 安装IIS 5.1 IIS是Windows平台的Web服务器，支持Web服务、FTP服务、SMTP服务等功能。 安装步骤：“控制面板”→“添加或删除程序”→“添加/删除Windows组件”→选中“Internet信息服务(IIS)”选项 验证：打开IE，输入 localhost 9.3 配置Web服务器