Dreamweaver网站设计

目录

第五章网页制作 (2)

5.1. Web简介 (2)

5.1.1. 网站工作机制 (2)

5.1.2. 网站设计流程 (2)

5.1.3. 网站设计原则 (3)

5.1.4. 优秀网站案例解析 (3)

5.2. Dreamweaver初步 (6)

5.2.1. Dreamweaver介绍 (6)

5.2.2. 站点的简介和规划 (9)

5.2.3. 创建本地站点 (9)

5.2.4. 使用站点地图 (11)

5.3. 网页设计初步 (12)

5.3.1. 创建文本网页 (12)

5.3.2. 使用表格规划网页布局 (13)

5.3.3. 使用层规划网页布局 (14)

5.3.4. 制作图文混排网页 (15)

5.3.5. 制作超级链接 (17)

5.4. 网页设计进阶 (18)

5.4.1. 制作多媒体网页 (18)

5.4.2. 制作表单网页 (20)

5.4.3. 使用CSS样式 (21)

5.4.4. 使用模板批量制作网页 (25)

5.5. 网站运营及维护 (26)

5.5.1. 站点测试 (26)

5.5.2. 站点管理 (28)

5.5.3. 站点发布 (29)

第五章 网页制作

本章将介绍使用计算机过程中常用的一系列工具软件。其中包含常用辅助工具、电子邮件客户端软件、多媒体浏览和播放工具、安全软件等。

5.1. W eb 简介

Web 是Internet 提供的一种服务，通过它可以访问遍布于Internet 主机上的链接文档；

是存储在全世界Internet 计算机中的数量巨大的文档的集合；Web 上海量的信息是由彼此关联的文档组成，这些文档称为主页（Home Page ）或页面（Page ），它是一种超文本（Hypertext ）信息，而使其连接在一起的是超链接（Hyperlink ）。

HTML 是什么? HTML 是Hypertext Markup Language （超文本标记语言）的缩写，它是构成Web 页面（Page ）的主要工具。在网上，如果要向全球范围内出版和发布信息，需要有一种能够被广泛理解的语言，即所有的计算机都能够理解的一种用于出版的“母语”。WWW （World Wide Web ）所使用的出版语言就是HTML 语言。

什么是动态HTML ？动态HTML （DHTML ）不仅是一种独特的技术、计算机语言或功能集，而是综合了几种不同技术相互作用的方式。动态HTML （DHTML ）可以让您使用常规DHTML 、脚本文件、文档对象模块、绝对定位技术、动态样式、多媒体过滤器和

各种其他技术动态改变HTML 在屏幕上显示文本和图像的方式。

什么是Flash? 由Macromedia 公司出品的网页制作“三剑客”软件之一。是一个专业的网页动画制作软件。它生成的动画可嵌入声音、电影、图形等各种文件，另还可与ＪＳ等相结合进行编程，进行交互性更强的控制。

5.1.1. 网站工作机制

图 5- 1 网站工作机制

5.1.2. 网站设计流程

网站的整体策划是一个系统工程，是在建设网站之前进行的必要工作。网站建设总体

互联网

返回结果

http www 服务器

网页文件图像等

空浏览器

流程一般分为市场调查、市场分析、制定网站技术方案、规划网站内容、前台界面设计、后台程序开发、网站测试、网站发布、网站推广、网站维护等流程。

1、市场调查

2、市场分析

3、制定网站技术方案

4、规划网站内容

5、前台界面设计

6、后台程序开发

7、网站测试

8、网站发布

9、网站推广

10、网站维护

5.1.3.网站设计原则

1、网站设计原则

在网站设计阶段应注意尽心筹划、尽量精简、尽量简朴、善用图片、易于漫游、重点突出、循环利用现有信息、保持新鲜感、贯彻诺言、吸引用户。

2、网站的组织结构设计原则

在网站组织结构设计时，应考虑网站组织结构良好，对文件、目录等的组织和命名预先规划好。目录结构保证相近内容放在一起；文件、目录命名规范，且不含特殊字符；URL 链接方式统一。

3、网页布局原则

在网页布局设置时，应注重醒目性、创造性、造型性、明快性、可读性，总结为统一、协调、流动、强调、均衡。

5.1.4.优秀网站案例解析

1、Google中国网站首页

特点：谷歌公司的标准主页，醒目的标志、创造性的精简界面、主题功能突出。

页面结构：

导航栏

搜索框

导航栏

图5- 2 谷歌首页简洁版

2、iGoogle中国网站首页

特点：谷歌公司的另一种首页界面模式，在突出搜索功能的前提下，注重信息显示的

导航栏

搜索框

自定义信息

3、易中天新浪博客

文化氛围Banner

信息博客内容

个人

信息

4、淘宝网

特点：目标是尽量多的展示商品，所以

Banner 导航

栏目导航栏、搜索

广告

内容内容内容内容

内容内容

公司信息图5- 3谷歌首页综合信息版图5- 4易中天新浪博客

图5- 5淘宝网首页

5、苹果公司首页

特点：追求质量、追求细节。简洁的界

导航栏

主打产品介绍

产品产品

6、魔兽世界首页

广告浮动游戏Banner 广

告

浮

动

开通账号

首页链接

游戏内容

图5- 6苹果公司首页

图5- 7魔兽世界首页