浮动框架技术教学设计

浮动框架技术教学设计一、教学设计理念新课改倡导自主、合作、探究和理实一体学习方式，教师善于发现学生在学习活动中的闪光点，激励他们自主参与合作、主动发现探究。本节课借助信息技术在教学中的运用将单纯知识的学习转化为实践动手操作训练为一体的掌握知识，体现“做中学，学中做”的教育理念。尊重学生的学习体验，鼓励他们动手操作，以自身的学习体验自主交流思想、展示成果。让学生在相互合作、交流讨论中愉快地获得知识。二、教材分析与处理（一）教材及教学内容分析1.使用教材：高等教育出版社的中等职业教育国家规划教材，省电子商务专业课改教材《网站建设与维护》（许宝良主编）。2.教学内容：项目四任务一第2课时浮动框架技术3.本节的作用和地位：本节内容是学生学习框架网页设计技术后的第二课时浮动框架技术的运用，浮动框架能使网页内容布局更加的灵活生动，为后续的网页整体布局知识的学习奠定了基础，所以在教学过程中着重强化本节知识和操作技能的掌握，利用可视化的动态网页展示和操作技能微视频教学，运用自主合作互助，探究和实训相结合的方式学习，以便让学生能够透彻理解本节和掌握操作技能。4.课时安排：1课时（二）教材处理

本节课以北京奥运吉祥物福娃的浮动框架窗口网页展示为情境任务，直接提出任务要求并贯穿整个课堂学习，分析知识点和利用技能微视频教学，辅以实训完成任务，巩固知识掌握技能，从浮动框架的概念引入到浮动框架制作，提升到怎么进行设置属性和网页显示，直到学生的实际任务完成和拓展，递进式的知识技能学习，让学生自主学习，合作互助，探究并结合技能微视频，实现技能的掌握。三、学情分析本堂课教授的对象是电子商务专业高二年级的学生，思维活跃，动手能力强，不喜欢传统满堂灌课堂教学，渴望参与课堂学习。对于教材中框架技术运用有初步的认知。但学生知识积累欠佳，缺乏实践经验和技能操作能力，需要进行有效的系统化的学习和技能实训，培养学生利用知识技能解决实际问题的能力四、教学目标1.知识和技能目标理解浮动框架的原理及使用方法；掌握浮动框架属性设置；能利用浮动框架技术设置网页链接，实现页面布局。2.过程和方法目标通过实例效果图动态可视化展示任务驱动激发学生学习兴趣;通过协作互助和技能微视频学生掌握浮动框架的设置及运用技能；通过实战演练拓展提升学生体验真实情境提高实践操作技能水平。3.情感、态度和价值观目标通过小组合作互助，培养自信心和合作能力；通过实战教学，激发学习网页设计热情培养学生对专业的认可和忠诚度。

五、教学重点与难点教学重点：浮动框架的属性及其设置（代码熟记）。教学难点：浮动框架的链接设置及运用。突破方法：通过任务驱动，教师的演示操作和技能微视频教学等信息化技术手段的运用，让学生通过小组合作探究和互助实践操作相结合，以学生为主体，激发全程参与教学活动的积极性，进而到达突破重难点。六、教学方法和学习方法指导1.教学方法：任务驱动、微视频教学法（着重说明信息技术的作用和效果）2.学习方法：小组合作互助探究、实训操作七、教学准备教师准备：浮动框架网页设计素材、多媒体课件、微视频学生准备：分组组建团队。选出队长负责具体任务的分配和组员之间的协调。八、教学过程关于教学流程和活动的设计思路：本节课主要是充分激发学生的学习兴趣，自主学习探究热情，培养学生利用所学知识解决实际问题的能力，教学程序设计如下：

