《使用背景图片和音乐美化网页》教学设计

用图片美化网页教学目标：1、掌握在网页中插入图片的方法。

2、掌握网页中插入图片的大小和透明色的设置方法教学重点：在网页中插入图片的方法教学难点：精确设置图片的大小和透明色的设置教学过程：一、导入新课1、首先，我们来看三张网页图片，请同学们仔细观察，找出其中有什么不同？学生观察答复2、同学们观察得很仔细。

网页上有图片和没有图片有区别吗？谁来说？为什么？学生答复既然图片能让网页变得更好看，更美观，那我们这节课就来学习用图片美化网页。

出示课题这节课我们要完成两个学习目标：①掌握在网页中插入图片的方法，②掌握网页中插入图片大小和透明色的设置。

下面我们就先来学习怎样在网页中插入图片。

二、学习新知1、网页中插入图片。

同学们还记得我们以前学习过的怎样在WORD中插入图片吗？在网页中插入图片和在WORD中是一样的。

现在就请同学们翻开FrontPage2021，翻开自己的个人主页，试着在自己的个人主页前面插入一张好看的图片。

想不起来怎么插入图片的同学可以翻开书23页，试着做一下。

图片你可以到“我的文档〞里面去找注意在什么位置插入图片学生自主探究，尝试操作，教师巡视指导同学们做得非常棒，可是老师的网页上还没有图片，谁能帮帮老师？学生示范演示幻灯片出示插入图片的方法2、精确设置图片大小。

同学们做得非常好，不仅会插入图片，而且也会修改图片的大小。

可是你知道这张图片具体的大小是多少吗？现在我们就一起来看一看这张图片的大小。

教师示范演示鼠标指向图片，单击右键，选择“图片属性〞，在对话框中的大小区内我们看到了该图片的大小。

宽度是高度是不仅如此，我们还可以在这里精确设置该图片的大小。

比方把图片的宽度改成100，单击确定。

看图片变小了，而且我知道这张图片的宽度是100，高度是108。

下面请同学们来精确设置图片的大小。

学生练习3、设置图片的透明效果。

请同学们把放下坐好。

图片这样就可以了吗？还有什么不满意的？怎样才能把白色背景去掉呢？请看老师来操作。

《网页的美化》教学设计●主要教学内容：设置网页的背景、设置表格（单元格）的背景、设置背景音乐、插入Flash动画和插入滚动字幕。

网页是否美观大方，很大程度上取决于各元素的色彩搭配是否和谐得当、色调是否与网站主题相吻合，以及网站中元素是否能满足网站要表达的感情等。

对网页进行美化是每一个网站建设者的不懈追求。

网页美化是对前期所做的网页的修饰，是提升网站可观赏性的一个非常重要的手段，是网站建设中一个非常重要的环节。

●1、知识目标了解美化网页的常用方法，理解美化网页对提高网站质量的作用。

2、技能目标学会在网页中设置背景、音乐、Flash动画和滚动字幕。

3、情感态度与价值观目标提高审美意识，善于发现美，美化生活从自身做起。

本课的重难点重点：设置网页背景、设置背景音乐、插入Flash动画和滚动字幕难点：网页的色彩调配本课的课时分配建议一课时●教学过程中，采用了情景导入、任务驱动的教学方法，教师的演示后，让学生自主完成任务一至任务五，合作完成综合练习。

●网络多媒体教室●学生自评、小组互评、老师评价相结合。

●【导入新课，明确学习目标】【范例精讲，学生自主探究，完成任务】【综合实践，巩固与提高，自由创作，迁移运用】【教学总结，设疑激趣，为下一节课作好铺垫】本节课通过创设生动、直观、形象的情景，激发学生学习的兴趣，采用任务驱动的方法，先让学生通过自主完成任务，实现教学目标，然后小组合作完成综合任务，展示评价学生作品，激发学生的创作欲望。

通过学生自主创作，不但使学生学会了网页美化的基本操作及方法，更能培养学生的创新能力和审美观点。

学情分析学生通过前一段时间的学习，已经有了一些网页制作的知识和技能，本节的学习是在此基础上进行知识的提升和能力的提高。

逐步引导学生成为网页的“美化大师”。

丰富多彩的网站，各具特色，很容易激发学生的学习欲望，希望能够在网页美化上有一展身手的个人舞台。

然而，大部分学生对网页的美化缺乏知识的铺垫，通过本节课的学习，教师创设好情境，给出任务，通过讲解和指导，引导学生步入美化网页的学习和体验。

