网页中添加文字及图片──丰富网站的内容》教学设计

网页中添加文字及图片──丰富网站的

内容》教学设计

#TRS_AUTOADD_1249890715428{

MARGIN-TOP:0px;MARGIN-BOTTOM:0px

}

#TRS_AUTOADD_1249890715428P{

MARGIN-TOP:0px;MARGIN-BOTTOM:0px

}

#TRS_AUTOADD_1249890715428TD{

MARGIN-TOP:0px;MARGIN-BOTTOM:0px

}

#TRS_AUTOADD_1249890715428DIV{

MARGIN-TOP:0px;MARGIN-BOTTOM:0px

}

#TRS_AUTOADD_1249890715428LI{

MARGIN-TOP:0px;MARGIN-BOTTOM:0px

}

/**---JSON--

{"":{"margin-top":"0","margin-bottom":"0"},"p":{" margin-top":"0","margin-bottom":"0"},"td":{"margi n-top":"0","margin-bottom":"0"},"div":{"margin-to

p":"0","margin-bottom":"0"},"li":{"margin-top":"0 ","margin-bottom":"0"}}

--**/DIV.MyFav_12P.MsoNormal{TEXT-JUSTIFY:inter-i deograph;FONT-SIZE:10.5pt;MARGIN:0ccpt;FONT-FAMIL Y:"TimesNewRoman";TEXT-ALIGN:justify}DIV.MyFav_12 LI.MsoNormal{TEXT-JUSTIFY:inter-ideograph;FONT-SI ZE:10.5pt;MARGIN:0ccpt;FONT-FAMILY:"TimesNewRoman ";TEXT-ALIGN:justify}DIV.MyFav_12DIV.MsoNormal{TE XT-JUSTIFY:inter-ideograph;FONT-SIZE:10.5pt;MARGI N:0ccpt;FONT-FAMILY:"TimesNewRoman";TEXT-ALIGN:ju stify}DIV.MyFav_12DIV{page:}DIV.MyFav_12L{MARGIN-BOTTOM:0cm}DIV.MyFav_12UL{MARGIN-BOTTOM:0cm} 【教材使用】宁教厅审定山东教育出版社出版软件FrontPage2000

【适用年级】8年级

【适用单元】网页制作第2大节

【教材分析】

教材中本节的内容分为三部分：一是新建网页；二是添加图片；三是添加背景音乐。第一部分新建网页是本章节的重点部分，使用导航栏建立网页也是本章节中的难点；第二部分给建立好的网页添加文字和图片信息将做为一节课的内容；第三部分背景音乐和下一节的网

页的背景合成一节课内容，这样便于学生的理解和掌握。

本节是第二部分为网页添加文字及图片，它是网页

中的两大基本要素。文字部分在教材中没有提及，上节

添加的网页是空白的，而在实际操作过程中网页中是没

有文字的，因此在这儿必须给学生时间添加文字，结合

前面学习的网络搜索让学生上网搜索信息，使前后知识

充分结合起来，而后才能添加图片，达到图文并茂。

【学情分析】

学生已经学会了新建网页，建立的网页是空白的，

学生就有“为空白网页添加文字及图片信息”的欲望，

结合因特网知识让学生为自己创建的网页添加所需的信息，添加图片的技能学生已经在Word文字处理软件中学习过，因此本节课知识，学生可以自主学习。

【教学目标】

1．知识目标

（1）掌握为网页中添加文字信息的不同方法。

（2）掌握为网页中添加图片信息的方法。

2．技能目标

通过学生自主学习过程中，掌握为网页中添加信息

的不同方法。

3．情感目标

（1）通过为网页添加文字信息的学习，培养学生的

综合运用知识的能力。

（2）利用插入图片知识，培养学生的图文并茂整体布局网页的综合信息素养能力。

【教学重点与难点】

学习嵌入式保存素材的方法和分类管理素材的能力。

【课时安排】2课时

【教学方法】任务驱动法

【课前准备】软件FrontPage2000多媒体广播系统

【教学设计】

第一课时为网页添加文字信息

教学过程

教师活动

学生活动

教学意图

一、导入部分

（教师打开上节课站点中新建的网页进行广播展示……）问：大家观察我们上节课使用导航栏添加的网页，网页

中缺什么？

网页中表达信息最常用的就是文字和图片，这节课我们

就来给网页添加文字和图片。

（板书：网页中添加文字和图片）

学生观察后回答：网页中缺文字、图片内容。

