网页制作

  • 格式:doc
  • 大小:83.50 KB
  • 文档页数:11

1 网页制作

一、 基本概念

1. WWW

WWW是环球信息网(World Wide Web)的缩写,又称万维网。WWW是一个以超文本方式将Internet上的数据连接在一起,让用户能以简单的操作查看、存取到世界各地信息的网络形式。

2. 网页

 网页是因特网上的基本文档,是用HTML编写的。

 网页是多媒体信息的集合,并带有若干个超链接。

 网页是组成网站的最小单元。

3. 网站 ( 站点 )

 网站是一群相关网页的集合。当您设计制作了几个网页,并且通过组织设计,让网页彼此相链接,这样完整的结构就称之为网站。

 WWW服务器可存放一个或多个网站。

 WWW是由分布在Internet上的实体WWW服务器所组成。

 WWW服务器可以是独占一台主机,也可以与E-mail服务器和FPT服务器等设置在同一台主机上。

4. 主页

 每个网站的起始页叫做主页,它是客户访问这个网站的第一页。

 一般WWW服务器要求上传的起始页文件名为index.htm。

5. 制作网页的步骤

 设计网站(主题明了、风格独特、色彩协调、结构合理、内容新颖)。

 搜集制作素材(图像、动画、影视、声音)。

 编制网页(设计网站的结构、布局、导航,编写网页,整合多媒体资料)。

 发布网页(网页的调试和发布)。

 维护网站(内容更新,结构调整,错误修复)。

6. 制作网页的方法

 超文本标记语言(HTML)

 FrontPage Express

 FrontPage 97、FrontPage 98、FrontPage 2000

 Dreamweaver

7.网站的建立和管理

 大企业网站的建立和管理

 申请域名 2  制作企业网站

 信息的发布和管理

 中小企业网站的建立和管理

 租用ISP的WWW服务器空间,并请ISP负责系统维护。

 服务器托管。

 专线接入。

 个人网站的建立和管理

 租用ISP服务器空间。

 申请免费主页空间。

 利用本单位提供的WWW服务器空间。

二、 HTML简介

HTML的全称是Hyper Text Markup Language,中文常称为超文本标记语言。它的最大特点是提供了强大方便的超链接(Hyper Link),使得浏览者可以方便地从一个文档准确快速地跳到另一个文档,这种关系称为链接,极大地方便了文档的查找、检索等。

我们在因特网上浏览的网页一般都包含了HTML标记符,这些标记符是一些嵌入式命令,提供网页的结构、外观和内容等信息。Web浏览器利用这些信息来决定如何显示网页。

举一个简单的例子:

中国四大网络

中国四大网络主页

3 三、 FrontPage 2000简介

FrontPage2000是Office2000中的一个新成员,是专门用于制作网页的应用程序。它除了制作网页,还可以建立和管理站点。

1. FrontPage的功能

 所见即所得的编辑环境

FrontPage作为网页编辑器,实现了“所见即所得”的工作方式,因此设计者可以完全不需要懂HTML语言,就能制作出具有专业效果的Web页面。

 简易的操作环境

在编辑过程中,只要使用工具栏、菜单和功能表等就能完成所有需要的操作。

 HTML的编辑功能

您还可以切换到HTML视图下,编辑HTML代码,写好代码后可以直接切换到预览视图窗口中查看效果。

2. 启动FrontPage

 在快速启动区按图标

3. FrontPage的窗口元素

1 标题栏

2 菜单栏

3 常用工具栏

4 格式工具栏

5 视图栏:可供视图模式的选择,初始启动FrontPage时,视图栏按默认定义出现在工作区的左侧,通过单击视图栏中的图标可快速切换视图模式。将鼠标指向视图栏区域并按右键,可选择图标的显示方式。

6 网页视图:对当前网页的编辑修改等

7 文件夹视图:组织网站中的文件选项与结构

8 报表视图:显示网站目前的进展与状况

9 导航视图:管理网站结构

10 超链接视图:可查看所有的链接情况

11 任务视图:安排网站中的各项任务

12 视图窗口标题栏

13 工作区

14 插入点

15 视图窗口关闭按钮

16 普通视图标签:所见即所得的网页编辑区 4 17 HTML视图标签:HTML语法文字编辑器

18 预览视图标签:预览最新编辑结果

19 水平滚动条

20 下载时间:网页下载时间

21 数字键状态:显示键盘右部数字键是否工作