（一）任务驱动：案例导入展示效果图，提出任务以北京奥运会吉祥物网页案例展示，网页动态的方式进行展示，截图如下：并提出任务：如何运用更灵活有效的技术实现既定的窗口展示，完成效果？教师引导学生思考：在以往的网页布局中我们可以使用表格来进行多页面的设计制作，但是达不到所展示的页面效果，那么我们如何来做呢？引出本课主题：浮动框架技术。教师利用多媒体的技术进行全体广播，注意观察学生对任务情境提出的反应，并及时进行适当的引导。设计意图：通过创设情境，开门见山，直接点题。使学生明确通过本堂课的学习能够掌握浮动框架在网页设计中的运用技能，激发了学生学习网页设计的动力，做到以任务促技能，以技能促学习。（二）合作互助探究分析任务步骤一：可视化案例导引，探究新知教师要求学生以小组为单位讨论、探究什么是浮动框架？它有哪些属性要求？教师请代表发言并及时的表扬鼓励。浮动框架技术：学生回答（可能会不完整或不知道）属性说明：学生回答步骤二：微课运用，突破重难点1.播放微课《浮动框架技术》师：浮动框架技术能让网页显示更加的灵活那么，那么如何运用到网页设计中哪？播放微课：《浮动框架技术》教师作为引导组织者，及时观察和记录学生活动.注：学生观看微课后，教师引导请学生归纳浮动框架及其属性：教师补充说明：浮动框架：Iframe标记，又叫浮动帧标记，可以用它将一个HTML文档嵌入在另一个HTML文档中显示，实现网页显示“画中画“的电视效果。

属性说明：PPT展示说明※name表示浮动窗口的名称,设置链接时用于指定显示网页的浮动窗口src表示在浮动窗口中显示的网页原文件地址如：福娃全家福.htmlwidth表示宽度使用数值表示像素多少如:“600”，“700”height表示宽度使用数值表示像素多少如:“800”，“900”frameborder表示浮动框架边框的宽度常用有”0”，”1”2.浮动框架的链接显示设置提问：了解浮动框架的内涵及其属性之后，如何实现框架显示效果哪？教师要重点说明浮动框架属性名称设置及设置链接显示是目标的设置即为浮动框架名，即可实现效果。学生通过观看微视频，从感性上认识浮动框架技术的运用（链接设置），教师解析后，从对浮动框架的感性认识上升理性的认识。设计意图：通过任务展示，层层点拨，借助微课，落实重点知识，突破难点。采用小组合作互助学习，给学生营造轻松的学习氛围，充分发挥主观能动性，培养学生团队精神和合作意识。（三）实战演练执行任务根据任务展示要求分组进行实践操作，完成任务。教师发放素材给学生端。步骤一：小组合作互助完成任务（15分钟）不清楚部分可重复观看微视频小组合作互助交流，完成的同学可以走动，帮助其他同学，掌握浮动框架的属性设置及运用到网页页面布局中。步骤二：成果展示（3分钟）小组代表展示技能操作成果（学生完成通过多媒体将内容上传教师端，展示成果演示（或运用学生“演示功能”）给全体学生并作简要说明，达成学习交流。）步骤三：分析评价（2分钟）教师点评，分析细节及不足，肯定优点。教师观察，记录小组活动情况，参与情况，对小组进行现场打分，及时了解出现的问题并及时引导。分析不足，肯定优点。设计意图：通过实战演练的方式，为真实的操作技能的掌握和运用提高质量，培养学生学习能力，充分调动学生的参与度，体现了做中学，做中教的理念，从而突破了本课的教学难点。培养学生实践应用的能力。（四）巩固练习提升任务第一关：知识大盘查通过随机抽取座号的方式，通过PPT的抽奖转盘请学生回答浮动框架的属性，并及时做好肯定和分析。※namesrcwidthheightframeborder第二关:技能大挑战在浮动框架中展示设置外部链接网页拓展任务：选择任意的元素作为链接源在浮动框架中展示外部链接地址网页，展示网页如：百度（），新浪（）设计意图：从探索任务到建构新知，再回归综合任务提升，使学生真正有体验有收获，达到学以致用的效果，并促进学生思维能力和语言表达能力的提升。（五）归纳总结评价任务1.请学生代表归纳总结并利用“广播的方式”展示给全体学生板书内容，