直接摆出新建网页后的情况，激发学生为网页添加信息。

二、给网页中添加文字的不同方式

网页中表达信息的主要还是文字。（板书一、添加文字：）大家来看我们主页中的文字，是大家自己录入的。（广播展示……）

（板书1．录入法：）

但是，这种方法对大家来说是比较费劲的，在我们组织

网站时会准备一些电子资料，我们可以借用现有资料。（板书2．使用现有电子资料：）

（任务一：）大家通过“网上邻居”打开教师机的“我的家乡”的文字资料，看看你的网页中需要哪些，可以将

这些文字信息放入到自己的网页里。

教师进行辅导……

教师小结方法：

（1）可以使用最基本的复制粘贴办法来解决；（2）当文档中的文字资料都需要时，可以使用“插入文件”命令

来完成。

（引）在刚才，大家给网页添加了一些文字信息，可是有许多网页所需要的信息并没有，怎么办呢？

网络中有许多信息，借助网络可以搜索到自己所需要信息。

（板书3．网络搜索法：）

（任务二：）大家可以借助网络查找自己所需要的资料，但是有的资料不一定立即就用到，因此建议大家在“文件夹列表”窗口建立一个网络资源的文件夹，可以分文字、图片等不同类，将找到的信息可以暂时放在这些文件夹中；用到的可以直接复制到网页中。

教师进行辅导……

学生观察理解……

学生实践……

回答：利用网络上网搜索

学生实践……

添加文字就直接的办法就是录入。

引导学生使用现有资料，复习复制粘贴操作。

（1）指导学生正确合理地使用网络资源，通过网络查找到信息，分类存放在资源包中。

（2）用到了才是学生最需要的，因此将第1节课准备工作中“网络资源”文件夹放在这里进行，用来收集网页的素材。

三、小结

通过这节课的学习大家都明白网页中所需文字资料如何获取了吗？都有哪些途径？

学生自己总结……

学生对自己所学知识进行汇总。

第二课时为网页添加图片信息

教学过程

教师活动

学生活动

教学意图

一、导入部分

（教师打开上节课站点中新建的网页进行广播展示……）网页中有了文字，我们能不能添加一些相应的图片来烘

托一下主题，使网页变得图文并茂，更具有感染力？

回答：可以。

直接导入

二、添加图片

（任务一）组成网页的第二大元素就是图片，大家结合课本P69完成主页中添加宁夏地区图的操作。

教师进行辅导……

叫一位出错的学生上来操作，其他同学给他找原因及解

决的办法。

教师小结知识点：

打开图片对话框后，要使用“从计算机上选择一个文件”按钮；

保存时注意保存到“images”文件夹中，提醒学生注意

书中的“小博士”，用这个办法在今后插入动画、音乐

时可以建立文件夹分类保存。

未能保存在“images”文件夹中，在文件夹列表窗口中，可以将图片文件拖动到“images”文件夹中。

插入图片后感觉不合理，可以调整图片，大家可以结合

课本P72的“知识窗”和“金钥匙”调整自己的网页中

的图片。

大家结合老师刚才的解说，从新调整网页中的图片。

（任务三）大家为自己的网页添加了图片，若想达到图文并茂，具有感染力时，也要相应地对文字进行修饰。文

字的修饰在学习文字处理软件Word时已经学过了，大家试着将你的网页中的文字进行修饰，达到图文并茂，赏

心悦目的结果。

教师进行指导……

学生实践……

学生观察并指导……

学生纠正错误……

学生实践……

让学生先实践，从中发现错误后再纠正学习的过程。

纠正学生的错误，可以将网页中所需的要素分类保存，

培养学生举一反三的学习方法。同时要与素材文件夹进

行区分。

引导学生使用已知的技能来修饰自己的网页。

三、知识总结

这节课你都学会了什么？

学生自己总结……

【教学反思】

这部分内容使用两课时，给学生大量的时间来增加网页中文字和图片的信息，可是其中的操作大部分是先前所学知识，这里只是进行了一个综合应用，在应用的过程中学习部分知识，学生在添加网页中的内容时也培养了学生的成就感，增强了学生的自信心，也为下一节课美化网页奠定一定的基础。

调整知识：将第1节课准备工作中“网络资源”文件夹放在这里进行，学生查找资料时立即就用到了，用到了才是学生最需要的。同时在讲解分类保存网页中所需的要素时可以和网络资源文件夹的功能进行比较。这点知识学生容易混淆，进行区分是有必要的。