4. FrontPage工具栏

常用工具栏:新建网页、打开、保存、发布站点、文件夹列表、打印、在浏览器中预览、拼写检查、剪切、复制、粘贴、格式刷、撤消、恢复、插入组件、插入表格、插入图片、超链接、刷新、停止、全部显示、帮助

格式工具栏:样式、字体、字号、粗体、斜体、下划线、左对齐、居中、右对齐、编号、项目符号、减少缩进、增加缩进、突出显示颜色、字体颜色、关闭网页编辑窗口

四、 创建站点

FrontPage通过一个站点来组织您所创建的所有网页文件,而且您所作的任意修改,系统将自动更新所有与此相关的内容。

1. 创建新站点

 [文件] → [新建] → [站点]

 或[常用工具栏] → [新建] → [站点]

2. 选择有关站点类型

 在站点列表中,选择要用来创建新站点的模板或向导。目前默认的选择是只有一个网页的站点。

 在指定新站点的位置框中,键入或选择新站点的名称。初始默认项有站点所存放的服务器和在本机中的C:\My Documents\My Webs,当然,用户还可以自定义一个文件夹。

五、 新建网页

在已新建的站点上有了一个新网页(index.htm),但目前这一网页是空白的,可在上面进行网页设计和制作。您也可以在网页视图的文件夹列表框中查看该站点下的所有文件和文件夹(其中_private和images两个文件夹是系统创建初始就已建立了的)。如果没有,您可以通过选择查看菜单中的文件夹列表而使其显示。

1. 新建网页

 [文件] → [新建] → [网页]

 或[常用工具栏] → [新建] → [网页]

2. 打开网页

 [文件] → [新建] → [网页]

 或[常用工具栏] → [新建] → [网页]

3. 保存网页 5  [文件] → [保存文件] 或 [另存为]

4. 网页名

注:新建网页默认的文件名是new_page_1.htm等,它不便于记忆,建议起一个带有提示的文件名。站点中的网页文件名可随时进行修改。

六、 网页中的文本输入

1. 自动换行、换行与段落

2. 添加项目编号

3. 添加项目符号

4. 添加图片项目符号

5. 设置多级列表

6. 文字的版面设计 (字体、字号、字型、颜色)

7. 文字的动态HTML效果

七、 网页属性的设置

对于任何一个网页都有其特有的网页属性,包括标题、颜色等内容。初始时网页按系统默认值设置,但您可通过网页属性重新设置有您自己特色的属性。

1. 打开属性设置窗口

2. 设置网页标题

3. 设置网页背景

4. 更改背景颜色

5. 选择更多的颜色

6. 择背景图片(剪贴画、图片文件等)

注:背景图片与背景色不能同时并存,若选择背景色,必须将背景图片的选择撤消。

八、 网页中的图片处理

1. 图片的格式

 图片文件格式:GIF(标准和动态)、JPEG(标准和渐进式)、BMP(Windows 6 和 OS/2)、TIFF、TGA、RAS、EPS、PCX、PNG、PCD (Kodak Photo CD)

和 WMF等。

 Web 页通常所用的格式为 GIF、JPEG 和 PNG 格式。

 目前网页设计中最常用的图片格式是GIF和JPEG格式。

2. 插入图片

 从当前站点插入图片

 从其他文件夹中选择图片

 保存图片

 插入剪贴画

3. 图片属性的设置

当我们在网页中加入了图片以后,还可对其某些性质进行设置。例如:为网页中的图片设置一些文字替代物,使得浏览该网页时,即使不显示图片,也能通过文字了解其大概,或者通过设置低分辨率使得浏览过程中当图片未完全下载时,页面可以显示一些低分辨率的图片。另外,还可以设置图片的间距、对齐形式和边框粗细等选项。

 替代表示

 图片的对齐方式

 图片的间距设置

 图片预览

九、 表格处理

1. 插入表格

2. 单元格中输入内容

3. 将文本转换为表格

4. 添加行或列

5. 调整行高和列宽

6. 设置颜色和背景

7. 单元格属性

8. 表格属性与单元格属性

两个对话框中关于颜色的设置操作是一样的。主要区别在于前者为整个表格(包括边框)设置颜色,后者只为选中的单元格设置颜色。而且若对一些单元格在表格属性和单元格属性中设置了不同的颜色后,单元格的实际显示颜色将按照单元格属性中的设置完成。

9. 在页面上对齐表格