第六章-网页的设计与制作
第6章网页的设计与制作
2、下面对信息的特征的理解，错误的是（ C ）。 、下面对信息的特征的理解，错误的是（ A．“增兵减灶”引出信息有传递性和真伪性特征 ． 增兵减灶” B．天气预报、情报等引出信息有时效性 ．天气预报、 C．信息不会随着时间的推移而变化 ． D．盲人摸象引出信息具有不完全性 ．
1、在网站建设中下列几个过程是必须经历的，你认为 、在网站建设中下列几个过程是必须经历的， 网站建设比较合理的流程是（ 网站建设比较合理的流程是（ D ）。 （1）规划网站结构，并确定设计风格（标志，主色调， ）规划网站结构，并确定设计风格（标志，主色调， 文字效果，栏目设置和版面布局） 文字效果，栏目设置和版面布局） （2）发布网站 ） （3）网页制作 ） （4）了解网站运行环境，选择网站开发工具 ）了解网站运行环境， （5）确定网站主题，收集素材 ）确定网站主题， A、（ ）（ ）（ ）（ ）（ ） 、（1）（ ）（3）（ ）（5） 、（ ）（2）（ ）（4）（ B、（ ）（ ）（ ）（ ）（ ） 、（5）（ ）（4）（ ）（3） 、（ ）（1）（ ）（2）（ C、（ ）（ ）（ ）（ ）（ ） 、（1）（ ）（5）（ ）（3） 、（ ）（4）（ ）（2）（ D、（ ）（ ）（ ）（ ）（ ） 、（5）（ ）（4）（ ）（2） 、（ ）（1）（ ）（3）（
网页的基本元素包括： 网页的基本元素包括： 文字、 文字、图形图像和超链接 网页的元素包括： 网页的元素包括： (1)文字与图片 文字与图片 (2)动画 动画 (3)音乐 音乐 (4)视频影像 视频影像 (5)搜索功能 搜索功能 (6)留言版、论坛及聊天室 留言版、 留言版 (7)表单 表单 (8)网页程序 网页程序
C）。
1、Web上每一个页都有一个独立的地址，这些地址 、 上每一个页都有一个独立的地址， 上每一个页都有一个独立的地址 称作统一资源定位器， 称作统一资源定位器，即（ A ）。 A.URL B.WWW C.HTTP L 2、DNS的中文含义是（ A ）。 、 的中文含义是（ 的中文含义是 A、域名服务系统 B、服务器系统 、 、 C、 C、邮件系统 D、 D、地名系统 3、负责IP地址与域名之间转换的是：（ D ） 、负责 地址与域名之间转换的是 地址与域名之间转换的是：（ A、UNIX系统 B、FTP系统 、 系统 、 系统 C、WINDOWS NT系统 D、DNS域名系统 、 系统 、 域名系统
《网页设计与制作》课件
# 网页设计与制作
本课程旨在传授网页设计与制作的基础知识和技能。通过课程学习，您将掌 握网页设计的流程、布局原则、交互设计以及网站的维护与发布。
第一章：课程介绍
1 学习目标
明确课程学习目标，了解学习内容和要求。
2 课程安排
详细介绍每个章节的内容安排和学习进度。
3 教学方法
2 标准布局
讲解网页布局设计的基本原则和注意事项。
介绍常用的标准网页布局模式和技巧。
3 自适应布局
பைடு நூலகம்
4 响应式布局
学习如何设计适应不同设备和屏幕尺寸的 网页布局。
解析响应式设计的概念和实现方法。
第四章：网页交互设计
1 交互设计概述
揭示交互设计的重要性和基本原则。
3 交互设计流程
探讨交互设计的典型流程和步骤。
2 常用交互元素
介绍常见的网页交互元素和设计技巧。
4 JavaScript基础
入门级JavaScript语法和常用函数的使用。
第五章：网站维护与发布
1 网站测试与调试
学习进行网站测试、调 试和优化的方法。
2 网站备份与恢复
讲解网站备份和恢复的 重要性和实施步骤。
3 网站发布与维护
指导网站发布和日常维 护的关键要点。
介绍教学方法，包括理论讲解、实践演练和案例分析等。
第二章：网页设计基础
1 网页设计概述
2 HTML基础
介绍网页设计的定义、重要性和发展趋势。
学习HTML标签的使用和基本语法规范。
3 CSS基础
学习CSS样式的定义和常用属性。
4 网页设计流程
简要介绍网页设计的典型流程和步骤。
第三章：网页布局设计
浙教版信息技术第六章《网页的设计与制作》p精品PPT课件
6.2 通过邮件接收表单
表单中的信息输入完毕以后需要将信 息提供给服务器端的相关人员，用户可以 通过表单域属性面板中的“动作”属性指 定通过电子邮件接收表单数据。
在属性面板的“动作”文本框中输入 mailto:***@***.***,也就是在mailto 后面加上邮件地址。在浏览者提交表单后， 会弹出窗口询问是否继续以电子邮件形式 提交，单击“确定”按钮，浏览器会自动 打开Outlook或Outlook Express，将表
第六章
讲解提纲
Байду номын сангаас.1 创建表单 6.2 通过邮件接收表单 6.3 制作跳转菜单
6.1 创建表单
使用表单，可以帮助Internet服务 器从用户那里收集信息，它由两部分组成： 前台显示页面和后台处理程序。前台显示 页面用于显示表单的内容，主要包括文本 域、单选按钮、复选框、菜单和提交按钮 等。后台处理程序用于处理用户提交的表 单数据。
6.3 制作跳转菜单
跳转菜单利用菜单表单元素形成各种 选项的列表，一旦选中某个选项，浏览器 就会立即跳转到—个新网页，
将光标定位后，单击“表单”工具栏 上的“跳转菜单”按钮，弹出“插入跳转 菜单”对话框，根据提示输入相应内容， 点击“确定”按钮即可。
； 九九电影网
九九电影网
淘宝优惠券网
天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014 天堂网2014
网页设计与制作第6章 表单的使用
❖ 一个跳转按钮。
6.3.7 跳转菜单
❖ 1．添加一个跳转菜单 ❖ 2．修改跳转菜单
第6章 表单的使用
操作题: 新建一个文档，在该文档中建立一个个人资料
的表单。该表单如下图所示。
POST请求。 ❖ 【目标】：指定打开链接文件的框架或窗口。 ❖ 【MIME类型】：指定提交服务器处理的数据的MIME编码方式，与 ❖ POST方法连用的一般是application/x-www-form-urlencode。如果创建 ❖ 的是文件上载区域，则指定multipart/form-data MIME格式。
6.2 表单的创建
(1)表单的HTML基本语法 <form>.. .. .. ..</form>
6.3 表单对象的创建
在创建表单之后，就可以通过表单工具面 栏在表单中插入各种表单对象，也可以通过 相应的菜单在表单中插入相应的表单对象。 在表单中可以插入单行文本域、隐藏文本域、 多行文本域、单选按钮、复选框、单选按钮 组、列表菜单以及跳转菜单等多种表单对象。
❖ 【按钮名称】：设置按钮的名字。按钮名有提交和重置两个 保留名。提交用于将表单信息提交至处理信息的应用或脚本； 重置用于以原始值重新设置所有的表单区。
❖ 【标签】：设置在按钮上显示的文本。
❖ 【动作】：指定在单击这个按钮时发生的事件。选择【提交 表单】单选按钮，将会自动将按钮标签设置为【提交】；选 择【重设表单】阅览单选按钮，将会自动将按钮标签设置为 【重置】；选择【无】单选按钮，则表示在按钮被单击后， 既不提交表单也不重置表单。
6.2 表单的创建
❖ 默认，使用浏览器默认的方法（一般为GET）。 ❖ 选择GET，追加表单值到URL，并发送服务器GET请求， ❖ URL限制长度为819个字符，超出长度的部分会被去掉，所以不要对长 ❖ 表单使用GET方法，也不要用GET方法传送用户名、密码、信用卡账号 ❖ 或其他机密信息，因为GET方法不是传送信息的安全方式。 ❖ 选择POST，在HTTP request的消息正文中发送表单的值，并发送服务器
网页制作第一节教案
【第六章第一节网页制作】教案一、【教学目标】1、理解网页与网站的概念3、掌握页面文件与图片的保存二、【教学重点】三、【难点、关键】1．建站点的位置2．页面文件与图片的保存四、【教学方法】演示、任务驱动法五、【课时安排】3课时六、【教学环境】多媒体教育广播系统，Dreamweaver软件七、【教学过程】第1课时1．导入新课师：上节课已经讲了信息集成（也就是网站建设）的一般过程包括四个阶段，现在请同学们回顾一下。
生：学生作答。
师：同学们平时都有喜欢上网，那大家知道网站与网页的区别吗？概念：网页：通常我们在WWW上所能看到的每一个页面都称之为网页,它能够形象地比喻成一篇文章.网站：网站是多个网页的集合,即由多个网页通过彼此相连而构成的一个整体,能够形象地比喻成一本杂志或一本书.下面我们来学习如何用Dreamweaver这个软件制作网页。
2．新课讲述在制作个人网站之前，应先确定网站的主题。
2008奥运会即将来临，这是中国政治，经济等综合国力提升到另一台阶的盛事，我们中学生也得供献一分锦力本节课的主题是围绕“心系奥运”，资料（包括文字、图片、动画）等我已经为大家收集好，内容分类，网站的结构也规划好了，利用Dreamweaver这个工具来完成“心系奥运”这个网站的建设一、启动Dreamweaver，理解其工作界面“开始”-“程序”-“Macromedia Dreamweaver 8”Dreamweaver工作界面包括：菜单栏插入栏编辑窗口属性面板浮动面板组1．菜单栏（包括10个菜单项）符号所表示的含意黑色命令：表示该命令当前是可用的灰色命令：表示该命令当前是不可用的，需要满足一定的条件后才能使用。
带有复选标记√的命令：表示该命令是一种可选择命令，若前面出现√标记，表示该命令正在使用；若没有√标记时，表示该命令没有被使用。
带有三角形▼的命令：表示在该命令下还有下一级子菜单命令。
带有省略号的…的命令：表示选择命令后会弹出一个相关的对话框。
网页设计与制作
第1章网站规划在建立网站之前，需了解网站的开发流程，按照项目管理模式对网站进行必要的规划、开发、测试和发布使用。
一般流程如下：1.建设网站前进行必要的市场分析。
2.明确建设网站的目的及功能定位。
3.制定网站技术解决方案。
4.根据网站的目的确定网站内容、网站结构和网站功能。
5.进行网页设计，并根据技术方案实施网站建设。
6.做出经费预算。
7.网站测试。
8.网站发布及推广。
9.网站维护。
第2章网站基础知识网站（Website），是指在因特网上根据一定的规定，使用HTML等工具制作的用于展示特定内容的相关网页的集合。
网站的组成●域名（Domain Name），是由一串用点分隔的字母组成的Internet上某一台计算机或计算机组的名称。
●空间，常见网站空间有虚拟主机、虚拟空间、独立服务器、VPS。
●程序，即建设与修改网站所使用的编程语言，换成源码就是一堆按一定格式书写的文字和符号。
●网页网页（Web page），是网站中的任意一个页面，通常是HTML格式，文件扩展名为html、或htm、或asp、或aspx、或php、或jsp等。
●基本构成元素：文字、图像、超级链接。
●阅读方式：浏览器。
●类型：以不同的后缀代表不同类型的网页文件。
通常分为静态页面、动态页面。
动态网页（active web page）：指网页内容可根据用户的不同请求从而返回其对应的数据，一般情况下动态网页通过数据库进行架构，一般文件名均以开发语言做后缀，如php、asp等。
也可以说凡是结合了HTML以外的高级程序设计语言和数据库技术进行的网页编程技术生成的网页都是动态网页。
静态网页：指全部由HTML标记页面，页面的内容和显示效果基本不发生变化，所有的内容包含在网页文件中。
一般文件名均以htm、html、shtml等为后缀。
术语WWW（World Wide Web），亦称作“Web”、“WWW”、“'W3'”，中文名字为“万维网”，"环球网"等，常简称为Web。
《网站主页的设计》教学设计
《网站主页的设计》教学设计浙江绍兴市第一中学信息处董烨华一、教材分析本节课讲授浙江教育出版社《信息技术基础》第六章“网页的设计与制作”的相关，并根据《浙江省普通高中新课程实验信息技术学科教学指导意见》进行了适当设计，教学侧重于让学生掌握网站的策划与构思和熟练掌握简单网页的设计与制作。
二、学情分析学生已经会收集和整理素材，掌握了用FrontPage制作网页的基本操作，对网站的策划与构思有了一定的了解，但网站创建的知识以及网站策划构思的实践比较欠缺，另外学生现有知识水平存在一定差异。
三、教学目标知识与技能：能较熟练地运用表格实现网页布局；知道创建网站的一般过程，了解一些主页设计的知识；初步掌握网站的策划与构思。
过程与方法：通过自主探究和小组合作完成学习任务，掌握一些探究学习的方法，培养与他人协作、交流的意识和能力。
情感、态度与价值观：通过网站主页设计，激发学生的创作欲望，提高学习信息技术的兴趣和愿望；通过教师提供的创作背景信息，使学生更关注气候变化对人类发展的影响，增强社会责任感。
四、教学重难点重点：学会运用表格实现网页布局，初步掌握网站的策划与构思。
难点：如何在主页制作中实现自己的网站设计构思。
五、教学过程1．教学引入，学习准备教师指导学生访问课堂学习网站（如图1），然后介绍网站的创作构思与特点。
师：这是老师为课堂学习专门设计制作的一个网站，请同学们从“名称贴切、主题鲜明、内容丰富、结构清晰、界面友好美观”五个角度，给网站做个评价，认为都满意就赶快伸出五个手指头。
学生们高举手臂，伸出五个手指。
师：谢谢大家的支持，你们的认可是我创作的动力。
师：通过前段时间的学习，我们已经较好地掌握了素材收集与整理的方法；掌握了一些利用FrontPage软件做网页的基本操作；在欣赏优秀网站的基础上，对网站的策划与构思有了一定了解。
这节课，我们将跟随着学习网站的导航栏，一起揭开创建个人网站的第一页──设计制作网站主页。
信息技术第六章《网页的设计与制作》
CSS选择器有多种类型，包括元素选择器、类选择器、ID选 择器等。例如，`p {color: red;}`是一个样式规则，它将所有 `<p>`元素的文字颜色设置为红色。
CSS的布局模型
CSS布局模型决定了元素如何在页面上排列
CSS布局模型包括盒模型、定位、浮动等。盒模型是CSS布局的基础，每个元素都被视为一个盒子。定位属性允许元素脱离 正常流，而浮动属性则允许元素向左或向右移动，其他元素则会围绕它。
网站分析
利用网站分析工具，监测用户行为、流量来 源等信息，优化网站内容和推广策略。
THANKS
感谢观看
结合固定、流动和响应式布局的特点，根 据需要灵活运用。
网页排版的基本原则
01
02
03
04
对齐
保持页面元素的对齐，增强页 面的整体感和美观度。
对比
通过调整字体、颜色、大小等 元素的对比度，突出重点内容
。
留白
合理使用空白区域，避免页面 过于拥挤，提高可读性。
一致性
保持页面风格和设计元素的一 致性，方便用户识别和记忆。
网页布局的类型
固定布局
流动布局
网页的宽度固定，长度根据内容动态调整 。这种布局适合内容长度变化不大的网页 。
网页的宽度根据浏览器窗口的大小自动调 整，长度也相应变化。这种布局适合内容 长度变化较大的网页。
响应式布局
混合布局
根据不同设备和屏幕大小自适应布局，提 供最佳的浏览体验。这种布局是目前的主 流。
优化CSS和JavaScript
将CSS和JavaScript文件合并、压缩，并合理放置在HTML文档中， 以减少加载时间。
使用缓存
利用浏览器缓存、CDN缓存等技术，减少重复获取网页资源的时间。
网页制作与网站设计课程设计报告
网页制作与网站设计课程设计报告一、课程目标知识目标：1. 让学生掌握网页制作的基本概念，了解网站设计的基本流程；2. 使学生掌握HTML、CSS等网页编程语言的基础知识；3. 帮助学生了解网站架构、页面布局和导航设计等方面的知识。
技能目标：1. 培养学生运用网页编程语言进行网页设计的能力；2. 培养学生运用网页设计工具（如Dreamweaver、Photoshop等）进行网站制作的能力；3. 培养学生具备基本的网站测试、优化和发布技能。
情感态度价值观目标：1. 培养学生热爱互联网事业，增强对计算机技术的兴趣；2. 培养学生具备团队协作精神，善于与他人沟通交流，共同完成项目任务；3. 培养学生遵循网络道德规范，尊重他人知识产权，养成良好的网络素养。
课程性质分析：本课程旨在让学生了解并掌握网页制作与网站设计的基本知识，培养学生具备实际操作能力，激发学生对互联网技术的兴趣。
学生特点分析：本课程针对的是初中年级学生，他们对新鲜事物充满好奇心，动手能力强，但可能缺乏一定的编程基础和网络知识。
教学要求：1. 注重理论与实践相结合，让学生在实际操作中掌握知识；2. 采取案例教学，以实际项目为载体，提高学生的实际应用能力；3. 鼓励学生积极参与讨论，培养学生的团队协作和沟通能力。
二、教学内容1. 网页制作基础知识：HTML、CSS、JavaScript等基本概念和语法；网页结构、标签、属性等基本组成要素；网页设计规范和技巧。
教材章节：第一章 网页制作基础2. 网页设计工具：介绍Dreamweaver、Photoshop等网页设计工具的使用方法，学会使用这些工具进行网页制作和图像处理。
教材章节：第二章 网页设计工具3. 网站架构与布局：讲解网站的基本结构、页面布局和导航设计，掌握网页布局的方法和技巧。
教材章节：第三章 网站架构与布局4. 网页编程实践：通过实际操作，让学生学会运用HTML、CSS、JavaScript 等编程语言进行网页设计，培养实际操作能力。
网页制作与实训教程第六章
4.5.2 媒体对象的插入
操作步骤： 选择“设计”视图→选择插入点→“插入”→“常用”→“媒 体”→选择原文件→设置媒体参数→“确定”。
4.5.3 Flash影片的插入
插入Flash影片之前，首先应在Flash制作软件中完成影片的制作，最
好将其制作好后保存在站点相应文件夹中。 操作步骤：
绑定IP地址
选择“Web站点”子页面→“IP地址”后的下拉菜单中选择所
需用到的本机IP地址，比如本机的IP地址为“127.0.0.1”，或采用具体的IP 地址，如“192.168.0.1”。 设置主目录 选择“主目录”子页面→“本地路径”→输入(或用“浏览” 选择“文档”子页面→“添加”→“默认文档名”→
右击已存在的“默认 WEB 站点”，选择“属性”，可以看到默认
Web站点属性，其中包含“网站”、“主目录”、“文档”、“目录 安全性”等子页面。
现假设在本机配置IIS，已知IP地址，本地站点的网页放在“D:\MyWeb”目录 下，网页的首页文件名为“Index.htm”，据此建立远程站点的Web服务，发布 站点。 具体步骤如下：
文件的的链接。对文档内任意位置的文本、图像(包括标题、列表、
表、层或框架中的文本或图像)或图像局部都可以建立链接。链接目 标可以是文档内的一个位置，也可以是其他文档、图像、多媒体文
件或可下载的软件。
4.4.1 文档的位置与路径
路径通常有以下几种表示方式：
绝对路径 相对路径 根相对路径
1.绝对路径
步骤如下： （1）选择编辑窗口中的文字或图像。 （2）选择“窗口”｜“属性”命令，打开“属性面板”，单击“链接 ”文本框右边的“选择文件”图标按钮，在打开的“选择文件”对话框 中浏览并选择一个文件。 或者在“链接”文本框中直接输入要链接的文件的路径和文件名。 （3）选择被链接文件的载入目标。默认情况下，被链接文件在当前窗 口或框架中打开。要是被链接文件显示在其他地方，需要从属性面板的 “目标”下列列表中选择一个选项。
网页设计与制作- 第06章_JavaScript脚本语言
6
网页设计与制作
6.1 JavaScript概述
• 3．JavaScript的特点 • （3）动态性
– JavaScript是动态的，它可以直接对用户的操作 做出响应而无须经过Web服务器程序的处理，这 样一方面加快了响应速度，另一方面也减轻了服 务器的负担，这些都极大地增强了网页的互动性。 JavaScript对用户操作的响应是采用事件驱动的 方式实现的，比如点击鼠标、提交表单、移动窗 口、选择菜单等都可以视为事件。当某一事件发 生后，会有对应的事件处理程序负责进行处理， 从而实现相应的功能。
– JavaScript是一种基于对象和事件驱动并具有相 对安全性的脚本语言，同时也是一种广泛运用于 客户端Web开发的脚本语言，通常直接嵌入到 HTML代码中为网页添加动态功能，实现用户与 网页的交互（比如响应用户的鼠标单击操作）， 是一种动态、弱类型、基于原型、支持对象的语 言，它主要是通过<script></script>标记嵌入到 标准的HTML网页中并由浏览器负责解释和执行。 JavaScript的出现在一定程度上弥补了HTML语 言所存在的短处。当然，JavaScript也可以用于 其他场合，如服务器端编程。
7
网页设计与制作
6.1 JavaScript概述
• 3．JavaScript的特点 • （4）简单性
– JavaScript的简单性主要体现在：首先它是 一种基于Java基本语句和控制流之上的简单 而紧凑的设计，对于学习过C、C++或Java等 高级语言的人来说，学习JavaScript脚本语 言会感觉比较轻松。其次它的变量类型采用 了弱类型而非严格的强类型，也就是说， JavaScript的变量在使用前不强制要求作类 型声明，JavaScript解释器会在运行脚本的 过程中检查变量的数据类型是否合法。
第六章《网页的设计与制作》(浙教版)精品PPT教学课件
2020/12/6
9
6.2 通过邮件接收表单
表单中的信息输入完毕以后需要将信 息提供给服务器端的相关人员，用户可以 通过表单域属性面板中的“动作”属性指 定通过电子邮件接收表单数据。
在属性面板的“动作”文本框中输入 mailto:***@***.***,也就是在mailto 后面加上邮件地址。在浏览者提交表单后， 会弹出窗口询问是否继续以电子邮件形式 提交，单击“确定”按钮，浏览器会自动 2020/打12/6 开Outlook或Outlook Express，将表 10
感谢你的阅览
Thank you for reading
温馨提示：本文内容皆为可修改式文档，下载后，可根据读者的需求 作修改、删除以及打印，感谢各位小主 Nhomakorabea阅览和下载
日期：
演讲者：蒝味的薇笑巨蟹
6.插入按钮
按钮对于表单是必不可少的。按钮在 单击时执行任务，可以用于提交或重置表 单，并且可以用于触发特定的事件。
要插入按钮，将光标定位后，单击 “表单”工具栏上的“按钮”按钮，即可 插入一个按钮。
2020/12/6
8
7.插入列表/菜单
如果要显示的选项很多，为了节省空 间，可以使用菜单或列表。菜单会在弹出 式菜单中显示选项值，而且只允许用户选 择一个选项。列表会在滚动列表中显示选 项值，并允许用户在列表中选择多个选项。
5
3.插入单选按钮
要求浏览者只能从一组选项中选择一个选项 时，使用单选按钮。单选按钮通常成组地使用，在 同一组中的每个单选按钮的名称必须一致，这样整 个单选组才能有效。
要插入单选按钮，将光标定位后，单击“表 单”工具栏上的“单选按钮”按钮，即可插入一个 单选按钮。
第6章网页制作FrontPage2003
2.链接到书签 我们不仅可以用超链接的方法在多个网页之间进行跳转，也可 以在同一个页面里跳转。它的最大优点是可以使我们迅速跳到网 页的某部分。 首先要定义书签。然后就直接把超链接指向书签就可以了。 书签可以是网页中的特殊标记，也可以是网页中任何位置的字符。 但图形不能做书签。 操作方法：例如：选择作书签的字符“我的简历”， “插入”“书签” ，“书签名称”就是选择的文本名称（也可用默认名 称），确定。 在普通视图里“我的简历”被加了下划 虚线，表示这儿有一个书签。我的简 会看到 历 ； 现在我们来建立到书签的链接。选中“ 书签名称”，把它作为超链接文本，单 击“常用”工具栏“超链接”按钮，选 择书签名字即可。
• FrontPage的界面 ：与WORD有相同的界面外，还有特有的部分界面 1．在视图栏内有六种模式：网页、文件夹、报表、导航、超链接、任务 2．在“网页”视图方式下，设有“普通”、“HTML”、“浏览”三个控制按钮。 （1）“普通”方式：可以利用菜单中的命令或工具栏上的按钮来编辑网页。 （2）“HTML”方式：可以直接对网页的HTML代码进行编辑操作。 （3）“预览”方式：可以预览当前的网页，让编制者观看自己当前所作的 网页效果，不能编辑。
操作方法：单击当前网页要插入注释的位置，选 “插 入”-- “注释”命令，这样就会弹出“注释”对话框，在 “注释”文本框中输入注释的内容，单击“确定”按钮。
对象的定位
使用“查看”菜单打开“图片”工具 栏；或使用“查看”菜单的“工具 栏”→“定位”命令，激活“定位”工具 栏。选择定位对象（图片或表格或水平 线），使“图片”工具栏中的“绝对定位” 按钮 被选中（处于凹状），用鼠标移动 对象可精确定位到合适的位置。
如何设计一个简单的网页？
刚才是规划好网站的结构，现在开始网站内的网 页制作。网页是站点中最基本的文档，它是用HTML （超文本描述语言）编写的，如果你不了解HTML语言， 也没关系，FrontPage具有“所见即所得”的特性， 并自动创建HTML代码，所以，一般用户在“普通”模 式下也能直接创建出多种格式的网页。
第六章网页的设计与制作教案讲课
第六章网页的设计与制作第一节网站和网页及简单主页制作教案（第一课时）一、教学目标：知识与技能：1、了解因特网的服之一万维网2、了解什么是网页及网站，掌握组成网页的基本要素3、熟悉网页制作的几个步骤，了解制作网页的几个常用工具4、学会利用Frontpage 2000 制作简单网页主页过程与方法：对照课本上案例题，让学生上网搜索文字、图片等素材，制作一个网页，提高学生的兴趣。
情感态度与价值观：进一步理解网页作为常用的制作工具的优势和特点,培养学生动手能力二、教学要点：网页的基本要素及利用Frontpage 2000 制作简单网页。
三、教学组织：组织学生进行实践活动，探究、指导、分组协作完成任务，让学生有兴趣地在实践中找乐趣。
四、教学安排：2课时。
教学过程：一、导入新课讲解因特网的同时，引入万维网，万维网上巨大的信息量和简易的访问方法，使它迅速成为是因特网的主要应用领域一，打开淘宝网站主页，及几个网站主页，让同学们浏览这些网页，了解页面设计、网站结构、整体风格。
二、新课讲述1、新建站点：文件→新建→站点，选择只有一个网页的站点，指定站点的位置，例如:d:\myweb，将首页保存到指定的网站文件夹，并进行命名为index.htm。
2、更改标题，关键字的3、利用表格布局网页。
4、表格是网页的一个非常重要元素，Frontpage中的表格不仅可以用来陈列数据，还可以实现网页的精美排版。
5、步骤：表格→插入表格a、在表格中添加文本b 、在表格中添加图像：插入→图片→剪贴画或来自文件3、插入字幕步骤：插入→组件→字幕4、编缉文字，设置字体格式1、设置背景：格式→背景2、3、设置超链接：插入→超级链接4、链接的对象除了可以是某个网站，还可以是某个网页，甚至是一个文件。
学生自主操作，教师随常指导。
第六章网页制作基础
第六章网页制作基础网页是网站的基本组成，要想制作网站，必须学会制作网页。
有关网页制作的内容很多，不可能在短短的几课时内介绍完全，本章主要介绍网页制作的基本操作，包括网页中文字和图片等基本元素的编辑、网页的版式与布局技巧、网页中的超链接等，为下章的网站设计与制作奠定基础。
本章的学情分析可从以下几方面考虑：1．对于小学阶段能正常开设信息技术课的学生而言，此部分内容比较简单，教师可以依照教材的顺序进行教学。
2．对于网页制作是零起点的学生来说，要在规定课时内完成本章内容，会存在一定的难度。
教师需要结合补缺内容和学案进行相应的指导。
3．对于所有学生而言，进入初中后已经学习了文字编辑、图片处理、文件操作、资源管理、网络的基本知识、演示文稿中的超链接等内容，很多知识都可以迁移到本章来。
本章内容共分三节，每节都以一个小主题展开，然后围绕该主题制作一个相关的网页。
三节的内容既独立又有一定递进关系。
本章的最后设置的综合实践的板块，是对本章所学内容的综合练习，各学校可以根据自己的实际进行选择性教学。
本章的重点是网页的版式与布局技巧、书签类型的超链接。
本章的难点是网页的布局、书签超链接。
本章参考课时：3～6课时。
第3节可以根据各地实际教学情况，适当增加1课时。
综合实践2课时。
第1节网页的创建1．教学目标知识与技能★了解网页模板的作用。
★能根据需要选择合适的模板快速创建网页。
★会对网页的内容进行编辑。
过程与方法通过创设情景，激发学生的学习兴趣。
通过制作一个简单的网页，掌握网页制作的一般过程。
情感态度与价值观★体验网页模板在制作网页时的快捷。
★体验使用网页进行信息交流的乐趣。
2．重点和难点。
重点是使用FrontPage 2000自带的模板创建网页，并对网页进行编辑；难点是网页中图片的插入与编辑。
二、教法设计本节是网页制作的第一课，虽然有的学生在小学已经接触过，但掌握得并不熟练。
因此教师不能太放手，而要加强指导，尤其是学法指导。
第六章网页的设计与制作
网站和网页学情分析通过前面的学习，学生的信息素养有了较大的提高，利用信息技术解决实际问题的操作技能有了长足的进步，由于多数学生在初中没有制作过完整意义上的网页和网站，所以，对于本章的知识和技能而言，基本不存在“零起点”影响学生学习的问题。
教学目标1、了解万维网的基本架构2、理解网页的作用、掌握网页元素和网页构件的使用3、知道常用的网页制作工具教学重点：网页的元素和认识FrontPage工具软件教学难点：万维网的基本架构、网页制作工具。
课时安排：4教学准备：课件和多媒体教学过程一、课程导入同学们都上过网、前面我们也一起学习了怎么上网，因特网上的网站和网页总称就是万维网、网站的地址用URL（统一资源定位器）来访问。
二、新课：(一)、网页的基本元素主要通过对几个网页的分析，掌握文字、图形图像和超链接是网页的基本元素，而声音、表格、表单等则是网页的构件。
网页构件将网页基本元素有机的组合成一个单元以构成更为丰富多彩的网页。
（二）、制作网页的常用工具网页制作的方法主要有两种：直接用“超文本标记语言”制作网页，或者使用专门的工具软件来开发网页。
1、直接用“超文本标记语言”制作网页 HTML源代码有网络浏览器解释执行、用文本编辑器可以制作如记事本、对制作者要求较高、要熟悉编程语言才行。
2、使用专门的工具软件来开发网页 FrontPage和dream waver（三）、简单网站的设计和制作流程1、确定目标和需求分析2、策划制作方案3、收集与整理素材4、合成与测试网页5、发布（四）、制作网页一、认识FrontPageFrontPage是微软公司开发的网页制作和网站管理工具。
工具具有“所见即所得”功能,Web创作人员直接对Web页面进行编辑修改，并且能立即看到Web 页面的显示效果。
FrontPage 2003具有强大的网站管理功能，是一款方便而又实用的Web站点的发布与维护工具，主要功能有：（1）建立站点（2）站点文件管理功能（3）网页导航管理功能（4）任务管理功能（5）网站发布与维护功能FrontPage的启动与退出1、创建站点首先应当根据其用途规划站点，确定站点的结构，并在本地磁盘上创建站点以存储制作完成的网页及其他相关文件。
第六章网页的设计与制作
第六章网页的设计与制作本章学习要求如下表：一、网页、的基本概念TCP/IP：传输控制协议和互联网协议的总称。
TCP协议的全称叫做传输控制协议；IP协议指的是互联网协议(World Wide Web)，也可以简称为Web，万维网。
Http(Hyper Text Transfer Protocol：超文本传输协议，浏览WWW网页时采用的协议。
URL（Uniform Resoure Locator）:统一资源定位器或统一资源地址。
HTML（Hyper Text Markup Language）：超文本标记语言，编写网页的语言。
二、网页的基本元素网页的三种基本元素：文字、图形图像和超，网页还可以使用“表格”、“表单”、“音乐”和嵌程序等构件，起到美化网页、双向交流的作用。
1、文字：表达信息的基本工具，可以设置不同的字体、字型、大小和颜色。
2、图形图像：增加视觉效果，使信息表达更直观。
3、超：使整个因特网的资源可以方便地相互。
4、其他：表格、表单、音乐等三、网页制作工具1、用“超文本标记语言”制作网页理论上来说利用HTML可以编写任何复杂的网页，还可以利用专门用于网页的脚本语言如VBScript、JavaScript等，但是对于网页初学者要完全掌握HTML有很大难度。
2、用网页制作工具软件制作网页⑴ FrontPage：微软公司开发的专门网页制作软件，具有和OFFICE系列类似的操作界面，非常适合初学者学习。
⑵ Dreamweaver:MacroMedia公司开发专业网页制作软件。
四、网页制作1、制作基本步骤：确定目标与需求分析--策划制作方案--收集与整理素材--合成与测试网页--发布2、制作和编辑网页1）编辑文字、图片、水平线、动态字幕、表格（包括单元格、行的插入与删除、单元格的合并与拆分）2）修改单元格属性（包括对齐方式及单元格背景的设置）、表格属性（包括对齐方式、表格边框及表格背景的设置）、网页属性（包括网页标题、背景音乐、网页背景的设置）。
网页的设计与制作课件
(2)网页的基本元素
网页的内容有三种基本元素：文字、图形 图像和超链接。网页还可以使用“表格”、 “表单”、“音乐”和内嵌程序等构件，起到 美化网页、双向交流的作用。
(3)网页制作工具
常用的网页制作软件： FrontPage Dreamweaver. 记事本 网页中使用的图像可以有许多格式，常 见的静态图像格式有JPEG和GIF两种
各机构名和顶级域名的含义？ 第一类是类别顶级域名，共有7个： .com（用于商业公司）； .net（用于网络服务）； .org（用于组织协会等）； .gov （用于政府部门）； .edu（用于教育机构）； .mil（用于军事领域）； .int（用于国际组织）。 第二类是地理顶级域名，共有243个国家和地 区的代码，例如.CN代表中国，.UK代表英国
流式视频图像格式(流媒体)： RM、WMV、MOV
网页制作
(1)网页策划与构思 网站的策划与构思主要考虑因素有：网 站名称是否贴切，网站主题是否鲜明，网站 内容是否丰富，以及网站结构是否清晰等。
(2)素材的收集与整理 素材的收集与整理需要做到： ①将收集到素材按照不同的类别，分别保 存在不同的文件夹中。 ②对收集的素材应该重新取一个合适的文 件名，以方便使用。 ③对有些图片可能需要进行格式转换处理， 网页上常用GIF或JPEG格式。 ④可能需要从某些图片中截取部分画面生 成新的图片。 ⑤视频素材在使用前需要进行一些编辑处 理，如将格式转换成流媒体格式(RM、WMV)。
典型题目：
1．用来描述网页中的文本、图像、 超链接和表格等基本元素的语言是 ( ) (A)BASIC (B)Pascal (C)HTML (D)FrontPage
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第六章网页的设计与制作本章学习要求如下表：一、网页、网站的基本概念TCP/IP：传输控制协议和互联网协议的总称。
TCP协议的全称叫做传输控制协议；IP协议指的是互联网协议Wide Web)，也可以简称为Web，万维网。
Http(Hyper Text Transfer Protocol：超文本传输协议，浏览WWW网页时采用的协议。
URL（Uniform Resoure Locator）:统一资源定位器或统一资源地址。
HTML（Hyper Text Markup Language）：超文本标记语言，编写网页的语言。
二、网页的基本元素网页的三种基本元素：文字、图形图像和超链接，网页还可以使用“表格”、“表单”、“音乐”和内嵌程序等构件，起到美化网页、双向交流的作用。
1、文字：表达信息的基本工具，可以设置不同的字体、字型、大小和颜色。
2、图形图像：增加视觉效果，使信息表达更直观。
3、超链接：使整个因特网的资源可以方便地相互链接。
4、其他：表格、表单、音乐等三、网页制作工具1、用“超文本标记语言”制作网页理论上来说利用HTML可以编写任何复杂的网页，还可以利用专门用于网页的脚本语言如VBScript、JavaScript等，但是对于网页初学者要完全掌握HTML有很大难度。
2、用网页制作工具软件制作网页⑴ FrontPage：微软公司开发的专门网页制作软件，具有和OFFICE系列类似的操作界面，非常适合初学者学习。
⑵ Dreamweaver:MacroMedia公司开发专业网页制作软件。
四、网页制作1、制作基本步骤：确定目标与需求分析--策划制作方案--收集与整理素材--合成与测试网页--发布2、制作和编辑网页1）编辑文字、图片、水平线、动态字幕、表格（包括单元格、行的插入与删除、单元格的合并与拆分）2）修改单元格属性（包括对齐方式及单元格背景的设置）、表格属性（包括对齐方式、表格边框及表格背景的设置）、网页属性（包括网页标题、背景音乐、网页背景的设置）。
3）对文字或图片制作超链接制作指向本站的超链接制作指向Internet的超链接制作指向电子邮件的超链接第六章《网页的设计与制作》练习题一、单项选择题(每题1分)1、以下不能用于制作网页的软件是( )A：DreamWeaver B：FrontPage C：NotePad D：RealPlay2、下列扩展名所表示的文件不可能是网页文件的是( )A：htm B：asp C：rar D：php3、下列多媒体信息无法直接应用到网页中的是( )A：图形 B：音乐 C：可执行文件 D：视频4、下列对象无法设置超链接的是 ( )A：表格 B：图片 C：文字 D：按钮5、下列关于网页元素图片的使用观点中，不正确的是 ( )A：图片可以直观形象地表达某些信息B：图片可以美化网页，吸引浏览者的眼光C：图片可以跨越语言障碍表达某些信息D：图片是网页必备元素6、网页制作时，能对网页中的元素和构件进行准确定位的是 ( )A：表单B：表格 C：网页特效 D：超链接7、一张风景图片的文件格式是BMP，为了将它集成到网页中，需要把该图片有损压缩成JPG 格式，下列软件中，具有这种功能的是( )A：画图 B：Word C：Excel D：FrontPage8、为了让世界各地都能正确的浏览网页，下列字符中，不能用来对网站中文件或文件夹命名的是( )A：英文字母 B：下划线C：汉字 D：数字9、下列项目中，不能作为超链接指向目标的是 ( )A：文件 B：文件夹 C：电子邮件地址D：网页书签10、在地址栏中输入网址时，可以省略HTTP协议而直接输入网址，这个HTTP协议的中文名称是( )(A)文件传输协议 (B)电子邮件协议 (C)新闻讨论组协议(D)超文本传输协议11、为了加快页面的下载速度，在网页中一般使用（）格式的图片文件。
A. BmpB. Gif 或JpgC.TgaD.Tiff12、网页的基本元素是( )(A)网址、色彩和内容 (B)文字、色彩和内容(C)文字、图形图像和色彩(D)文字、图形图像和超链接13、在FrontPage2000中，下列关于表格的说法，错误的是（）。
A.如果表格的大小以像素为单位，那么无论网页的大小是多少，表格的大小都会维持不变B.如果的大小是浏览器窗口大小的百分比，那么无论网页的大小是多少，表格的大小都会维持不变C.如果未指定表格的高度和宽度，则表格的大小将根据内容而定D.如果表格显示在框架中，则其大小根据框架大小的百分比而非整个网页大小的百分比而定14、在网页中观察超链接存在与否，最直接的方法是（）。
A.观察文字是否有下划线B.观察图片是否加框C.将指针指向文字或图片，观察指针是否变成手形D.观察文字的颜色15、在机关工作的小王想学习网页制作技术，你向他推荐的软件是( )(A)Word (B)Excel (C)FrontPage (D)Photosh op16、网页文件的扩展名为（）。
A.DocB.HtmC.XlsD.Mpg17、下列操作中，（）不能关闭FrontPage2000。
A.单击"关闭"按钮B.单击"文件"菜单中的"关闭"C.单击"文件"菜单中的"退出"D.双击标题栏左边的控制菜单框18、在FrontPage2000中的（）视图可以直接制作网页。
A.网页视图B.文件夹视图C.报表视图D.超链接视图19．浏览网页过程中，鼠标移动到超级链接上时，其形状一般为：( )A．I形B．小箭头形 C．小手形D．沙漏形20．在制作网页时，电子邮件的超级链接类型应设置为：( )A．mailto：B．URL： C．http：D．ftp：21、小芳在网页制作中打开了如下图所示的表格属性设置对话框，你认为她可以完成下列操作中的① 表格对齐方式改为水平居中② 表格背景颜色设置为粉红色③ 给单元格设置不同背景图片④ 给单元格添加不同边框颜色。
(A)①②(B)③④(C)②③(D)④①22．下列表示指向电子邮件的超链接地址是( )(A)\image\school\master.htm (B)(C) (D)maito:23．小慧准备制作一个指向本地计算机文件的超级链接，在选取了要设置超链接的文字后打开了如下图所示的“创建超链接”对话框。
你认为她要找到该目标文件，在图中应该单击的按钮编号是( )(A)1 (B)2 (C)3 (D)426、仙居中学资源中心由很多网页组成，这些网页主要通过( )连接在一起的。
A、网址B、E-mail地址C、超级链接D、表格27、下列文件中，最可能是网站首页文件的是( )。
A、default.txtB、index.docC、index.htmD、首页.htm28、在因特网上建设网站，一般可分为3个步骤:①上传发布; ②网站规划; ③网页制作，正确的顺序是( )。
A、③②①B、②③①C、①③②D、①②③"29、在Windows中，用于浏览网页的程序图标是( A )。
30、用FrontPage2000制作网页，在如下图所示的对话框中，创建电子邮件超链接的是( C )。
31、在Front Page2000的“表格属性”对话框中，要使制作的表格看不见边框，则（）。
A、单元格边距设置为0B、边框颜色设置为无色C、单元格间距设置为0D、边框粗细设置为032、用Front Page2000制作网页时，下列说法不证确的是( )。
A、“使用格式刷”按钮可以方便地复制动态效果B、使用复制的方法可以建立多个悬停按钮C、中国的网站都不接受免费个人主页申请D、正是有了超链接，各种各样的的网页或网站才被紧密地联系在一起33、Front Page2000，超文本语言称为( )。
A、主页B、网页C、网站D、HTML语言34、在Front Page中，保存带有图像的网页时，下面说法正确的是( )。
A、自动将不是GIF和JPG格式的图像转成GIF格式B、自动将不是GIF和JPG格式的图像转成JPG格式C、根据情况，自动将BMP、PCX等格式的图片保存为GIF或JPG格式的图像D、根据情况，自动将其他所有格式的图片保存为GIF或JPG格式的图像35、在FrontPage2000插入图片时不提倡使用的格式是( )。
A. JPGB. GIFC. PNGD. BMP36、下列哪种说法不正确？( )A. 在网页中可插入视频文件B. 在网页中可插入音频文件C. 在网页中不能同时插入视频文件、音频文件D. 在网页中可插入图像文件37、在FrontPage2000中，网页模板的作用是( )。
A. 新建一个空白网页B. 新建一个已预先按要求设计好的网页C. 链接外部一个已存在的网页D. 插入外部一个已存在的网页38、在FrontPage2000中，插入表格的目的一般是为了( )。
A. 是为了能在网页中插入图片B. 是为了能在网页中插入声音C. 是为了能在网页中插入视频D. 是为了能在网页中控制文字、图片等在网页中的位置39、在FrontPage2000中，能完成图片相互转换的格式是( )。
A. GIF，JPEG，PNGB. GIF，BMP，JPEGC. GIF，BMP，PNGD. GIF，PNG，PSD40、在FrontPage2000若要将某一段落选为操作块（亮带），则需要在该段落里( )。
A.单击鼠标双键B. 单击鼠标C. 连击鼠标三次D. 双击鼠标41、要在文档中插入图片，也可以通过( )。
A.剪切B.复制C.粘贴D. 复制和粘贴42、利用FrontPage 2000在网页中插入背景音乐，下列几种音乐格式中，( )不被支持。
A. WaveB. MidiC. AuD. MP343、关于网页的说法错误的是( )_。
44、在FrontPage2000中预览一个网页时，( )。
A. 所有的超级链接都不能发挥作用B. 与在浏览器中观看的效果相同C. 双击一个对象可以编辑它D. 可以在右键快捷菜单中修改它的属性45、关于表格各个单元格，下面的说法错误的是( )。
A. 表格的每个单元格可以有不同颜色的文本B. 表格的每个单元格必须使用相同格式的文字C.可以在表格的单元格中使用超级链接D. 可以在表格的单元格中使用图片46、在下面的( )种情况下不能随意设置页面的背景。
A. 使用了主题样式B. 使用了表格C. 超级链接D. 插入了图片之后47、关于HTML文件中的超级链接，( )说法是错误的。
A. 可以链接到一个特定的网址B. 可以链接到一个e-mailC. 可以链接到一个文件D. 不能链接到当前网页中的一个特定位置48、使用FrontPage2000创建网页，( )说法是错误的。