五年级下信息技术教案美化网页_福教版8、美化网页教学目标：知识与技能：能在网页中插入图片，设置图片属性，对图片进行简单编辑；能通过网页属性设置网页的背景。

过程与方法：通过自主探究，小组合作，培养学生的动手实践能力和合作交流能力。

情感态度价值观：通过网页制作，培养学生对美的感受及创造美的能力，提高自身的艺术修养。

重点、难点或关键：插入图片，设置图片属性，对图片进行简单编辑.了解网页的整体风格、能有意识地将图片放在“images”文件夹下教学流程：师：最近，海西在招聘微博小编辑，同学们想不想去试一试呢？要成为小编辑可不是一件简单的事，它必须要下苦工，要知道优秀的网站应该具备的条件。

让我们先来看一下下面几个网站实例。

展示三坊七巷、海西站实例，引导学生四人一组进行观察，交流，提出引导性的问题：优秀问题“图片太大，位置不好”引出：挑战三：图片我会修1.引导学生回顾word中修饰图片的步骤；2.然后让学生引导学生，根据教材45~46页的内容对图片进行修剪；3.请小组代表上台操作；4.教师进行小结；此过程中故意使用站点外的图片作为插入对象，保存网页时，引导学生观察并思考出现问题的原因。

5.对还没完成任务的同学接着操作完成任务，并对图片进行简单的编辑操作。

挑战四：觉得白色的网页太单调，请你给网页穿上‘花衣服’，让它看起来更漂亮。

1. 引导学生，可以给网页的背景加颜色或图片。

让学生让小组进行讨论，后操作；教师巡视，并对个别学生进行指导。

派代表上台操作，教师再对学生的回答进行简单的点评和评价。

1. 学生自己谈谈：这节课你学到了什么？有什么收获等等。

2. 评选出今天的最佳小编辑，并让学生填写评价表并上交。

第3节《美化网页》教学设计一、学习者分析教学的对象是初中二年级的学生。

在学习本章节之前，学生已经学习了网络基础知识，具有一定的使用计算机的能力；而在本章前面的学习中，学生学习了如何建立一个（本机内的）站点和网页的建立与保存，对网页编辑等有一定的基础，而且对制作网页有较高的兴趣。

二、教材内容分析1.本节的主要内容及在本章中的地位本节是网页制作中最重要、最精彩的部分，也是学习网页制作的重点内容。

正是由于有了各种美化网页的方法，网页才会显得吸引学生的学习。

因此，要通过本节的学习，充分激发学生的学习兴趣。

2.教学重点、难点：重点：（1）表格的制作与属性的设置；（2）插入图片与图片的处理；（3）超链接的制作及设置；（4）横幅广告管理器的设置；（5）悬停按钮的设置与运用。

难点：（1）表格的修饰；（2）超链接的制作及设置；。

（3）横幅广告管理器的设置。

3.课时安排：第三节《美化网页》使用四个课时学习，其中，第一课时：表格的制作与设置；第二课时：插入图片与动画；第三课时：超链接的使用；第四课时：网页修饰、按钮与横幅广告管理器。

三、教学目标1.知识与技能（1）掌握网页中运用表格的方法；（2）掌握网页插入各种图片的方法；（3）学会应用超链接；（4）学会设置网页背景、移动字幕，设置横幅广告管理器和制作悬停按钮的操作。

2.过程与方法（1）通过美化网页的各种方法的学习，让学生从制作的层面认识网页世界；（2）通过制作网页的实践，让学生掌握网页制作的基本方法。

3.情感态度价值观通过表格、图片、按钮、声音、超链接等的实现，体验制作网页的成功感，激发学生的创作欲望，使学生形成主动学习的态度，积极参与到信息技术的学习中来，并在学习的过程不断提高综合运用信息技术的能力。

四、教学理念和方法注重以学生为主体，让学生主动探索，主动地构建知识体系，把理论知识运用到实践。

同时也倡导学生互相帮助进行学习，培养合作观念。

五、教学过程设计1.教学内容的组织与呈现方式课程围绕网站《名城广州》的制作，通过实际的问题引出所学知识，把网页表格、图片、超链接等等逐一展现，让学生把细化的知识逐一击破，再把所学知识应用到创作中去，逐步构成自己所要完成的作品，充分调动学生学习的积极性与灵活性，同时充分利用多媒体电子教室控制系统屏幕广播功能进行实时演示与讲述，提高课堂效率。