学生结合主板书的内容，积极思考，自行归纳、总结本节课的学习要点。老师指导、启发，积极鼓励并针对回答中出现的偏差，借力全班同学，共同纠错，达成共识。2.填写学习过程评价表（发给学生端的素材包里）并通过ftp方式发送给教师端。浮动框架技术学习过程评价表活动评价采取自我评价占30%、小组评价占30%、教师评价占40%的方式进行综合评定。小组长在“建议”栏中写出对该成员的改进建议和希望；教师在“评语”栏中给予综合评价，并指出需要提高和改进的方面。自我评价主要评价内容学习态度好，能通过讨论的方式共享他人的观点和想法积极参加探究活动，并达到预想的目的自主学习，主动发现问题，提出问题并寻求解决问题的方法在分工的基础上共同承担任务，高效完成自己的任务。合计分值得分25252525100小组评价主要评价内容分值得分善于与人合作，虚心听取别人的意见积极参与讨论与交流30302020能有条理表达自己的意见，解决问题过程有条理小组合作中贡献度大合计100建议组长签名：年月日教师评价主要评价内容分值得分理解浮动框架技术的内涵掌握浮动框架的属性设置3030能够在网页设计中运用浮动框架技术合计40100评语教师签名：年月日设计意图：用学生总结，教师补充的方式，在学生总结的基础上，教师再概括板书展示，起到画龙点睛的作用。通过评价表检验学生所学会的专业知识、所掌握的职业技能和所体现的职业态度。（六）布置作业延伸任务1.选择制作一个班级主页运用浮动框架技术展示班级活动展示页。2.拓展：运用浮动框架技术显示表单网页。设计意图：第一题为基础题，加强知识的巩固。第二题为拓展题，检测学生对知识的运用和操作能力，学以致用。（）七板书设计注：黑板右边是学生上台展示成果的地方。教师根据学生所展示的成果，加以归纳总结。九、教学反思一节好课主要来源于好的教学设计。从教师向大家分发的教案和实际上课的流程来看，教学思路是从教学内容和学生水平两个方面设计出来的。静心细想后，这节课成功主要得益于课堂教学中把新课标中的新理念作为教学的基本理念，具体表现在以下几个方面：1.成功之处：得益于新的教学方式的运用即学生自主合作互助探究式学习，技能微视频教学等信息化教学手段的运用。教学设计结构上层次清楚、条理分明的、知识结构明了；情景案例引入贯穿课堂让学生更好把握知识的完整性，驱动，激发学习兴趣，充分调动学生的热情，增强课堂学习氛围，体现以学生为主的教学设想；使用微视频教学有效的翻转的课堂，激发学习兴趣的同时，又能通过视觉思维引导学生利用知识解决实际问题；在课堂中能及时的处理突发的教学预设外的事件。遵循了知识学习的规律和迁移的重要性在教和学中的渗透与应用；及时的表扬学生的独特见解，使学生的好方法、好思路得以推广，而且对学生也是一种赞赏和激励。这种方法的使用不仅能调动学生的学习欲望和兴趣，也能达到教学的三维目标，特别是中职学生，课堂需要从做中学，让学生乐于学，值得以后借鉴和推广。2.不足之处：即使是成功的课堂教学也难免有疏漏失误之处，在本节的课堂教学中，虽让课堂的氛围较活跃，学习目标也完成的较好，但是即使是设计了很多的突发状况处理预案还是出现了在自主学习中有部分的学生的自觉性没有被完全的调动，在合作探究交流讨论中也有部门学生的合作精神没有完全的被激发，以致在交流阶段，个别学生发言时有怯场的现象，需要在以后的教学设计和实践中不断的积累，加强教师教育机智的训练。3.再来一次，静心沉思，一节成功的课不在于有多么优秀的教学方法的使用，而在于你使用的方法是否使学生的学习更加的有兴趣，更加的热爱学习，更多的掌握知识技能，再次让我重新设计一次课堂，我还会去使用这种能让学生全程参与的，能体现师生共同学习方式的教学方法，在知识点结构上更加的清晰明了，在程序设计上更加的层次化，递进化，更加的体现全体学