《制作表单网页》教学设计

《制作表单网页》教学设计一、教学设计部分教学内容分析本课的主要内容与地位本课主要的内容涉及表单的插入和表单数据的收集两个方面的内容。教学目的是以表单的形式完成对网站的评价。本课与前后内容的关系最后生成能够实现交互的动态网页，是学生在学习静态网页制作基础之上的知识提升。教学目标分析知识目标/技能目标知识目标了解表单的交互作用。技能目标掌握在网页中插入表单的一般操作；学会正确设置表单信息的收集方式。过程与方法目标通过学习网页表单的设计，学会与人交流，正确收集反馈意见。情感态度与价值观目标能够正常对待自己的缺点和别人的优点，取人之长、补己之短。学无止境，让自己不断在进步中成长。本课的重难点重点：表单的设计；表单数据的收集；难点：表单控件的参数设置。本课的课时分配建议一课时教学策略设计建议教法建议由于本节课学习的内容是创建一个动态网页，出现了很多前面没有出现的概念和术语，所以建议教师在讲解时注意对相关知识的补充和拓展。在讲解组件属性的修改时建议仍以分组探究的形式进行，通过各组之间的对比加深学生对相关知识点的掌握。在设置表单信息的收集部分，只有网页真正发布以后才能看到信息收集的情况，所以建议教师在教师机器上设置一个能正常访问的网站，预设一个表单网页，然后通过学生的访问表单网页留言，提醒学生时刻关注_private文件夹中form_results．txt和指定的电子邮箱内容的变化。教学资源与环境建议教学环境准备建议教师机：Windows2000Server（安装FrontPage服务器扩展插件）。教学评价建议自评、互评、师评要注意的问题学生能否完成表单网页的设计和表单数据的收集方法的设置，并且针对设计中存在的问题能否提出建设性的意见和建议。教学过程参考案例第一阶段：导入新课，明确学习目标教学环节教师活动学生活动设计理念导入新课引导学生“读一读”。师：经过前面六课的学习，我们已经初步掌握了网站设计和制作的一般步骤。我们的网站做得怎么样？有哪些地方需要改进呢？如果别人给我们提出意见和建议，通过什么途径反馈更方便呢？这就是我们本节课要学习的内容──制作表单网页。研读材料，思考问题。以格言和名言警句的形式引发学生对问题的思考。培养学生认识问题的正确态度。第二阶段：范例精讲，学生自主探究，完成范例教学环节教师活动学生活动设计理念学习与探究教师先向学生展示一个设计好的表单网页，并输入内容，提交表单，让学生对表单有一个初步认识。任务一：在网页中插入表单师：这样的网页我们能做出来吗？请大家根据教材提示插入一个表单，出现教材图1-7-3的效果。教师巡视指导师：现在的效果是否可以称之为表单呢？师：对，我们还需要在特定位置插入若干表单中的重要元素──控件。请大家根据教材提示插入一个表单，出现教材图1-7-5的效果。教师巡视指导任务二：设置表单信息收集方式师：我们设计的表单网页是让访问者给我们反馈信息。那么，这些信息出现在哪里？我们如何获得这些信息呢？请大家认真学习并实践“表单属性”，根观察，思考。分组合作，根据教材提示插入表单，并设计表单的版面。生：不可以。分组合作，根据教材提示插入表单中的控件。分组合作，根据教材提示设置反馈信息的收集方式。将陌生的概念以事例的方式展示给学生，便于学生接受。带着任务去实践可以做到有的放矢。该部分为本课的重点和难点，通过学生实践和教师的指导，强化对有关概念的理解。在操作技能上进行回顾和延伸，强化对知识点的理解的掌握。据教材中的要求，完成信息收集方式的设置。教师巡视指导师：大家想不想验证一下自己的表单是效果呢？请根据第六课中所学知识，把你制作的网页上传到自己的风韵空间中。根据教师指导，上传网页，并修改相关网页的链接。第三阶段：知识、情感拓展教学环节教师活动学生活动设计理念知识与情感师：大家说一下“粉丝”是什么意思？你是谁的“粉丝”？你对自己的偶像的情况了解多少？师：作为子女，自己父母的这些情况你了解吗？师：根据本节的学习内容，完成“实践与创新”第一个任务。学生回答。设计“父母在我心中”表单网页。以本节学习内容为载体，将感恩教育以更加具体的方式进行总结。第四阶段：综合实践，巩固与提高，自由创作，迁移运用教学环节教师活动学生活动设计理念实践与创新师：同学们是否听说过“留言板”这个概念？在访问其它网站时是否在留言板上留过言？请同学们根据教材提示，完成“实践与创新”任务二，在自己的网站上建一个留言板。师：“没有最好，只有更好！”请同学们针对自己网站中的不足，做出改进，让自己的网站更加完美。分组完成实践与创新的题目要求。引入新概念，引导学生对新新知识的探求。对网站评价过程进行总结，强调其重要性。第五阶段：教学总结，设疑激趣教学环节教师活动学生活动设计理念课堂小结课堂小结本节课的学习内容。师：到今天为止，我们已将“网站设计与制作”的全过程学习完毕，同学们想必对此有了一个全面的了解和把握。但是，我们在本单元学习的网站制作技术只是网站设计的初步，还有更多、更新的网站技术等待我们去学习和掌握。总结。以更高的视角认识网站建设，让学生以饱满的学习热情，探索网站建设的途径和方法。、教学反思本节内容涉及网页的交互，为学生下一步学习动态网站的设计起到承上启下的作用，在教学中应注重讲清表单网页的工作原理。二、补充资料部分1．课件与学件学生用学件名称文件名插入表单插入表单．swf设置控件属性控件属性．swf2．资料库网页表单基础知识表单，在网页中的作用不可小视，主要负责数据采集的功能，比如你可以采集访问者的名字和e－mail地址、调查表、留言簿等等。一、表单的组成一个表单有三个基本组成部分：①表单标签：这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。②表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。③表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。1．表单标签form/form功能：用于申明表单，定义采集数据的范围，也就是form和/form里面包含的数据将被提交到服务器或者电子邮件里。语法：FORMACTION=URLMETHOD=GET|POSTENCTYPE=MIMETARGET=……/FORM属性解释见下表：action=url指定一来处理提交表单的格式，它可以是一个URL地址（提交给ASP）或一个电子邮件地址。method=get或post指明提交表单的HTTP方法，可能的值为：post：POST方法在表单的主干包含名称/值对并且无需包含于action特性的URL中。get：不赞成。GET方法把名称/值对加在action的URL后面并且把新的URL送至服务器．这是往前兼容的缺省值。这个值由于国际化的原因不赞成使用。enctype=cdata指明用来把表单提交给服务器时（当method值为post）的互联网媒体形式。这个特性的缺省值是application/x-=．．．指定提交的结果文档显示的位置：_blank：在一个新的、无名浏览器窗口调入指定的文档；_self：在指向这个目标的元素的相同的框架中调入文档；_parent：把文档调入当前框的直接的父FRAMESET框中；这个值在当前框没有父框时等价于_self；_top：把文档调入原来的最顶部的浏览器窗口中（因此取消所有其它框架）；这个值等价于当前框没有你框时的_self．2．表单域表单域包含了文本框、多行文本框、密码框、隐藏域、复选框、单选框和下拉选择框等，用于采集用户的输入或选择的数据。二、FrontPage2000中表单提交错误的解决方法由于FrontPage2000本身的缺陷，在表单提交时，有时会出现以下错误提示：FrontPage运行态组件网页您提交了一张表单或以链接形式进入了一张网页，而此表单或网页需要有站点服务器和FrontPage服务器扩展才能正常工作。将此站点发布到安装有FrontPage服务器扩展的站点服务器上后，该表单或其他FrontPage组件就可以正常工作了。请单击后退箭头返回上一页。一般我们可以通过以下两各方法解决：①在method=POST和action=--WEBBOT-SELF--之间加enctye=text/plain②把action=--WEBBOT-SELF--改为action=mailto：邮箱地址。