第一篇：《我的网页》教案
《我的网页》教案
教学目标：
知识目标：
1）学会在网页中插入和设置水平线； 2）学会在网页中插入和设置图片； 3）学会保存带图片的网页； 技能目标：
1）培养学生的动手能力； 2）培养学生自主学习的能力；
3）培养学生发现问题、分析问题、解决问题的能力； 情感目标：
1）在教学中培养学生的审美情趣； 2）激发学生的想象； 3）培养学生间的合作精神；
教学方法：任务驱动法、自主探究法、演示法；
教学重点：本课教学重点是在网页中插入水平线和图片，以及保存带图片的网页； 教学难点：本课的教学难点是图片的设置以及带图片的网页的保存； 教学课时：1课时
教学准备：比较好的学生的作品以及四个自己制作的网页
网页
一、只包含纯文字。（文字中要有一主题，介绍的是学生熟悉并感兴趣的人或事物，如可介绍他们任课的老师，一般学生对自己的老师总是很感兴趣，或学生中比较有威望的同班同学，或者是一个动画人物：柯南，火影忍者，樱木„„）
网页
二、比上增加水平线。网页
三、比上增加图片。
网页
四、比上对水平线及图片作了相应的设置。
教学过程：
任务
一、在网页中插入和设置水平线 创设情境、导入课题
将事先准备好的学生的作品展现给大家，师问：同学们漂亮吗？ 生答：漂亮。
师： 你们知道这是谁做的吗？大家一定想不到吧，这是和你们同龄的同学的作品（激发学生的学习热情，让他们感到网页的制作也并不是那么的困难，增强他们的信心，既然别的同学能做出来，那么我为什么不能呢！）
师：上几节课我们对网页已经有了初步的认识了，我们知道在网页中可以插入文字，但是和我们在网上看到的网页相比，我们自己做的实在太单调，太难看了，师问：同学们想不想让自己的网页也像这位同学的那么漂亮呢？ 生答：想。
师：好，那么从今天开始我们就要来打扮我们自己的网站了，师：（将事先准备好的网页一，网页二打开）“找出不同点”（从而顺利引入本次任务。）生：多了一条线
师：有和没有有什么不一样，（这条线的功能），线是怎么来的？（学生可能有不同的回答比如是画出来的，或者也有同学知道水平线功能的，让同学上来到教师机演示-教师适当的称赞学生）
师：将控制权交给学生，按照事先分好的小组，让学生自主探究，并完成课后练一练第一题。
（在此过程中教师要巡视教室，观察学生完成情况，对个别进行指导）
学生大部分完成后，选择完成的比较好的学生，让此学生来说明步骤，教师适当的补充。任务
二、在网页中插入和设置图片（将事先准备好的网页
二、网页三打开）
师：同学们都做的非常的好，现在再来“找出不同点”。生：多了图片
师：要想我们的网页变得漂亮，怎么能少得了图片呢，那么这个图片又是怎么贴上去的呢？（学生中可能会有知道的，如果回答不出来的可以给个提示：在网页中插入图片的方法与word相同。请同学讲一下在word中插入图片的方法）
师：现在给你们几分钟时间，看谁厉害能把图片插入进去。
在这一环节学生碰到的问题可能比较多，在巡视过程中要适时的给予学生帮助:提示同学在哪里找到“图片”工具栏。并鼓励学生对各种效果的尝试。
根据学生实际完成情况：如有学生弄得比较漂亮的，让学生上台演示，老师适当补充；若学生完成情况不是很理想的，老师要总结一下，讲明几个常用的设置：在图片上写文字，旋转和翻转图片，裁剪图片，设置透明色，选定按钮等。
展示网页四，让学生有个对比，给学生一点时间，分组讨论，对各自己的网页做最后的修改和补充。
任务
三、保存带图片的网页并总结
师：（最后在下课前评选出几组较好的，对他们进行表扬）同学们，经过你们自己的努力，你们的网页已经变得比较漂亮了，今天我们这节课主要是用什么手段装扮了我们的网页？
生答：水平线和图片
师：对，非常好，我们今天主要学习了打扮网页的两种手段：在网页中插入水平线和图片。我们以后还会学更多的打扮的手段，把我们的网页化得更漂亮，那么怎么样保存起来以便我们下次再使用呢？
生答：点保存按钮，或者是“文件”→“保存”（这一步一般学生都能回答出来的）师：（按学生说的步骤演示）跳出一个“保存嵌入式文件对话框”，教师作惊奇状，哎，为什么呢？（学生可能回答的出来，也可能回答不出，对前一种情况只要按学生的说法顺势将图片的保存几个知识点说一下，若没有学生回答出来，教师可自问自答：哦，原来在制作网页的时候如果有图片插入的话，对图片也要进行保存，那么图片保存在哪里呢？）
教师先不作修改，直接按确定以后，关闭网页，让学生寻找刚才保存过的网页，最后发现在什么都不改动的情况下，保存在“images”文件下（对于站点），再打开网页，说明各个设置。
第二篇：下载网页教案
下载网页教案
一、学习目标：
(1)学会下载网页的方法。
(2)学会移动文件（文件夹）的方法。
(3)以教师演示讲授、引导启发和学生讨论尝试、自主学习相结合的方式，学会在因特网上下载有用的网页。
(4)通过导入展示的精美网页激发学生学习下载网页的兴趣，并进一步提高学生使用信息技术的能力。
(5)在保存图片的自主探究中，培养学生发现问题并自我解决问题的能力，提升学生的自学能力。
二、教学重点、难点：
1、学会下载网页和移动文件（文件夹）的方法。
2、保存网页后应该有两个文件，复制操作和移动操作的区别。
三、教学过程：
（一）导入
师：同学们，我们先一起来欣赏一些网页吧！这些网页好看吗？同学们一定非常想保留下来吧？好！今天我们就来学习下载网页！（出示课题）
（二）新授
1、下载网页
师：如果我们作为小小老师，向别人介绍中国儿童资源网的时候，能把完整的网页也呈现给大家，那同学们就更容易理解了。回忆一下我们前面学习的下载图片和下载文字的方法，那么能不能把网页完整的下载下来，即使在断开网络时也能看到完整的网页呢？
师停顿，生沉思片刻
生回答上台演示
一生：首先全部选定
一生准备按住鼠标左键全部拖动 有学生插嘴：按Ctrl+A 一生用自己方法选定后，又尝试了Ctrl+A，非常成功，然后复制，打开Word文档，粘贴。
师：非常棒！XX学生用了我们前面下载文字的方法复制了网页中所有的内容，真会学以致用但是，我们小朋友仔细观察一下，用这种方法，有没有把网页中所有内容完整保存下来。
生讨论回答，找出不同之处。师：那么怎么办呢？ 二生：把它添加到收藏夹
师：我们一起回忆一下，在哪儿用过“添加到收藏夹”
生回答
师小结：添加到收藏夹是帮助我们快速访问网站的方法，不是把网页下载到我们计算机里。
三生：文件——另存为
师强调保存类型
师让学生掌声鼓励操作正确的三生。
我们来看看保存好的网页，和前面下载文字的文件有什么不同吗？出现了两个文件，一个是网页文件，一个是同名文件夹。这个文件夹里有些什么文件？（学生可以点击文件夹浏览）
如果这个文件夹不见了，或者网页文件放到了其他文件夹里，又会怎样？（如果有学生发生这样的问题也可以由学生提出）自己尝试一下，然后和小组同学交流或者翻看书本，把你的交流结果告诉大家。
讨论保存网页的要领。
好，下面同学们自己来试一试，查找我们江阴一个景点的网页，然后把网页保存到“我的文档”里。
师生解决操作中遇到的问题。
2、移动文件和文件夹。（打开网页文件夹，用缩略图方式显示图片）这是刚才下载的网页中的图片，很漂亮，老师很喜欢，想把它放入自己的文件夹里，可以怎么办呢？（复制文件）（前面有复制文件（文件夹）的基础）
师让学生独立完成移动文件（文件夹）的操作 四人一小组讨论移动的方法 组内汇报演示
学生的汇报实在精彩，方法多种多样
1、按右键剪切——粘贴
粘贴的方法（1）直接在文件夹上按右键粘贴
（2）打开文件夹后粘贴
2、直接拖动
3、在菜单栏上选择“移动到文件夹”
两人合作探究选定多个文件的方法，教师提示两个功能键Ctrl，Shift 学生汇报
1、不连续的选定Ctrl
2、连续的选定Shift
3、用鼠标框住 误操作带来的意外发现
生：按住Ctrl健选定多个文件，不小心进行了“拖动”操作，复制了多个文件。
师总结： shift：按住shift键，把鼠标指针指向最后一个要选定的文件，然后单击，就可以选定首尾两个文件之间的所有文件。被选中的文件都是以蓝底白字显示。（广播演示）ctrl：选定不连续的文件
学会这几种选定文件的方法，有再多的文件要选定我们都不怕了。下面请同学们将下载的网页文件夹里的图片移动到你的文件夹里。
小结：我们可以用复制或移动的方法把文件放入其他的文件夹里，也可以同样的操作把文件夹复制或移动到其他的文件夹里。
3、比较。
刚才我们用了两种方法把文件放进自己的文件夹里，那到底复制文件和移动文件两种操作有什么不同呢？（学生归纳总结）
三、总结。
通过今天的学习，你有了哪些收获呢？希望同学们在以后的操作中，灵活运用我们今天学到的知识！
第三篇：网页教案
三、DW安装应用
在学网页创建中，有一款非常重要的软件叫ＤＷ软件，它件全称：Ｄreamweaver，被称为网页三剑客之一． ＤＷ软件学习内容： １.ＤＷ软件下载安装
２.创建ＨＴＭＬ文档和ＣＳＳ样式表并将二者关联起来 ３.ＤＷ软件的应用 Ａ.ＨＴＭＬ文档的创建 １.打开ＤＷ软件
２.如果想创建一个ＨＴＭＬ文档，只要点击“新建”下面的ＨＴＭＬ，这个就完成了一个ＨＴＭＬ文档的创建。
３.在当前页面点击“代码”，就可以看到我们新建一个ＨＴＭＬ文档的时候，包括“声明”、“标签”、“根元素”还有
标签及里面的第四篇：网页制作教案
网页制作与设计教案
第一讲 网页设计概述....................................................................................................................3 1.1WWW和URL.....................................................................................................................3 1.2IE5的使用............................................................................................................................3 1.3 网页中所使用的技术............................................................................................................4 1.4 制作网页的基本方法............................................................................................................4 第二讲 HTML的基本标志与格式标志.......................................................................................4 2.1 HTML文档的基本结构.........................................................................................................5 第三讲 HTML的文本、图片与超级链接标志...........................................................................5 2.2 插入文字................................................................................................................................6 2.3 插入图片................................................................................................................................8 2.4 建立超级链接........................................................................................................................8 第四讲 HTML表格、表单与框架标志.......................................................................................9 2.5 插入表格................................................................................................................................9 2.6 表单的应用..........................................................................................................................10 2.7 框架窗口..............................................................................................................................10 第五讲 HTML标志综合运用案例.............................................................................................11 第六讲 DREAMWEAVER中简单WEB站点建立与管理.....................................................12 3.1 DREAMWEAVER概述............................................................................................................12 第七讲 DREAMWEAVER中静态网页设计.............................................................................13 3.2 在页面中加入文字和图像..................................................................................................14 3.3 超级链接的运用..................................................................................................................14 3.4.表格的应用.........................................................................................................................14 3.5.在网页中创建表单.............................................................................................................15 第八讲 DREAMWEAVER中动态网页设计.............................................................................15 第九讲 DREAMWEAVER综合性网页设计案例.....................................................................16 第十讲 VBSCRIPT概述.............................................................................................................17 4.1 VBSCRIPT语言简介.............................................................................................................17 第十一讲 VBSCRIPT的基本元素与输入输出.........................................................................18 4.2.基本数据类型.......................................................................................................................18 4.2.表达式和运算符.................................................................................................................19 第十二讲 VBSCRIPT的条件语句、循环语句和过程.............................................................20 4.3 VBSCRIPT基本语句.............................................................................................................20
第一讲 网页设计概述
【教学内容】
讲解网页设计的相关术语及网站制作的基本流程。【教学目的】
使学生对网站及网页有一定的认识，激发学生学习网页设计的兴趣。【教学重点】
网页设计中的若干术语。【教学难点】
理解网页设计中的若干术语。【教学方式】
讲授式、讨论式、案例分析式。【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《Internet 网页工场》Wittime工作室 重庆出版社。
3、《WEB网站设计》Joel Sklar著 高等教育出版社。
4、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
1.1 WWW和URL 1.1.1 Web的起源
Web是World Wide Web的简称，一般也称之为WWW或3W 1.1.2 Web的特点和结构
Web最大的特点是使用了超文本（Hypertext）WWW采用C/S（客户机/服务器）工作模式
在浏览器和服务器之间应用HTTP（Hyper Text Transfer Protocol，超文本传输协议）作为网络应用层通信协议 1.1.3 URL URL的完整格式
协议://主机名或IP地址：端口号/路径名/文件名
1.2 IE5的使用
Web浏览器是浏览Internet资源的客户端软件
在Windows环境下使用的浏览器主要有Internet Explorer、Netscape Navigator、Mosaic等
1.2.1 IE5的界面 1.2.2 IE5的使用
列表标志的使用。【教学方式】
讨论式、案例分析式、练习式。【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《WEB网站设计》Joel Sklar著 高等教育出版社。
3、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
2.1 HTML文档的基本结构
2.1.1 HTML语法
1、双标记
语法：
<标记>内容
2、单标记 语法：<标记> 最常用的单标记是
3、标记属性 语法
<标记
属性1 属性2 属性3 … > 例子
4、注释语句 格式
例子
2.1.2 HTML文档的基本结构 【课后小结】
通过本次课的学习,要求能熟练掌握网页面的基本标志与格式标志,并能灵活运用 列表,有序列表,无序列表标志及属性。
第三讲 HTML的文本、图片与超级链接标志
【教学内容】
讲解HTML标准中的文本、图片与超级链接标志 【教学目的】
* 使学生了解标题元素,掌握字体,上下标,及特殊字符的标志。
< EM>......，强调文字，通常用斜体。
< STRONG>......，特别强调的文字，通常用黑体。
......，以等宽体显示西文字符。
......，使文字大小相对于前面的文字增大一级。
......，使文字大小相对于前面的文字减小一级。......，使文字成为前一个字符的上标。......，使文字成为前一个字符的下标。
文本修饰 2.2.7
预格式化文本 使用预格式化标记
不再忽略在此之间的空格、制表符与回车符等元素 2.2.8 转义字符与特殊字符
一般转义符都是以“&”开始，以“；”结束，一个转义符之间不能有空格 2.2.9 文本强制换行和不换行 文本强制换行
不换行
标记
属性：Width，Size，Align，Noshade，color 2.2.11 使用列表
1、无序列表
- 列表条目1
- 列表条目2......
2、有序列表
- 列表条目1
- 列表条目2......
3、定义列表
- 列表条目1
- 条目1的说明
- 列表条目2
- 条目2的说明 ……
...... 2.4.4 图像地图 【课后小结】
本节介绍了在网页中加入文本、图片和超级链接的标志与相应属性，熟练运用这些标志是制作多媒体网页的基础。超级链接标志中，书签链接是一类特殊的链接方式，理解和使用书签链接学习HTML中超级链接标志的难点。
第四讲 HTML表格、表单与框架标志
【教学内容】
讲解HTML中制作表格、表单与框架的标志。【教学目的】
使学生掌握简单表格、表单与框架的制作。【教学重点】
* 表格中单元格的合并以及表格嵌套和叠加操作。* 框架的嵌套使用。* 表单元素标志与属性。【教学难点】
* 理解表格属性rowspan与colspan的含义以及表格嵌套实现的基本思想。* 理解框架属性name、target的意义。
* 理解表单中相应元素对应标志及属性的含义。【教学方式】
案例分析式、项目教学 【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《WEB网站设计》Joel Sklar著 高等教育出版社。
3、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】
2.5 插入表格
2.5.1 在网页中插入表格
表格的基本构成元素：表头，单元格，列，行
| 第一行第一列 | 第一行第二列 |
| 第二行第一列 | 第二行第二列 |