网页设计基础教程PPT(16张)
合集下载
《网页设计基础》PPT课件
1.4 建立网站的基本流程
图1-2所示的是一个网站的完整制作流程.
确定主题策划与准备来自收集资料与素材规划网站结构
图
-
1
设计网页版式
2
确定网站结构
网
站
制作阶段
制作网页元素
的
制
插入元件与排版
作 流
上传网站
程
后期工作
维护与更新
1.4.1 确定主题
网站的主题也就是网站的题材, 是网站设计首先遇到的问题.
〔2〕利用Fireworks修改图像非常方便.
〔3〕Fireworks无需借助其他工具就可 以完成将一个图像转化为网页元素的全过程.
〔4〕Fireworks具有文件导出功能.
1.3.2 Flash
Flash是Macromedia公司开发 的用于矢量图形编辑和动画创作的 专业软件,它是一种交互式动画设 计工具,用它可以将音乐、声效、 动画以及富有新意的界面融合在一 起,以制作出高品质的网页动态效 果.
网站的定位要小,内容要精.
网站的题材最好选自己擅长或 者喜爱的内容.
网站名称,是网站设计的一部 分,而且是一个关键的要素,和现实 生活中一样,网站名称是否正气、
1.4.2 搜集资料 1.4.3 网站的整体规划
进行网站的整体规划也就是组 织网站的内容并设计其结构. 1.4.4 网页设计与制作
1．静态网页的设计与制 作
Dreamweaver是 Macromedia公司推出的一款大 众化的网页制作软件,它具有可 视化编辑界面,用户不必编写复 杂的HTML源代码就可以生成跨 平台、跨浏览器的网页,不仅适 合于专业网页编辑人员的需要, 同时也容易被业余网页制作人员 所掌握.
1.2.3 FrontPage
第1章网页设计制作基础精品PPT课件
服务器端
• 浏览者进入网站后首先看到的是这个网站的主页， 主页集成了指向二级网页及其他网站的链接。
• 主页一般命名为index或default。
二级网页
进站页 主页
1.1.2什么是HTML
• HTML是英文Hypertext Markup Language的缩写， 一般译为“超文本标记语言”。
• 用HTML编写的文件的扩展名是.htm或.html。
• 一般来说网站中导航栏的位置在各个页面中出现 的位置是比较固定的，而且风格也比较一致。
1.2.6 文字和图片
• 每行文字最好在20～30个中文（40～60个英文）之间。 • 一个版面上字型最好不超过3种。 • 文字的颜色要和背景有明显区别。 • 图片的主题要清晰可见。 • 图片所含文字要清晰可的原则，如无特别需要，不要放 置大型图像文件活加上其他的程序。
• 页面内容放置的要有条理。
分类
• 可以按主题分类、按性质分类、按机关组织分类，按 人类思考直觉式分类等。
• 分类原则是让访问者可以很容易的找到目标。
互动性
图像的应用技巧
• 使用图像式一定要考虑传输时间的问题。 • 图像格式要采用一般浏览器都支持的格式，最常用的
网页制作
1. 网页设计制作基础
1.1 网页的基本概述
• 互联网 • 网页 • HTML
1.1.1什么是互联网
• Internert即国际互联网，也称为全球信息资源 网。
• Internet是由Interconnection和Network两个词组 合而成的，通常翻译为“因特网”或者“国际 互联网”。
抓住用户
• 网站操作必须便捷。 • 网站有内容，有特色。
着手规划、确定特色、锁定目标
• 浏览者进入网站后首先看到的是这个网站的主页， 主页集成了指向二级网页及其他网站的链接。
• 主页一般命名为index或default。
二级网页
进站页 主页
1.1.2什么是HTML
• HTML是英文Hypertext Markup Language的缩写， 一般译为“超文本标记语言”。
• 用HTML编写的文件的扩展名是.htm或.html。
• 一般来说网站中导航栏的位置在各个页面中出现 的位置是比较固定的，而且风格也比较一致。
1.2.6 文字和图片
• 每行文字最好在20～30个中文（40～60个英文）之间。 • 一个版面上字型最好不超过3种。 • 文字的颜色要和背景有明显区别。 • 图片的主题要清晰可见。 • 图片所含文字要清晰可的原则，如无特别需要，不要放 置大型图像文件活加上其他的程序。
• 页面内容放置的要有条理。
分类
• 可以按主题分类、按性质分类、按机关组织分类，按 人类思考直觉式分类等。
• 分类原则是让访问者可以很容易的找到目标。
互动性
图像的应用技巧
• 使用图像式一定要考虑传输时间的问题。 • 图像格式要采用一般浏览器都支持的格式，最常用的
网页制作
1. 网页设计制作基础
1.1 网页的基本概述
• 互联网 • 网页 • HTML
1.1.1什么是互联网
• Internert即国际互联网，也称为全球信息资源 网。
• Internet是由Interconnection和Network两个词组 合而成的，通常翻译为“因特网”或者“国际 互联网”。
抓住用户
• 网站操作必须便捷。 • 网站有内容，有特色。
着手规划、确定特色、锁定目标
网页设计制作基础ppt课件
一、网页设计制作基础
超文本标记语言HTML ——几个重要标记 2. 文档主体标记 <body>...</body>
文档主体中包含了所有要在浏览器中显示 的文字、表格、图片等内容元素，网页中大部 分标记都嵌套在<body>...</body>内。
<body>标记的属性可对网页的整体显示效 果进行控制。
一、网页设计制作基础
网页关键性技术标准
✓统一资源定位器〔URL） ✓超文本标记语言〔HTML） ✓超文本传送协议〔）
一、网页设计制作基础
网页关键性技术标准
✓统一资源定位器〔URL） • URL：Universal Resource Locator，用于完 整地描述Internet上网页及其它资源地址的 一种标识方法，俗称为“网址”。 • URL的基本结构：
4节（11:10-12:00）
上课
上课
上课 上课 上课 上机 上机 上机
上课
上课
上课 上课 上机 上机
5节（14:00-14:50）
6节（15:00-15:50）
下午
上机 上机
7节（16:10-17:00）
上机 上机
8节（17:10-18:00）
网页设计与制作
图形图像处理
Office办公软件
网页设计与制作
一、网页设计制作基础
静态网页 vs 动态网页
文章1 文章2 文章3
静态网站 服务器
我要看文章12
表〔Table） 编号 作者 内容 …
1 xxx xxx … 2 xxx xxx … …………
读文章
动态网站 服务器
数据库
编号1的 文章
网页设计学习PPT
动画效果
通过添加动画效果，使网页更加生动有趣，吸 引用户的注意力。
用户反馈
及时响应用户的操作和反馈，提供直观的提示和引导，增强用户的使用体验。
数据可视化
可视化图表
使用图表、图形和数据可视化工 具，将复杂的数据以直观的方式 呈现给用户。
大数据呈现
通过数据可视化技术，展示大量 数据和信息，帮助用户更好地理 解和分析数据。
网页设计原则
内容优先
网页设计应以内容为核心，确保信息架构清晰、内容易于理解和访问。
一致性
保持设计的一致性有助于用户理解和使用网站，同时还能提高网站的 品质和品牌形象。
可访问性
设计师应确保网站对所有人都是可访问的，特别是对于残障人士和老 年人，需要考虑不同的访问需求。
响应式设计
随着移动设备的普及，响应式设计成为必须考虑的原则，确保网站在 不同设备上都能良好地展示和交互。
随着移动设备的普及，网页设计 需要实现响应式布局，以适应不 同屏幕尺寸和分辨率的设备。
02
03
适配多种浏览器
自适应设计
不同的浏览器对网页的支持程度 不同，设计师需要确保网页在不 同浏览器中呈现一致的效果。
根据设备特性，自动调整网页布 局和样式，提供最佳的用户体验。
动态交互
交互式元素
使用动态效果和交互式元素，如按钮、表单和 弹窗，提高用户参与度和互动性。
合理使用关键词，提高网站在 搜索引擎中的排名。
元标签优化
设置合适的标题、描述和关键 词元标签，提高网站在搜索结
果中的可见性。
内部链接结构
合理规划内部链接结构，提高 网站的可爬取性和内容相关性
。
外部链接建设
与其他高质量网站建立外部链 接，提高网站的权威性和信誉
第01章-网页设计基础知识ppt课件(全)
:::::《计算机基础与实训教材系列》系列丛书官方网站
edu :::::
1.4.4 网页框架语言HTML
HTML(Hyper Text Markup Language)即超文本标记语言，是WWW上 通用的描述语言。HTML语言主要是为了把存放在一台计算机中的文本或图 形与另一台计算机中的文本或图形方便地联系在一起，形成有机的整体。
《 网页设计与制作基础教程(第3版)》
第一章
网页设计基础知识
学习目标
随着因特网（Internet）的不断发展，越来越多的人都想要 学习设计与制作网页，但是要实现较好的网页效果，设计者首 先要了解网页的相关基础知识，例如网页与网站的关系，网页 设计的构思与布局方式，常用的网页制作工具，以及与网页相 关的概念等。
简单地说，WWW是漫游Internet的工具，它把Internet上不同地点的相 关信息聚集起来，通过WWW浏览器(如IE，即Internet Explorer)检索，无论 用户所需的信息在什么地方，只要浏览器为用户检索到之后，就可以将这些 信息(文字、图片、动画、声音等)“提取”到用户的计算机屏幕上
edu :::::
1.1.2 网页的基本元素
网页是一个纯文本文件，其通过HTML、CSS等脚本语言对页面元素进 行标识，然后由浏览器自动生成页面。组成网页的基本元素通常包括文本、 图像、超链接、Flash动画、表格、交互式表单以及导航栏等。
:::::《计算机基础与实训教材系列》系列丛书官方网站
edu :::::
网页制作软件——Dreamweaver 图像处理软件——Photoshop 动画制作软件——Flash
:::::《计算机基础与实训教材系列》系列丛书官方网站
edu :::::
《网页设计基础》课件
字体运用技巧
讲解如何选择适合的字体， 以及如何运用字体来增强网 页设计的可读性。
用户体验设计
1
用户体验概述
介绍用户体验的重要性和目标，以及如何创造积极的用户体验。
2
用户分析技巧
讲解如何进行用户分析，并如何将这些分析应用于用户体验设计。
3
用户行为模型
探索用户行为模型，如用户目标和使用场景，以指导用户体验的设计和优化。
SEO优化
SEO基础知识
介绍搜索引擎优化的基本知识，包括关键字研究和网站结构优化等方面。
SEO技巧介绍
讲解如何通过内容优化、链接建设和社交媒体等技巧来提高网站的搜索排名。
SEO工具使用
介绍常用的SEO工具，如Google Analytics和Moz等，并讲解其功能和用途。
响应式设计
响应式设计概念
图标设计技巧
图形元素运用
探索图标设计的关键技巧，如 简洁性、可识别性和可扩展性。
讲解如何将图形元素巧妙地应 用于网页设计中，以增强视觉 效果。
字体设计
字体的作用
探讨字体在网页设计中的重 要性，如对读者的影响和品 牌形象的表达。
字体分类介绍
介绍常见的字体分类，如衬 线体、无衬线体和手写体， 并讨论其特点和适用场景。
色彩设计
1 色彩的作用
探讨色彩在网页设计中 的重要性，包括情绪传 达和品牌形象等方面。
2 色彩搭配原则
介绍色彩搭配的基本原 则和技巧，以及如何选 择适合的色彩组合。
3 色彩运用技巧
讲解如何巧妙地运用色 彩，以增强网页设计的 吸引力和可读性。
图形设计
图形设计原则
介绍图形设计的基本原则，包 括对比、重和对齐等方面。
介绍响应式设计的基本原理 和优势，以及如何创建适应 不同设备的网站。
网页制作课件ppt
提高网站流量，吸引更多 潜在客户，提高品牌知名 度和销售额。
SEO基本原则
关键词研究、内容质量、 网站结构、外部链接和内 部链接等。
网站优化技巧
页面加载速度
优化图片、压缩代码、使 用CDN等方式提高页面加 载速度。
移动端优化
确保网站在移动设备上显 示良好，提高用户体验。
响应式设计
使网站能够适应不同设备 和屏幕尺寸，提供一致的 用户体验。
网站推广策略
关键词广告 社交媒体营销
内容营销 合作与交换链接
利用搜索引擎关键词广告推广网站。
通过社交媒体平台发布有价值的内容，吸引目标受众。 创建高质量、有价值的文章、视频等，吸引潜在客户并提高品
牌知名度。 与其他网站合作，互相推广，增加网站流量。
06 网页制作实例教 程
制作个人网站
总结词
展示个人风格和兴趣
字体选择
选择清晰易读的字体，确保文字内容 在各种设备和屏幕分辨率上都能清晰 显示。
03 网页布局与设计
网页布局的基本原则
保持简洁
避免页面过于拥挤，突出核心内容，使用户 能够快速找到所需信息。
导航清晰
提供易于理解的导航菜单，使用户能够方便 地浏览不同页面。
层次分明
合理划分页面区域，使内容按照重要程度进 行排序，提高用户体验。
制作电商网站
总结词
商品展示与销售
详细描述
电商网站是商品展示和销售的重要平台，需要展示丰 富的商品信息和购物体验。在制作电商网站时，需要 考虑如何设计出美观、实用的商品展示页面，以及如 何提供便捷的购物流程和支付方式。
制作电商网站
总结词
用户友好性
详细描述
电商网站应该具有用户友好性，提供良好的 用户体验和购物体验。在制作电商网站时， 需要考虑如何设计出易于操作和使用的界面 和功能，以及如何提供个性化的服务和支持
SEO基本原则
关键词研究、内容质量、 网站结构、外部链接和内 部链接等。
网站优化技巧
页面加载速度
优化图片、压缩代码、使 用CDN等方式提高页面加 载速度。
移动端优化
确保网站在移动设备上显 示良好，提高用户体验。
响应式设计
使网站能够适应不同设备 和屏幕尺寸，提供一致的 用户体验。
网站推广策略
关键词广告 社交媒体营销
内容营销 合作与交换链接
利用搜索引擎关键词广告推广网站。
通过社交媒体平台发布有价值的内容，吸引目标受众。 创建高质量、有价值的文章、视频等，吸引潜在客户并提高品
牌知名度。 与其他网站合作，互相推广，增加网站流量。
06 网页制作实例教 程
制作个人网站
总结词
展示个人风格和兴趣
字体选择
选择清晰易读的字体，确保文字内容 在各种设备和屏幕分辨率上都能清晰 显示。
03 网页布局与设计
网页布局的基本原则
保持简洁
避免页面过于拥挤，突出核心内容，使用户 能够快速找到所需信息。
导航清晰
提供易于理解的导航菜单，使用户能够方便 地浏览不同页面。
层次分明
合理划分页面区域，使内容按照重要程度进 行排序，提高用户体验。
制作电商网站
总结词
商品展示与销售
详细描述
电商网站是商品展示和销售的重要平台，需要展示丰 富的商品信息和购物体验。在制作电商网站时，需要 考虑如何设计出美观、实用的商品展示页面，以及如 何提供便捷的购物流程和支付方式。
制作电商网站
总结词
用户友好性
详细描述
电商网站应该具有用户友好性，提供良好的 用户体验和购物体验。在制作电商网站时， 需要考虑如何设计出易于操作和使用的界面 和功能，以及如何提供个性化的服务和支持
网页设计第一章PPT课件
网页设计第一章ppt课件
目录
• 网页设计概述 • 网页设计基础 • 网页设计流程 • 网页设计工具 • 网页设计最佳实践 • 案例分析
01 网页设计概述
什么是网页设计
定义
网页设计是使用HTML、CSS和 JavaScript等技术，将内容、布局、
交互和视觉效果整合到网站的过 程。
目的
创造用户友好、易于导航和信息丰 富的网站，以吸引和留住访问者。
的用户体验。
02 网页设计基础
HTML基础
01
HTML是网页设计的基 石，用于构建网页的结 构和内容。
02
HTML元素是网页的基 本组成单元，包括标题、 段落、列表、链接等。
03
HTML标签用于定义元 素，如`<h1>`至`<h6>` 用于定义标题，`<p>` 用于定义段落。
04
语义化标签的使用可以 提高网页的可访问性和 SEO效果。
。
Sketch
专为网页和移动应用设计的矢 量绘图工具，适合团队协同工 作。
Figma
一款基于云的设计工具，支持 多人实时协作，适合跨团队项 目。
Canva
在线设计平台，提供丰富的模 板和素材，适合初学者快速制
作网页设计。
开发工具
Sublime Text
轻量级但功能强大的文本编辑器，适用于前 端开发。
JavaScript用于实现网页的交互功能。
JavaScript事件处理程序用于响应用 户操作，如点击、鼠标移动等。
JavaScript可以操作DOM（文档对象 模型），动态修改网页内容。
AJAX技术可以实现异步数据加载和 页面更新。
响应式设计基础
响应式设计是一种使网页在不同设备上都能良好显示的 方法。
目录
• 网页设计概述 • 网页设计基础 • 网页设计流程 • 网页设计工具 • 网页设计最佳实践 • 案例分析
01 网页设计概述
什么是网页设计
定义
网页设计是使用HTML、CSS和 JavaScript等技术，将内容、布局、
交互和视觉效果整合到网站的过 程。
目的
创造用户友好、易于导航和信息丰 富的网站，以吸引和留住访问者。
的用户体验。
02 网页设计基础
HTML基础
01
HTML是网页设计的基 石，用于构建网页的结 构和内容。
02
HTML元素是网页的基 本组成单元，包括标题、 段落、列表、链接等。
03
HTML标签用于定义元 素，如`<h1>`至`<h6>` 用于定义标题，`<p>` 用于定义段落。
04
语义化标签的使用可以 提高网页的可访问性和 SEO效果。
。
Sketch
专为网页和移动应用设计的矢 量绘图工具，适合团队协同工 作。
Figma
一款基于云的设计工具，支持 多人实时协作，适合跨团队项 目。
Canva
在线设计平台，提供丰富的模 板和素材，适合初学者快速制
作网页设计。
开发工具
Sublime Text
轻量级但功能强大的文本编辑器，适用于前 端开发。
JavaScript用于实现网页的交互功能。
JavaScript事件处理程序用于响应用 户操作，如点击、鼠标移动等。
JavaScript可以操作DOM（文档对象 模型），动态修改网页内容。
AJAX技术可以实现异步数据加载和 页面更新。
响应式设计基础
响应式设计是一种使网页在不同设备上都能良好显示的 方法。
网页制作基础教程PPT课件
图片多数比较大，最好用图形软件
处理一下，处理方法这点后面会讲
到
静态图片 动态图片
式
工 具 栏
插 入
[]
在 需 要
选菜 插
择单 入
插下 图
[]
入图 片
图片 的
片 的 快 捷
或 者 在
位 置 选 择
方
• 文字链接的制作 ——选中文字，点击鼠标右键，选择超级连接或 者选择文字，鼠标左键点击编辑超连接的快捷方 式
• 制作自己的第一个网页，要求包含图片、文字， 链接
• 将自己的网页另存到“我的文档”文件夹，取名 为：“我的第一个网页”，要求保留页面原本的 全部效果
1. 使用IE浏览器将这个页面添加到收藏夹
• 图片链接的制作 ——选中图片，点击鼠标右键，选择超级连接或 者选中图片，鼠标左键点击编辑超连接的快捷方 式
•不要忘记加入网页的title<标题> ——title是显示在浏览器标题栏的文字，在网页下载时，它是最先出现的，所 以你可以用它提示网页的主要内容，或者写些欢迎的话
•将首页命名为 ——这是规定，没什么好多说的，哪页一旦被你取名叫以后，等你把你的整个 homepage上传了以后，它就是别人用你的网址看到你网站的第一页
•将所有文件的文件名统一格式用英文字母，如都为英文小写且的格式 ——前面的课程里有详细的说过文件名的一些知识
•图片应使用.gif和.jpg(jpeg)格式 ——这是两种位图文件格式，在同样的视觉清晰度下，文件量往往比其他文件 格式小，也就是说在网上下载的时候时间会更短，一般从网上下载的图片不用 考虑这个问题
• 拷贝其他文件的文字 ——如其它网页上的文字，选中反白了以后复制， 粘贴，就可以了
网页设计基础PPT课件
<文件名>指定的才是资源，此前都是定位该文件位置的信息。
例如：
1.2 Web简介
1.2.1 Web的特点
Web发展到今天，已经具有以下特点 （1）Web是一种超文本信息系统 （2）Web是图形化的和易于导航的 （3）Web与平台无关 （4）Web是分布式的 （5）Web具有新闻性 （6）Web是动态的、交互的
（4）如果HTML文档中嵌有ASP或CGI（Common Gateway Interface， 公共网关接口）程序，Web服务器就运行ASP或CGI程序，并将结果传送 至浏览器。
（5）URL也可以指向VRML（Virtual Reality Modeling Language）文 档。只要浏览器中配置有VRML插件，或者客户机上已安装VRML浏览器， 就可以接收Web服务器发送的VRML文档。
第1章 Web基础知识
1.1 Internet基础
1.1.1 Internet基本服务功能
1. 电子邮件(E-mail)服务(使用邮件传输协议STMP)
2.WWW服务(使用超文本传输协议HTTP)
1.1.1 Interne基本服务功能
3. 远程登录服务（使用远程登录协议Telnet）
使用远程主机有两种情况：一种是要求用户有帐号才能进行 登录的；另一种是开放的，用户无须拥有自己的帐号，即不用 口令和用户名就能登录的。
Web服务器端执行的程序有CGI、ASP、JSP、PHP等。
1.2.3 Web页面
2. 网站 若干个网页按一定方式连接在一起，作为一个整 体，用来描述一组完整的信息或一个单位的情况。 这样一组存放在网络服务器上具有共同主题的相 关联的网页组成的一组资源称为网站。网站的网 页总是由一个主页和若干个从页组成。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
2.3.5 使用动态HTML(DHTML)
使用DHTML技术，可通过浏览器技术、客户端脚本技术和CSS样式表生 成变化缤纷的动态页面。 DHTML是Dynamic HTML(动态HTML)的简称，它是一种即使在脱离网络 环境的情况下，网页装载到浏览器后仍然能够随时变换内容的技术。例如，当 鼠标指针移至文章段落中，段落能变成醒目的红色或蓝色；在网页的页面上， 随机地漂浮着一些漂亮的小标志；网页横幅不断地滑动或具有滚动闪亮的效果 等。 DHTML之所以能够制作出“动感”的效果，首先是因为DHTML将网页中 的每个元素划分成了许多独立的对象，通过CSS来指定这些对象的属性。 CSS是DHTML网页进行改变的对象，网页中的各种变化都是通过脚本语 言设置CSS的属性来实现的。因此可以说CSS是编写DHTML网页的基础 。
表格对于制作网页是很重要的，现在很多网页都是使用多重表格。主要是 因为表格不但可以固定文本或图像的输出，而且还可以任意地设置背景和前景 颜色。 表格由 <Table> 标记开始， </Table> 标记结束，表格的内容由 <Tr>标记和 <Td>标记定义。<Tr>标记说明表格的一个行，表格有多少行就有多少个 <Tr> 标记；<Td>标记则设定一个单元格来填充表格 。
2.1
认识网页
网页是用一种叫做 网页的基础知识 HTML的标记语言来表示的，它将要表示的信息语言用 HTML 表述出来，这就形成了HTML代码。而浏览器的主要工作就是将这些标 网页的基本结构 记语言“翻译”过来，并按照定义的格式显示，这就是最终看到的网页。
2.1.1 网页的基础知识
Internet 是从 Interconnected Networks 延伸而来的，是跨国界的网络。 Internet把世界各地数以千万计的计算机和传输线路连接在一起构成一个网络。 通过它可以交换信息、共享资源，并以此为基础实现各种计算机通信应用项目。 在Internet中，网页是它的重要组成部分，本节首先介绍一些与网页相关的名 词和概念。
2.1.2 网页的基本结构
HTML文件通常由3部分组成，即起始标记、网页标题和文件主体。其中， 文件主体是HTML文件的主要部分与核心内容，它包括文件所有的实际内容与 绝大多数的标记符号。 在HTML文本中，有一些固定的标记要放在每一个HTML文件里。HTML文 件的总体结构如下所示： <Html> <Head> 网页的标题及属性 </Head> <Body> 文件主体 </Body> </Html>
2.3.2 在页面中使用框架
框架网页把浏览器窗口切割成几个独立的部分，打开的链接目标文件只占 用浏览器窗口的某个区域，该区域就是框架网页的目标框架。框架网页的出现， 使得访问者在浏览器窗口中可同时观察多个网页 。 设计框架网页时，<Frame>标记和<Frameset>标记用于定义框架网页的 结构。由于框架网页的出现，从根本上改变了HTML文档的传统结构，因此在 出现<Frameset>标记的文档中，将不再使用<Body>标记，包含框架网页的 HTML文档的基本结构为： <Html> <Head>…</Head> <Frameset>…</Frameset> <Frame Src="URL"> </Html> 其中，URL用于确定在框架网页内显示的网页文件的地址 。
第02章 网页设计基础
掌握HTML语言是制作网页的基础。HTML文件包含了所有显示在网页中 的内容信息，例如文本的位置，网页的显示模式以及网页图片、动画和声音等 资源的设置。本章将通过介绍HTML语言的各种标记和语法，介绍制作网页的 基础知识。
教学重点与难点
了解使用HTML语言设计静态网页的方法 掌握编辑网页文本格式的方法 掌握创建超链接的方法 掌握表格和列表的使用方法
2.3.3 在页面中使用列表
使用列表能够有效地表达出具有并列、排序关系的网页内容，为访问者阅读网 页提供方便。 使用编号列表 HTML为用户提供了编号列表、符号列表与自定义列表3种形式。 通过上述列表的相互嵌套，还可以进一步丰富列表的表现方式 使用符号列表 。 自定义列表 定义嵌套列表
2.2 创建网页
本节将通过简单的操作实例，详细介绍在Windows系统附带的记事本中， 通过输入 编辑网页正文 HTML代码创建网页的方法。 插入网页图像 建立超链接
2.2.1 编辑网页正文
正文是网页的核心内容，用户可使用HTML语言在网页内对正文进行划分 段落、插入标题、修改字体、设置字号等操作。另外，HTML还允许对正文应 用不同的字形和效果。
2.3.4 在页面中使用表单
在Web网页中，表单用来给供访问者填写信息，从而使管理员能获得访问 者信息，使网页具有交互功能。表单设计在HTML文档中，当用户填写完信息 后做提交(submit)操作，于是表单的内容就从客户端的浏览器传送到服务器上， 经过服务器上的ASP或PHP等处理程序处理后，再将用户所需信息返回到客户 端的浏览器上，这样网页就具有了交互性。 网页内的表单由表单标记<Form>定义，使用<Form>标记意味着表单的开 始，而</Form>标记符号则意味着表单的结束。由于表单通常用于收集站点访 问者的信息，因此在表单的内部必须出现输入标记<Input>，用于收集表单数 据。表单标记的基本结构如下所示： <Form Action=URL Method=get|post> … <Input Type=Submit> <Input Type=reset> </Form>常需要在页面上添加一些图片，因为有时“一图胜千言”。 HTML语言提供了<Img>标记来处理图像的输出。本节将介绍在网页内插入图 像文件，设置图像链接的方法，以及通过运用HTML标记改变图像的显示尺寸 与对齐方式等。
2.2.3 建立超链接
超链接一般可分为外部链接(External Link)与内部链接(Internal Link)。单 击外部链接时，浏览器窗口将显示其他文档的内容；单击内部链接时，访问者 将看到网页的其他部分并显示在当前浏览器窗口中。另外，HTML还可以创建 指向邮件地址的链接，单击该链接后便可通过电子邮件软件给指定的地址发送 邮件 。
2.3 设置网页
本节将通过几个简单的实例，详细介绍通过修改HTML网页代码，在网页 中设置表格、框架、列表、表单、 在页面中使用表格 CSS样式和动态HTML的方法 。 在页面中使用框架 在页面中使用列表 在页面中使用表单 使用动态HTML(DHTML)
2.3.1 在页面中使用表格