当前位置:
文档之家› 制作具体网页网页制作步骤(精)
制作具体网页网页制作步骤(精)
计算机文化基础
建立超链接
超链接的实现方法:将某个文本串或某幅图像和其他
网页的地址(URL)联系在一起。 <A HREF SRC=“网页地址/网页文件名.html”>
单击此处</A>可获得某某信息。 创建超链接: 其他Web服务器上的网页文件 本地机器中网页文件 同一个网页文件中(书签)
任务视图
站点任务的管理,当多人同时编写一个站点时,可通过 任务视图为各个成员分配任务,协调成员之间的工作。
计算机文化基础
基本网页编辑
新建、打开、保存网页
即可以在站点中创建新网页,也可以创建独立的网页。 Microsoft FrontPage 内置的各类模板可以帮助我们创建 不同类型的网页。
计算机文化基础
导航视图
记录站点结构
计算机文化基础
超链接视图
提供基于超链 接的结构分析, 以任意网页为 中心,形象地 说明通过超链 接相连的其他 网页。从微观 的角度展示站 点的结构。
计算机文化基础
2)指定已经存在的网页
保存框架页 “文件” /“另存为”
计算机文化基础
框架属性设置
框架/框架属性
•网页名称 •初始网页 •框架大小 •边距 •滚动条 •框架的可调整性 •间距 相对大小:1和4
20%
30%
70% 80% 相对大小:3和7
计算机文化基础
……
计算机文化基础
认识FrontPage
FrontPage是一种“所见即所得”的网站管理和 网页制作的工具。FrontPage2000属于 Office2000家族的成员, 其主要功能有:
新建和修改一个网页 新建一个站点 在网页中插入一些动态元素
设置动态效果 设置网页过渡效果
实现主题 修改主题
计算机文化基础
共享边框
共享边框是站点上一个或多个网页共享的区域。 共享边框可以出现在一个网页的顶端(类似于网页页眉)、底端(类 似于网页页脚)、左边或右边的区域。 “格式” /“共享边框”
计算机文化基础
框架布局
框架是一种将浏览器窗口划分为功能独立的多个区域的常用方法。框架集 定义每个框架的大小、位置、名称和初始网页,普通网页提供每个框架的 内容。一个框架的超链接可以更改显示在另一个框架中的网页。 框架集是一种特殊的网页,该网页定义了整体的框架布局,但不提供 实际内容。 框架集
计算机文化基础
文件夹视图
类似Windows资源 管理器,显示站点的 所有文件和文件夹, 在此视图方式下可 进行文件和文件夹
的新建、复制、删
除、剪切、重命名、 修改属性等操作。
计算机文化基础
报表视图
提供14种报 表,帮助我 们了解站点 的情况。
添加文本和插入素材文件
网页视图中进行文本的录入和word类似,也可以在网页 中插入任何一种基于文本的文件,包括 .htm 文 件、.asp 文件、.rtf 文件和 .txt 文件,以及任何 Microsoft Office 文档。
计算机文化基础
基本网页编辑
可以直接导入Office其他工具的文件
提供网站管理信息和统计资料
FrontPage
计算机文化基础
FrontPage 2000的操作环境
FrontPage 2000提供了六种视图方式
来实现网页的编辑和网站的创建、管理
视 图 两大功能,其中只有网页视图是用来编 辑网页的,其他五种视图都是用来创建
框架名称 初始网页
rtop
rbottom Left
com-t.html
com-m.html com-1.htm
计算机文化基础
框架的创建和保存
框架组成 边框、滚动条、网页 新建框架网页 “文件” /“新建” /“网 页” ,选择“框架网页” 标签 在框架中加入网页 1)建立新网页
计算机文化基础
图像映射
图像映射是另一种形式的超链接,允许将不同的URL指定给一幅图 像的不同部分,使访问者根据不同的图像区域跳转到不同的位置, 这些区域称做“热点”,每一个热点与一个超链接相对应。 如下图汽车生产商的站点可以用新车的图像映射:当站点访问者单 击“车子”时,就会显示详细说明车子的网页。
网页与网站
网页通常成组出现,并且这组网页 之间通过超链接相互组织成为反映 某个主题的网站。 ……
Web服务器
提高下载速度 超文本地址引用方便 Web页没有固定的长度
计算机文化基础
网站制作步骤
选择主题 规划网页(结构与链接关系) 组织素材 选择视觉外观 设计有效的页面布局 制作具体网页 发布网站信息 计算机文化基础
主题是一组可应用在网页上的设计元素和颜色方案,其中包括字 体、图形、背景、导航栏、水平线和其他网页元素。 主题赋予网页一致和引人注目的外观。使用主题是快速、容易地 加入精采的网页内容和赋予网页专业外观的方法。FrontPage 包 含很多可以立即使用的主题,也可以修改这些主题以满足个体的 需求。
“格式” /“主 题” 加入主题
R
G
B
计算机文化基础
图形的插入
HTML并不能包含图像,它只是包含图像文件的名称
和相应的格式代码。 <IMG SRC=“图像文件存放位置/图像文件名.扩展名”>
图形的插入 直接拖拽来改变图片的大小
使用图片属性对话框来设置
图片的替代文字、图片边框 使用图片工具栏编辑图片
基本网页编辑
使用项目符号和编号
项目符号和编号是组织数据的工具,它可以使数据层次 分明、重点突出。
使用背景色和背景音乐
用浏览器预览网页
计算机文化基础
认识图形格式
GIF JPEG PNG (图形交换格式)(联合图像专家组)(可移植网络图形) 可用颜色数 16777216 16777216 16777216 有损 否 否 否 16777216 16777216 无损 Alpha通道 Alpha通道 否 每幅图像的颜色 256 压缩 无损 透明 半透明 动画 单色 否 是
计算机文化基础
tp://
网页的布局
表格和框架是网页布局的常用工具。 表格在网页制作中的作用已经超越了传统意义上的存放数 据,表格已成为组织数据、排列网页元素空间位置最为灵 活的方法。 框架也是一种常用的网页布局方法,它将浏览器窗口划分 为功能独立的多个区域,每个框架显示一个网页内容,并 且通过框架中的超链接可以更改显示在另一个框架中的网 页文件。
第九章
网 页 制 作
计算机文化基础
宁夏大学计算中心
内容提要
网页与网站 网页和网站制作的基本步骤 网站创建的基本方法 认识FrontPage 管理和组织网页 网页编辑 基本网页编辑
图形的插入和图形格式 创建超链接(超链接、书签、热点) 网页的布局(表格和框架) 创建和使用表单 使用网页层次组件
框架之间的超链接
在框架网页中,单击某框架内网页上的超链接时,被超链接所 指定的网页通常在另一个框架中打开,这个框架称为目标框架。
插入/超链接
计算机文化基础
给予网页一致性外观
主题 共享边框 导航栏
计算机文化基础
主 题
网页与主页
浏览器与Web服务器之间 是以页为单位来传送信息。
网页 ( Web Page )
/jlhz.htm
主页 ( Home Page )
计算机文化基础
设置文本格式
在 FrontPage 中,可以像使用word的方式来设置
文本格式,如更改字体、大小、样式、颜色、段落
间距和文本的垂直位置,以及添加诸如下划线的效 果。
插入特殊网页元素
FrontPage的插入菜单可以插入四种类型的特殊 元素:换行符、水平线、符号和注释。
计算机文化基础
可利用任何一种文字处理软件编辑Web文档(推荐:记事本) Web文档以纯文本格式存放,取名为*.html或*.htm。 其中插 入的HTML语言只有用浏览器才能被解释翻译
在浏览器中使用文件菜单打开命令,可在本地机浏览 Web文 档,完成编辑后,可利用FTP将文件及其所用到的媒体素材文
件传送到某台公共Web服务器 人人均可在浏览器中URL处,键入具体命令,实现异地浏览该 Web文档 一旦对该Web文档内容进行更新,须更新它所在Web服务器上 的相关文档
和管理站点的,其所做的相关设置,是
针对整个站点的。选择不同的视图方式, 右边的编辑区中会显示不同的内容。
计算机文化基础
网页视图
网页编辑的视图,负责网站内个别网页的编辑, 它提供了三种显示方式:
普通视图: “所见即所得”的编辑环境 HTML视图: 编辑和查看HTML源代码 的环境 预览视图: IE浏览器的预览环境。
计算机文化基础
表格的创建
菜单命令“表格”/“手绘表格” 先绘制出表格的轮廓,然后绘制表格的单 元格, 由此可以创建一个不规则的表格。 菜单命令“表格”/“插入”/“表格” 用指定表格属性的方式创建表格, 这些属性包括表格的行数和列数、 表格宽度、对齐方式、边框粗细, 以及单元格边距和间距。 使用“插入表格”按钮
网站基本结构
网站是由网页组成的,网页之间是由超链接来连接的, 其连接方式有三种:线性网站、树状网站、非线性网站 线性网站:一页连 接一页 树状网站:分层排 列 非线性网站: 上述两种网站 的结合
计算机文化基础
网页制作步骤
超文本标记语言HTML
HyperText Markup Language
<HTML> <HEAD> <TITLE>欢迎光临无名的主页</TITLE> </HEAD> <BODY>