使用背景图片和音乐美化网页》教学设计#TRS_AUToADD_1250564593313{mARGIN-ToP:0px;mARGIN-Bo TTom:0px}#TRS_AUToADD_1250564593313P{mARGIN-ToP:0px ;mARGIN-BoTTom:0px}#TRS_AUToADD_1250564593313TD{mAR GIN-ToP:0px;mARGIN-BoTTom:0px}#TRS_AUToADD_12505645 93313DIV{mARGIN-ToP:0px;mARGIN-BoTTom:0px}#TRS_AUTo ADD_1250564593313LI{mARGIN-ToP:0px;mARGIN-BoTTom:0p x}/**---jSoN--{"":{"margin-top":"0","margin-bottom" :"0"},"p":{"margin-top":"0","margin-bottom":"0"},"t d":{"margin-top":"0","margin-bottom":"0"},"div":{"m argin-top":"0","margin-bottom":"0"},"li":{"margin-t op":"0","margin-bottom":"0"}}--**/DIV.myFav_1249633 762080P.msoNormal{TEXT-jUSTIFy:inter-ideograph;FoNT -SIZE:10.5pt;mARGIN:0cm0cm0pt;FoNT-FAmILy:"TimesNew Roman";TEXT-ALIGN:justify}DIV.myFav_1249633762080LI .msoNormal{TEXT-jUSTIFy:inter-ideograph;FoNT-SIZE:1 0.5pt;mARGIN:0cm0cm0pt;FoNT-FAmILy:"TimesNewRoman"; TEXT-ALIGN:justify}DIV.myFav_1249633762080DIV.msoNo rmal{TEXT-jUSTIFy:inter-ideograph;FoNT-SIZE:10.5pt;mARGIN:0cm0cm0pt;FoNT-FAmILy:"TimesNewRoman";TEXT-A LIGN:justify}DIV.myFav_1249633762080DIV.Section1{pa ge:Section1}DIV.myFav_1249633762080oL{mARGIN-BoTTom :0cm}DIV.myFav_1249633762080UL{mARGIN-BoTTom:0cm} 【教材使用】宁教厅审定山东教育出版社出版软件FrontPageXX【适用年级】8年级【适用单元】网页制作第3大节【教材分析】教材中本节的内容分为三部分：一是使用导航栏和共享边框；二是添加网页背景与上节的背景音乐一块学习；三是添加网页水平线和滚动字幕。

第3节《美化网页》教学设计广州市铁二中学钟文耀一、学习者分析经过上一次课的学习，学生已经掌握了创建网站，编辑文本及编辑表格的基本操作，为进一步学习这次课美化网页的内容做好了充分的准备。

二、教材内容分析1.本节的主要内容及在本章中的地位本节的主要内容是利用文本、图片、声音等素材美化网页，学习插入图片，编辑图片，设置背景图片、颜色及音乐。

2.教学重点、难点重点：（1）编辑图片（2）设置背景图片（3）设置背景音乐难点：利用素材为网页主题服务3.课时安排：1课时三、教学目标1．知识与技能（1）学会插入图片及对图片进行编辑（2）学会设置背景颜色、图片及音乐（3）根据网页色调、整体风格选择合适的素材2．过程与方法学生根据提供的素材、布置的任务和操作提示，自主学习及小组合作完成相应的教学任务，教师根据学生学习情况，适当地给予引导。

3．情感态度与价值观通过对网页的美化，提高学生驾驭素材进行创作的能力，及提升学生的审美情趣。

四、教学理念和方法本节课根据素材对网页进行美化，以学生为主体，自主学习掌握插入图片、编辑图片、设置背景颜色、设置背景音乐等基本操作。

以任务驱动的教学方法为主，教师适当地给予引导和帮助，对学习困难的知识采用演示操作，学生小组合作等方法。

最后，对完成的作品即时评价，促进学生树立“内容要为主题服务”的思想意识，及提高学生对作品的审美能力。

五、教学过程设计1.教学内容的组织和呈现方式教师展示以“樱花”为主题的素材，及展示完成作品的效果，分析作品构成要素，布置相应的任务，并用PPT展示操作步骤提示，学生根据素材完成任务。

提问：在单元格中有日本民歌《樱花》的歌词，怎样在歌词下增加图片或颜色。

提示：右键单元格属性背景提问：背景图片与直接插入图片的差别。

引导学生，提出问题：能不能对背景图片直接编辑呢？引导学生，提出问题：如果背景图片过小，或者过大会怎么样呢？播发PPT，展示任务及提示内容。

添加背景音乐提示：右键“网页属性”“背景音乐”3.教学评价教学评价由课堂及时评价及根据学生提交的作品进行评价。

