第二章网页
网页管理制度规范
网页管理制度规范第一章总则第一条为了加强网页的管理，规范网页的内容和操作，有效提高网页的运行效率和安全性，本制度订立。
第二条本制度适用于企业全部网页的管理及使用，包含公开网页和内部网页。
第二章网页的建设第三条网页的建设应遵从以下原则：（一）确保网页的安全性和稳定性；（二）供应清楚、准确及时的内容；（三）界面友好，易于操作；（四）符合企业形象和品牌要求。
第四条网页的建设流程：（一）确定需求：依据部门或项目需要，明确网页的功能和内容；（二）设计方案：依据需求确定网页的结构和布局，编写网页的设计方案；（三）开发实施：依据设计方案进行网页开发和实施；（四）测试验收：对网页进行测试和验收，确保功能正常；（五）上线发布：经过测试和验收合格后，将网页正式发布上线；（六）维护更新：定期检查和维护网页，及时更新内容和功能。
第三章网页的管理第五条网页的管理应遵从以下原则：（一）负责人制度：明确网页的负责人，负责网页的日常管理和维护；（二）权限管理：依据不同职责和工作需求，限制不同人员对网页的操作和管理权限；（三）备份与恢复：定期备份网页数据，确保数据安全，能够及时恢复。
第六条网页的管理职责：（一）网页负责人应负责网页的日常管理和维护，包含内容更新、功能维护等；（二）技术人员应负责网页的开发、测试、部署等技术工作；（三）安全管理员应负责网页的安全管理，定期检查和修复漏洞。
第七条网页管理的具体措施：（一）定期检查与维护：定期检查网页的运行情形，确保网页的稳定性和安全性；（二）内容更新：及时更新网页内容，保持内容的准确性和时效性；（三）功能维护：依据需求和用户反馈，及时修复和调整网页的功能；（四）安全防护：加强网页的安全防护措施，防止黑客攻击和数据泄露；（五）异常处理：及时处理网页的异常情况，如页面错误、链接失效等；（六）用户支持：供应及时的用户支持和解答，满足用户需求；（七）域名管理：合理管理企业网页的域名，定期评估域名的使用情况。
第2章 网页设计与制作-HTML语言基础
由“<”和“>”组成的就是标记。在HTML 语言中标记分“单标记”和“双标记”。
2.1 HTML概述
2.2 文本的编辑
2.2.3 标题显示等级
语法格式为：
<hn>…</hn>
n：表示不同级别的标题，n值可以是1-6中 的任意数字，其中1表示的标题字体最大。
可以用align属性设置对齐方式，常用的有 左对齐，居中，右对齐三种对齐方式。
2.2 文本的编辑
2.2.4 列表
在HTML中，列表常用的有“有序列表”和 “无序列表”。
2.2 文本的编辑
2.2.4 列表
2．无序列表 基本语法结构为：
<ul type=“n”>
<li>项目1</li> <li>项目2</li>
……
<li>项目n</li>
</ul>
Type:设置符号形状，有实心圆、小正方形、 空心圆三种，具体如下：
n=disk：符号为实心圆。 n=square：符号为正方形。 n=circle：符号为空心圆。
绝对路径：完整的描述文件位置的路径就 是绝对路径。对于绝对路径可以不需要知道其 他任何信息就可以判断出文件的位置。
相对路径：所谓相对路径,顾名思义就是当 前文档与目标的相对位置。例<src = "1.bmp">.
网页设计教学教案
网页设计教学教案第一章：网页设计基础1.1 教学目标了解网页设计的基本概念和原则掌握网页设计的工具和软件学习网页设计的基本技能和技巧1.2 教学内容网页设计的定义和作用网页设计的原则和要素网页设计的工具和软件介绍网页设计的技能和技巧讲解1.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享1.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第二章：网页布局与排版2.1 教学目标学习网页布局的基本概念和原则掌握网页排版的方法和技巧学习使用网页布局工具和软件2.2 教学内容网页布局的定义和作用网页布局的基本原则和要素网页排版的方法和技巧网页布局工具和软件介绍2.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享2.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第三章：网页配色与图标设计3.1 教学目标学习网页配色的基本原则和方法掌握网页图标设计的基本技巧和风格学习使用网页配色工具和软件3.2 教学内容网页配色的定义和作用网页配色的一般原则网页配色的具体方法网页图标设计的基本技巧网页图标设计的风格3.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享3.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第四章：网页动画与交互设计4.1 教学目标学习网页动画的基本概念和制作方法掌握网页交互设计的基本原则和技巧学习使用网页动画和交互设计的工具和软件4.2 教学内容网页动画的定义和作用网页动画的基本类型和制作方法网页交互设计的定义和作用网页交互设计的原则和技巧网页动画和交互设计的工具和软件介绍4.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享4.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第五章：网页设计与网页标准5.1 教学目标学习网页设计的基本标准和规范掌握网页设计的最佳实践和技巧学习使用网页设计的相关工具和软件5.2 教学内容网页设计标准的基本概念和作用网页设计规范的定义和内容网页设计最佳实践的介绍网页设计的工具和软件介绍5.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享5.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第六章：HTML与CSS基础6.1 教学目标学习HTML的基本结构和语法掌握CSS的使用方法和技巧理解HTML和CSS在网页设计中的重要性6.2 教学内容HTML的定义和作用HTML的基本结构和语法CSS的定义和作用CSS的使用方法和技巧HTML和CSS在网页设计中的应用6.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享6.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第七章：响应式网页设计7.1 教学目标学习响应式网页设计的基本概念和原则掌握响应式网页设计的技巧和工具学习响应式网页设计的方法和流程7.2 教学内容响应式网页设计的定义和作用响应式网页设计的基本原则和要素响应式网页设计的技巧和工具响应式网页设计的方法和流程7.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享7.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第八章：网页设计与前端开发8.1 教学目标学习前端开发的基本概念和流程掌握HTML、CSS和JavaScript在网页设计中的应用学习使用前端开发工具和框架8.2 教学内容前端开发的定义和作用HTML、CSS和JavaScript在网页设计中的应用前端开发的流程和步骤前端开发工具和框架的介绍8.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享8.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第九章：网页设计与后端开发9.1 教学目标学习后端开发的基本概念和流程掌握后端编程语言和数据库在网页设计中的应用学习使用后端开发框架和工具9.2 教学内容后端开发的定义和作用后端编程语言和数据库在网页设计中的应用后端开发的流程和步骤后端开发框架和工具的介绍9.3 教学方法讲授和演示相结合案例分析和实践操作小组讨论和分享9.4 教学评估课堂参与度和提问案例分析和实践操作的完成情况小组讨论和分享的参与度第十章：网页设计项目实践10.1 教学目标培养学生独立完成网页设计项目的能力培养学生团队协作和沟通能力培养学生对网页设计行业的理解和认识10.2 教学内容网页设计项目的定义和作用网页设计项目的流程和步骤网页设计项目的实践操作和技巧团队协作和沟通的方法和技巧10.3 教学方法实践操作和项目实训团队协作和沟通的实践指导和学生互评10.4 教学评估项目完成的质量和效果团队协作和沟通的参与度学生互评和教师评价重点和难点解析一、网页设计基础1.1 教学内容中的网页设计的定义和作用、原则和要素，以及网页设计的工具和软件介绍是本节课的重点。
第2章 HTML入门(网页制作案例教程课件)
2.2 创建第一个HTML文件
• HTML可以使用任何文本编辑器，如Windows“ 记事本”或“写字板等”进行编辑，代码输入 后，一定要把文件的扩展名保存为“.htm”或 “.html”。
图2-2 2020/7/26 编辑HTML文档
图2-3 IE显示HTML网页内容
2.3 HTML编码基础
属性值，这里是颜色值(粉红色)
bgcolor就是<body>标记的属性，用于设置背景色
2020/7/26
2.1.2 标记及其属性
• 如果一个标记有多个属性，属性和属性之间用 空格隔开 。
• 标记在使用时，应注意以下几点：
– HTML标记不区分大小写
– 使用“<!--”和“-->”标记将HTML文档中注解内容括 起来
</head>
<body> <font size=1>1号字体</font><p> <font size=2>2号字体</font><p> <font size=3 color=red>3号字色红体</font><p> <font size=4 color=blue>4号蓝色字体</font><p> <font size=5 color=orange>5号橙色字体</font><p> <font size=6 color=yellow face="黑体">6号黄色黑体字体</font><p> <font size=7 color=green face="隶书">7号绿色隶书字体</font><p> <font size=+2 color=purple face="宋体">+2号紫色宋体字体</font><p
第二章 网页设计语言_Html
标题标记用于设置文档中的标题，其中
<H1>...</H1>标记表示字体最大的标题，
<H6>…</H6>标记表示字体最小的标题。
每个标题标记所标记的字句将独占一行且上下留下一空 白行。
演示：Sample2_4.htm
水平线的插入 <hr>标志是在Html文档中加入一条水平线。
COLOR属性
设置水平线的颜色，例如<HR color=red>
2.5.1 在网页中插入图像
演示：Sample2_13.htm、Sample2_14.htm
2.5.2
播放多媒体文件
Img标记不仅用于在网页中插入图像，也可以用
于播放多媒体文件（.avi）。若要在网页中播放多媒
体文件，应在IMG标记中设置以下属性： DYNSRC：指定要播放的多媒体文件的URL。 START：指定何时开始播放多媒体文件，其取值可 以是fileopen或mouseover。
二、创建无序列表 使用UL和LI标记来创建，语法格式如下：
<UL>
<LI>列表项1
…… <LI>列表项n </UL>
UL标记的TYPE属性用于指定列表项前面显示的项目 符号，其取值可以是：
disc：使用实心圆作为项目符号（默认值）。
circle：使用空心圆作为项目符号。 square：使用方块作为项目符号。 演示：Sample2_10.htm
<P align=“center”> 演示：Sample2_7.htm 、Sample2_8.htm
二、换行标记<BR> 大多数情况下，段落标记<P>是分隔文本的最佳
《网页设计与制作》笔记_学习笔记
《网页设计与制作》笔记第一章：网页设计基础1.1网页设计的定义与重要性1.2网页设计的历史与发展1.3设计原则与最佳实践1.4用户体验的基本概念第二章：网页设计工具与技术2.1设计软件介绍（如Photoshop、Sketch）2.2前端开发工具（如HTML、CSS、JavaScript）2.3响应式设计与框架（如Bootstrap、Foundation）2.4版本控制与协作工具（如Git、GitHub）第三章：网页布局与结构3.1网页布局的基本概念3.2网格系统与布局设计3.3导航设计与信息架构3.4模块化设计与组件化开发第四章：色彩与字体选择4.1色彩理论与配色技巧4.2字体的选择与排版4.3色彩与品牌形象4.4可访问性与色彩使用第五章：网页内容与互动5.1内容策略与信息呈现5.2图像与多媒体的使用5.3互动设计与用户反馈5.4SEO基础与内容优化第六章：网页测试与上线6.1测试类型与测试工具6.2性能优化与加载速度6.3上线流程与维护建议6.4数据分析与用户行为追踪第1章：网页设计基础网页设计的定义与重要性网页设计是指为网站创建和布局视觉内容的过程。
这包括网页的整体外观、结构和交互功能。
网页设计不仅涉及视觉元素的排版和配色，还包括用户如何与网页互动。
一个好的网页设计能够提升用户的体验，增加网站的访问量和转化率。
重要性：1.吸引用户：优秀的网页设计能够第一时间吸引用户的注意，提高用户的留存率。
2.增加可用性：良好的设计帮助用户更容易找到他们所需的信息，减少用户的挫败感。
3.提升品牌形象：专业的网页设计能够增强品牌的可信度和专业形象。
4.搜索引擎优化：设计良好的网页更容易被搜索引擎抓取，从而提升网站在搜索结果中的排名。
考试要点：网页设计的定义及其组成部分网页设计对用户体验和品牌形象的影响网页设计在市场营销中的作用网页设计的历史与发展网页设计的起源可以追溯到20世纪90年代初。
当时网页主要是以文本为主，简单的超链接连接不同的信息。
第2章 网页版设设计与色彩搭配[101页]
![第2章 网页版设设计与色彩搭配[101页]](https://img.taocdn.com/s3/m/ce6257985fbfc77da269b1e9.png)
2.2 学习任务：网页版式设计
9．三角型 网页各视觉元素呈三角形排列。正三角形（金字塔
型）最具稳定性，倒三角形则产生动感。侧三角形构 成一种均衡版式，既安定又有动感。
《网页设计与制作案例教程》（第3版）
2.2 学习任务：网页版式设计
《网页设计与制作案例教程》（第3版）
2.2 学习任务：网页版式设计
《网页设计与制作案例教程》（第3版）
2.1 案例分析：不同风格网页作品欣赏与解析
网页作品欣赏之四：苹果公司网站首页
《网页设计与制作案例教程》（第3版）
2.1 案例分析：不同风格网页作品欣赏与解析
网页采用四横的骨骼式设计，整体色彩采用黑白灰 色调。从色彩及版式看，网站秉承了苹果创始人乔布 斯的极简风格，苹果在网页设计上并没有花费太大笔 墨。骨骼式架构是公司网站通用的架构，容易被浏览 者接受，黑白灰是永恒的时尚色。中间大块区域被主 打商品占据，产品宣传意图明显。可见，无论从版式 还是配色，无处不透露着苹果公司的文化氛围和价值 理念，很容易被苹果的粉丝所认可。
《网页设计与制作案例教程》（第3版）
2.2 学习任务：网页版式设计
2.2.3 网页的版式设计风格
1．骨骼型
是一种规范的、理性的分割方法，类似报刊的版式。 骨骼型又称为分栏式。常见的骨骼有竖向通栏、双栏、 三栏、四栏和横向的通栏、双栏、三栏和四栏等。一 般以竖向分栏为多。这种版式给人以和谐、理性的美。 几种分栏方式结合使用，既理性、条理，又活泼而富 有弹性。
《网页设计与制作案例教程》（第3版）
2.2 学习任务：网页版式设计
2.2.1 版式设计概述 网页的版式设计，是指在有限的屏幕空间内，根据
网页主题诉求，将网页元素按照一定的艺术规律进行 组织和布局，使其形成整体视觉印象，最终达到有效 传达信息的视觉设计。它以有效传达信息为目标，利 用视觉艺术规律，将网页的文字、图像、动画、音频 、视频等元素组织起来，充分体现了网页整体风格。
第2章网页的基本结构
例如 ： <FONT size＝3 color＝red>属性示例 </FONT>
26 制作：计算机学院 邵黎
第二部分 第2章 网页的基本结构和段落、文字标记
需要注意： （1）并不是所有的标记都有属性，如换行标
记就没有。 （2）根据需要可以用该标记的所有属性，也
5 制作：计算机学院 邵黎
第二部分 第2章 网页的基本结构和段落、文字标记
超文本标记语言——HTML 在 HTML 中 被 制 定 的 文 件 格 式 （
Document Type Definition ，DTD ）有3 种： • Strict DTD（严格的DTD ） • Transitional DTD（过渡的DTD ） • Frameset DTD （框架的DTD ）
第二部分 第2章 网页的基本结构和段落、文字标记
2.2 HTML文件的基本结构
HTML是用标记来说明网络文件格式 的,并通过这些标记对文件的成分进行控制。 它实际上就是一种对超文本进行标记的语 言，其基本特征就是各种HTML的标记符 号。
21 制作：计算机学院 邵黎
第二部分 第2章 网页的基本结构和段落、文字标记
28 制作：计算机学院 邵黎
第二部分 第2章 网页的基本结构和段落、文字标记
在属性值中不要使用“<”和“>”，避免与 起始和结束标记混淆。因为浏览器解释 HTML文件时，是根据“<”与“>”来识别 标记的，然后再确定这两个符号中的内容是 否为HTML文件标记，若是则按其规则解读。 必须使用的话，或要在网页中显示“<” 或“>”，就要作为特殊字符，应使用实体字 符与分号（如用“<”或 “ > ;”来代替 “<”或“>” ）。
动态网页的基础知识 第2章
常见颜色RGB值 表2-2 常见颜色 值 颜色 黑色（Black） 红色（Red） 绿色（Green） 蓝色（Blue） 白色（White） 黄色（Yellow） 银色（Silver） 浅色（Aqua） RGB 000000 FF0000 008000 0000FF FFFFFF FFFF00 C0C0C0 00FFFF 颜色 橄榄色（Olive ） 深表色（Teal） 灰色（Gray） 深蓝色（Navy ） 浅绿色（Lime ） 紫红色（ Fuchsia） 紫色（Purple） 茶色（Maroon ） RGB 808000 008080 808080 000080 00FF00 FF00FF 800080 800000
表示转义序列的开始。每个转义字符都 “&”开始，以分号“；”结束。（解决二义性问题） 例如：“<”表示“<”符号。“ ”表示空格。
2.1 HTML语言 语言
元素名也叫链接签名。需要注意的是： （1）< 和起始链接签之间不能有空格。 （2）元素名称不区分大小写。 （3）一个元素可以有多个属性，属性及 其属性值不区分大小写，且各个属性用 空格分开。
<HTML> <HEAD> <TITLE>这是一个测试网页</TITLE> </HEAD> <BODY> <pre> <!--（图2-4无此标记）--> HTML是一种描述文档结构的标注语 言，它使用一些约定的标记对各种信息 进行标注。 </pre> <!--（图2-4无此标记）--> </BODY> </HTML>
<HTML> <HEAD> <TITLE>这是一个测试网页</TITLE> </HEAD> <BODY> <STRONG>HTML</STRONG>是一种 <EM>描述文档结构</EM>的 <U>标注语言</U>， <B>它使用</B>一些 <I>约定的标记</I>对各种信息进行 <S>标注<S>。 </BODY> </HTML>
第二章Dreamweaver网页设计技术
用布局表格设计页面举例，如图所示。
2.6 层的使用
层可以放在网页任何位置，比表格更灵活，常用来作为表格的补充。 层中不但可以插入文本、图像、表格等对象，还可以在层中嵌套层。
2.保存文档
“文件”菜单→“保存”→选择与逻辑站点相关联的本地站点（如： e:\weblx）→为文件起名→单击“保存”→在Dreavweaver站点面板中单 击刷新按钮。可以看到新建的文件被显示在站点面板中。
3.页面属性
“修改”菜单→“页面属性”，打开“页面属性”对话框，如图所示.
4.使用CSS样式格式化文本
4. 用布局模式布局页面
布局表格用来完成稍微复杂一点的页面布局，还可以与标准表格相互 转换。先用布局表格给页面划分大的区域，再用布局单元格对页面做细致的 划分。 如图所示。
（1）绘制布局表格和嵌套的布局表格
最外层的布局表格只能上下排列，嵌套的布局表格可以上下左右排列。 如图所示。
（2）绘制布局单元格
(4) 拆分单元格
单击一个单元格→“修改”菜单→“表格”→“拆分单元格”→在对话 框中定义拆分的行数或列数，或单击属性面板中的“拆分单元格”按钮。 (5) 使用剪切、复制、粘贴命令对所选单元格进行操作，能保留单元格
的格式设置。
3. 设置表格属性 选定表格后，在表格的属性面板中设置表格属性。如图所示。
2.文档位置和路径 超链接有3种类型：绝对路径、相对路径和基于站点的相对路径。 (1)如果超链接路径中包含所使用的协议，而且与链接源点所处位置无关， 称这种链接路径为绝对路径，例如，一个使用http协议的绝对路径可以写 为：/index.htm。 (2)如果超链接路径描述源点与锚点相对位置，也就是由当前文件所在位 置引起的路径，称这种连接路径为相对路径。使用相对路径的站点结构 和文档相对位置不变，整个本地站点上传到服务器时文档之间的链接关 系不变。所以，提倡使用相对路径。 (3)从站点根目录开始的路径称为站点根目录相对路径，提供从站点文件 夹到文档的路径，与起始端点的位置无关，用斜线“/”表示站点根目录。 例如：/liran/index.htm。这种路径能够保持站点结构和文档相对位置不变， 也被提倡使用。
2我的第一个网页
第二章我的第一个网页第一节网站构思一、确定主题和内容主题和内容说白一点就是做网站的目的。
就像写作文一样，需要先确定一个主题，写出你想要表达的内容。
比如：如果你想制作一个“个人”网站，首先就要思考“个人”网站中要有哪些内容，例如图文并茂的自我小传、自己的兴趣爱好等等；内容确定了，那是不是应该给我的网站取个好名字了？同学们可以试试，看谁的名字最切合主题，而且最吸引人！二、网站结构●网页——就是你看到浏览器内的一个页面，由图片和文字组成。
通常有一级页面、二级页面之说。
当你输入网址看到的第一个页面叫做首页，通常的名字是index.htm。
●网站——简单地说就是很多相关网页文件、图片文件? 他文件的组合。
一个网站由相关网页组成一个关系网，通过页面上的链接在不同的网页之间跳转。
1、网站一定要紧扣主题。
2、页面简洁，尽可能方便访问者的浏览和查询。
3、网站的层次不要太复杂，小网站由3层网页构成是比较合适的。
4、整体的页面设计风格要保持一致。
三、风格的选择网站的风格，或者活泼、或者严肃、或者精美、或者朴素等。
我们应该根据自己的主题和内容给它选择一种合适的风格类型，以求内容和形式的完美结合，突出自己的特色和个性。
第二节准备制作网页的材料网页的构成，是需要许多材料的。
例如：文字、图片、音乐、音效、动画等，其中又以“文字”和“图片”最为常用。
如果我们能在制作网页之前，先将大量的材料收集好，那么制作起来，就会事半功倍了。
那么怎么收集这些材料呢？1、自己创作。
当然，也可收集别人的作品。
2、买现成的素材光盘或浏览素材网站下载。
3、从现有的网站抓取。
当我们在别的网站上，看到喜欢的图片时，在图片上按一下鼠标右键，就可以将图片抓下来了。
不过，这么做要考虑知识产权的问题，所以要先看清楚网站上关于知识产权的声明哦！在图片上按鼠标右键，再选择“图片另存为”，就可以将图片存起来了。
第三节创建“个人”网站说了这么多，同学们一定迫不及待想要创建自己的“个人”网站吧！别急，在创建网站之前我们要事先在硬盘中建立一个存放站点所有文件的目录。
第2章 网页元素的添加4 翻转图和Flash对象 课件
第2章 网页元素的添加
2.4 翻转图
2.4.4 实战演练：网站“闪闪作坊”页眉局部
4）光标移到第1行左侧单元格中，插入图像为image/fm01.gif。光标移到第2行中间单元格 中，单击菜单命令“插入”→“图像”→“鼠标经过图像”插入翻转图像，在对话框中设 原始图像为image/fm02.gif，鼠标经过图像为image/fm02x.gif。光标移到第2行右侧单元格中， 插入图像为image/fm03.gif。
2.23
第2章 网页元素的添加
2.5 Flash对象
2.5.4 实战演练：网页“蝴蝶谷”页眉部分
7）将光标移到第1行单元格中。单击菜单命令“插入”→“媒体”→“Flash SWF （F）”，打开“选择文件”对话框，找到image/mu.swf，单击“确定”按钮，于是 在单元格中插入Flash的SWF文件。选中SWF文件，在属性面板中单击Wmode的下 拉列表选择“透明”，按F12预览Flash背景是否透明。
5）将光标向左移动、移到字符“<td”的后面，按空格键会出现属性下拉列表，鼠标 双击背景图像属性“background”。接着系统会出现如图2-86所示的代码，并出现文 件浏览按钮，单击该浏览按钮，指定背景图像为image/tou.jpg。此时代码如图2-87所 示。
2.21
第2章 网页元素的添加
2.13
第2章 网页元素的添加
2.5 Flash对象
2.5.2 新知解析
1. 插入Flash的SWF动画 SWF动画文件插入后，选中SWF文件，可通过SWF属性面板进行相关设置。可设置
SWF动画的大小、对齐方式、与周围网页元素的边距、背景色等，可通过单击“播放”按 钮进行测试，也可通过wmode或“参数”设置SWF动画背景透明，详细设置方法请参照 “技巧提示”部分。当需要对SWF进行重新编辑时，可以单击“编辑”按钮启动Flash软件 对源文件进行编辑。
第一~三章网页设计基础知识
1.1.2 Internet 1.什么是Internet Internet即“因特网”，它是目前全球 最大的、开放的计算机互联网络。是一个 基于TCP/IP的网络，由分布在各个国家的 数以万计的网络互联设备组成。
1.1.2 Internet 1.什么是Internet （1） Internet起源于美国国防部的高级 研究计划局，最初主要用于军事。 20世纪70年代迅速壮大，发展成科研和 教育机构服务的网络。 （2） Internet提供的服务：WWW服务 （网页浏览服务）、电子邮件、文件传输 （FTP）、在线聊天、网上购物、网络炒股、 联网游戏等等。
WWW服务器采用客户机/服务器的工作模式。
1.1.4 统一资源定位器URL 1.URL：是对Internet上资源的一种准确定位 机制，它以一种全世界统一的、唯一标识 来确定某个网络资源，可以访问Internet 任何一台主机或者主机上的文件。
1.1.4 统一资源定位器URL
2.URL的组成：检索资源所使用的协议类型、存放 资源的主机域名、资源所在的路径名与文件名。 3.URL的地址格式：应用协议类型://主机域名/路径/ 文件名
2.1 页面的构成元素
2. 页面的构成元素
设计是一个思考过程，制作是将思考表现出来。也就 是说设计是网页的核心和灵魂。 结合网页设计的过程，按照网页页面所包含的各个构 成元素分类阐述： 表现主题 网站名称和CI形象 设计风格 版式设计 色彩运用 网页导航 视听元素
2.2 主题设计
1. 网页制作工具 （1）文本编辑器---网页制作通常使用HTML语言， HTML文档可以使用多种文件编辑器进行编辑。 例如记事本、word、写字板等。 （2）FrontPage---是由微软公司推出的网页制作工 具。其界面与word极为相似。 （3）Dreamweaver---具有可视化编辑界面，用户 不必编写HTML源代码就可生成跨平台、跨浏览 器的网页，即使是初学者也能制作出专业水准的 网页，是网页设计者的首选工具。
《网页浏览及搜索》PPT课件
a
24
• 2、利用浏览器下载软件的途径 从Web网站下载 从FTP网站下载
• 3、下载软件的分类： 免费软件 共享软件
a
25
• 4、单机拨号上网
• 设备： 计算机 分配了电话号码的电话线 调制解调器 (Modem)
• 调制解调器（modem）的作用
实现数字信号和模拟信号之间的转换。
a
26
网页浏览及搜索
a
1
第二章 网页浏览的知识及操作
a
2
（一）浏览网页的基础知识
• 万维网（world wide web）:简写为www，是目前 因特网中发展较快的一种网络组织形式。
• 网页：是用超文本的格式写成的包含文本、图片、 声音、动画、影像等多种媒体交互功能
• 常用的网页浏览软件有： Internet Explorer (IE浏览器)
前有“√”），再次选择将a 转换到联机状态
12
• 3、网页保存与网页预订的区别
（1）网页保存仅仅保存了网页的文档， 不包括其相“链接”的网页
（2）网页预订是将网页上的所有东西同 时保存到硬盘上，包括与该网页相“链 接”的多层网页
a
13
• 网页预订的操作
a
14
a
15
a
16
a
17
• 4、如何设置IE浏览器的起始页（主页） 主页：每次启动IE浏览器时将自动浏览的第一个网页
• 5、如何保存网页上的图片?
a
11
（三）脱机阅读、网页 预订与个性化浏览
• 1、联机阅读与脱机阅读
联机阅读：当前阅读的信息是从因特网上下载的信息， 没有脱离因特网。
脱机阅读：在不连接因特网的情况下，对已下载的 web网页进行浏览。
第2章 网页设计与制作PPT课件
8．网站的宣传和推广 网站发布后，还要不断地进行宣传，这样 才能让更多的朋友认识它，提高网站的访问率 和知名度。网站宣传和推广的方法有很多，例 如到搜索引擎上注册，与别的网站交换链接， 运用网络广告等。
9．网站的更新和维护 网站是需要经常维护和更新内容的，必须 不断给它补充新的内容，才能够长期吸引住浏 览者。
《网页设计与制作》 5
2.1.2 网站建设的步骤 建设一个网站一般要经过以下步骤：网站目标和主题
的确定、网站的规划、网站素材的准备、网站制作工具的 选择和确定、网站的建立、注册域名和申请网页空间、网 站的测试和发布、网站的宣传和推广以及网站的更新和维 护。
1．网站目标和主题的确定 1）网站目标的确定 为什么要建立网站，是为了宣传产品，进行电子商务， 还是建立行业性网站？是企业的需要还是市场开拓的延伸？ 如果是个人网站，比如说是交朋友的、学习讨论的还是兴 趣爱好的？建立网站前目标要明确。另外还应该知道谁是 网站将来的访问者，例如，明确该网站是面向于消费者？ 雇员？学生？朋友还是家庭的？只有知己知彼，才能避免 在网站建设中出现很多问题，使网站建设能顺利进行。
《网页设计与制作》 14
这两种基本结构都只是理想方式，在实际 的网站设计中，总是将这两种结构混合起来使 用，希望浏览者既可以方便快速地到达自己需 要的页面，又可以清晰地知道自己的位置。所 以，最好的办法是：首页和一级页面之间用星 状链接结构，一级和二级页面之间用树状链接 结构。
《网页设计与制作》 15
《网页设计与制作》 11
2．网站的规划 网站的规划包括总体结构的设置、目录的设 置和链接结构的设置。 1）网站总体结构的确立 网站总体结构的确立至关重要，它是网站设 计能否成功的关键所在。规划一个网站结构，可 以用树状结构先把每个页面的内容大纲列出来， 尤其是要制作一个有很多页面的大网站时，特别 需要把这个架构规划好，同时要考虑到以后可能 的扩充性，免得做好以后又要一改再改整个网站 的架构，十分累人，也十分费时。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
2.5.2 插入头部内容元素
• 选择【窗口】|【插入】命令，打开【插入】面板，切换 到【常用】类别，单击【文件头】按钮旁边的下拉箭头， 在弹出的菜单中可以选择META、【关键字】、【说明】 、【刷新】、【基础】和【链接】命令，插入相应的头部 内容元素。
习 题
1. 创建一个本地站点【个人网站】。 2. 创建【个人网站】文件夹和文件，规划网站。 3. 设置【刷新】头部信息，要求延迟时间为3秒，否则转向页 面为blank。
• 空白网页文档是学Dreamweaver CS5最常用的文档。选择 【文件】｜【新建】命令，或按下Ctrl+N键，打开【新建 文档】对话框 。在左侧的列表框中选择【空白页】选项 ，在【页面类型】列表框中选择HTML选项，在【布局】 列表框中选择【无】选项，单击【创建】按钮，即可创建 一个空白网页文档 。
【高级设置】面板中创建本地站点
• 使用【高级设置】类别面板，选择【站点】|【新建站点】 命令，打开【站点设置对象】对话框，默认打开的就是【 高级设置】类别面板，展开类别 ，如图所示 。
2.2 管理本地站点
• 创建好本地站点后，可以进行一些基本的编辑操作，主要 包括编辑、删除和复制站点等操作。
2.2.1 打开站点
2.4.2 打开和保存网页文档
• 打开和保存网页文档的方法非常简单。在打开网页文档时 ，可以选中所需打开的文档，也可以打开最近的文档。
打开网页文档
选择【文件】|【打开】命令或按下Ctrl+O键，打开【打开】 对话框。选择所需打开的网页文档，单击【打开】按钮即 可。
打开最近打开的文档
选择【文件】|【最近打开的文件】命令，在弹出的子菜单中 可以选择最近打开的文档 。 此外，在启动Dreamweaver CS5时，在显示页面左侧的【打开 最近的项目】列表中，也可以选择打开最近打开的文档
保存网页文档
选择【文件】|【保存】命令或按下 Ctrl+S 键，打开【另存为 】对话框。选择文档存放位置并输入保存的文件名称，单 击【保存】按钮即可。
Байду номын сангаас
2.4.3 设置文档属性
• 网页文档的属性主要包括页面标题、背景图像、背景颜色 、文本和链接颜色、边距等。其中，【页面标题】确定和 命名了文档的名称，【背景图像】和【背景颜色】决定了 文档显示的外观，【文本颜色】和【链接颜色】帮助站点 访问者区别文本和超文本链接等。 • 选择【修改】|【页面属性】命令，打开【页面属性】对 话框，如图所示，可以设置有关网页文档的所有属性。
2.5 查看和编辑页面头部信息
• 一个完整的 HTML 网页文件包含 head 和 body 两个部分， head部分包括许多不可见的信息，例如语言编码、版权声 明、关键字等。下面介绍有关页面头部内容的设置操作。
2.5.1 显示文档头部信息
• 头部信息除了文档Title外，其余都是不可见的，要查看这 些头部信息，可以使用【查看】菜单，或在代码视图中查 看。 • 打开一个网页文件，选择【查看】|【文件头内容】命令 ，文档头部中的元素将以图标的形式显示在文档窗口的设 计视图左上角。
新世纪高职高专规划教材
《网页制作实用教程》
第2章 创建管理站点
学习目标
网页文件和网页中插入的元素都保存在网站中，网站 可以分为本地网站和远程我那个站。本地网站存放在本地 计算机或网络服务器上，远程网站位于运行Web服务器的 计算机上。首先要创建本地站点，创建本地站点后可以创 建网页文档。
本章重点
规划站点的链接结构
• 站点的链接结构，是指站点中各页面之间相互链接的拓扑 结构，规划网站的链接结构的目的是利用尽量少的链接达 到网站的最佳浏览效果。 • 通常，网站的链接结构包括树状链接结构和星型链接结构 ，在规划站点链接时应混合应用这两种链接结构设计站点 内各页面的链接，尽量使网站的浏览者既可以方便快捷地 打开自己需要访问的网页，又能清晰地知道当前页面处于 网站内的确切位置。
2.1.2 创建本地站点
• 在创建站点之前，一般在本地将整个网络完成，然后再将 站点上传到Web服务器上。创建本地站点可以使用向导创 建也可以使用高级面板创建。
使用向导创建本地站点
• 选择【站点】|【新建站点】命令，打开【站点设置对象】 对话框，默认打开的是【高级设置】类别对话框 ，然后新 建站点
重命名文件和文件夹
• 重命名文件或文件夹可以更清晰地管理站点。可以单击文 件或文件夹名称，输入重命名的名称，按下Enter键即可 。
2.4 网页文档的基本操作
• Dreamweaver CS5提供了多种创建文档的方法，可以创建 一个新的空白HTML文档，或使用模板创建新文档。
2.4.1 创建空白网页文档
创建网站框架 创建站点 站点文件的管理 网页文档的管理
2.1 创建网站框架
• 在建立网站之前，首先应设计和规划好整个站点，继而才 能进行具体的网页制作过程。下面主要介绍使用不同的方 法创建和管理站点的方法，创建不同类型文档的方法以及 网页制作的常用操作。
2.1.1 规划站点
• 规划站点主要是规划站点的结构。创建站点既可以创建一 个网站，又可以创建一个本地网页文件的存储地址，规划 好站点后即可开始创建站点。
2.3.2 管理站点文件
• 管理站点文件操作主要包括重命名文件或文件夹以及删除 文件或文件夹。
删除文件和文件夹
• 在站点中创建的文件和文件夹，如果不需要使用，可以删 除他们。选中所要删除的文件或文件夹，按下 Del 键，系 统会打开一个信息提示框，如图2-13所示，单击【是】按 钮，即可删除该文件或文件夹。
• 选择【窗口】|【文件】命令，打开【文件】面板，如图 所示，显示了当前站点中的所有文件。 • 单击面部那右侧的【展开/折叠以显示本地和远端站点】 按钮，展开【文件】面板，在右侧显示了站点或远程服务 器站点上的文件，右侧则显示了本地站点的所有文件，如 图所示。
2.2.2 【管理站点】对话框
• 【管理站点】对话框主要是对本地站点进行管理操作，选 择【站点】|【管理站点】命令，打开【管理站点】对话 框，如图所示，在该对话框中显示了创建的本地站点。
规划站点的目录结构
• 站点的目录指的是在建立网站存放网站文档所创建的目录 ，网站目录结构的好坏对于网站的管理和维护至关重要。 在规划站点的目录结构时，应注意以下几点。 • 使用子目录分类保存网站栏目内容文档。应尽量减少网站 根目录中的文件存放数量。要根据网站的栏目在网站根目 录中创建相关的子目录。 • 站点的每个栏目目录下都建立Image、Music和Flash目录， 以存放图像、音乐、视频和Flash文件。 • 避免目录层次太深。网站目录的层次最好不要超过3层，因 为太深的目录层次不利于维护与管理。 • 不要使用中文作为目录名。 • 避免使用太长的站点目录名。 • 使用意义明确的字母作为站点目录名称。
2.3 站点文件的管理
• 创建好本地站点后，可以根据需要创建各栏目文件夹和文 件，对于创建好的站点，也可以进行再次编辑，或删除和 复制这些站点。
2.3.1 新建文件夹和文件
• 创建文件夹和文件相当于规划站点。选择【窗口】|【文 件】命令，打开【文件】面板。右击站点根目录，在弹出 的快捷菜单中选择【新建文件夹】命令，即可新建名为 untitled 的文件夹如图所示；选择【新建文件】命令，可 以新建名为untitled的文件，如图所示。