《网页的美化》教学设计教材分析：《美化网页》是八年级教材第2章《网页制作》第4节内容，它是在学生学会建立站点、丰富网站的内容基础知识后，学习怎样对网页进行修饰和美化，使网页制作的水平进一步提高，以达到让人赏心悦目、流连忘返的目的，并为下一节的超级链接打下基础。

因此，本节课承上启下，对学生提高制作网站的兴趣和信息处理的能力上都有十分重要的作用。

教学目标：1、了解美化网页的常用方法，理解美化网页对提高网站质量的作用。

2、学会在网页中设置背景、音乐、Flash动画和滚动字幕。

3、提高审美意识，善于发现美，美化生活从自身做起。

教学重点、难点：重点：本课的重点是设置网页的背景。

让学生逐步学会知识的迁移和新旧知识的融会贯通。

让学生知道计算机中的许多操作都是相通的或类似的。

难点：本课的难点是插入滚动字幕和插入Flash动画。

教法方法：1、采用“任务驱动”教学法，以指导学生完成一个个具体的学习任务而开展课堂教学，以尝试发现、综合对比、总结归纳、网络教室直观演示等形式贯穿整个教学过程。

2、采用以点带面的方法，让学生进行分组练习，会的带动不会的。

学法：为引导学生自主探究学习，培养学生良好的学习方法与学习习惯，通过上述教法，坚持以学生自主学习为主，让学生通过观察，自己发现问题、分组研讨问题、亲自尝试、合作解决、最后由学生自己归纳总结，来完成本课的五个任务。

让学生以练为主，以亲自尝试实践、积极动脑动手来学习新知。

教学过程设计：（一）情景导入首先通过两个装修前后房间的比较，让学生回答喜欢哪一个房间？同学们都喜欢装修后的，从而得出，同一个房间，经过修饰之后，就会变得美观、漂亮。

学生回答，教师总结：多了音乐、背景、FLASH动画和滚动字幕。

那么怎样来实现这些修饰效果呢？今天我们就来共同探讨如何在网页中插入音乐、背景、动画和滚动字幕。

从这节课开始，网页在我们的手中将会变得五彩斑斓。

（二）新授内容划分团队，小组比赛，通过幸运星的奖励培养学生的竞争意识和集体荣誉感。

信息技术教学《美化网页》信息技术教学《美化网页》【通用2篇】信息技术教学《美化网页》1教学目标：1、通过学习在网页中插入图片、设置图片属性、编辑图片和添加背景，学会美化网页的方法；2、通过探究学习，小组合作，培养学生动脑、动手能力，合作交流能力；3、通过学习提高学生的审美能力、自身艺术修养水平。

教学重难点：重点：插入图片、设置图片属性、编辑图片和添加网页背景难点：合理美化网页教学准备：相关教学课件、网站、图片等教学过程：一、作品对比，导入新课1、展示网页，引发兴趣：引言：教师展示未美化的网页和美化过的网页，学生认真观察。

揭题：通过美化的网页，更吸引我们，那么怎样美化网页？揭题（板书：8.美化网页）二、回顾旧知，打开网站展示学习要领（板书：一、插入图片）三、回顾旧知，打开网站1．教师演示讲解2、学生活动：打开桌面上的.网站四、引导在网页中插入图片1．回顾：如何在ppt中插入图片。

2．师生互动交流。

在网页中插入图片和ppt中插入图片的方法非常相似，教师提示插入图片过程3．布置任务：活动一。

4．巡视全班，个别辅导。

5．学生代表演示，发现问题。

3．学生边复述过程教师边出示板书。

定位光标—插入—图片—来自文件五、设置图片属性1．教师展示未排版过的网页，讨论交流，说明光插入网页还不够，还要对图片进行设置。

（板书：二、设置图片）2．教师演示设置图片方法。

同学们边复述操作方法教师边出示板书鼠标右击图片—图片属性—外观3．学生动手设置图片。

做一做：活动二4．巡视全班，个别辅导。

引导学生在探究过程中，要细心观察图片属性对话框中各选项设置，如保持纵横比。

六、编辑图片1．提问：只要图片的文字或者画的部分，可以做到吗？那就要编辑图片。

（板书：三、编辑图片）2．教师演示编辑图片步骤，出示板书。

鼠标右击图片—显示图片工具栏3．学生动手编辑图片。

4．巡视全班，个别辅导。

引导学生编辑图片除了“裁剪”功能，还有其他编辑图片的的功能，如调整图片的明亮度等七、添加网页背景1．展示美化过的网页。