本站QQ客服在线 |
视频标签：用表格,网页布局,智慧天下杯
所属栏目：信息技术优质课视频
视频课题：《用表格为网页布局》智慧天下杯初中信息技术优质课评比
教学设计、课堂实录及教案：《用表格为网页布局》课堂实录-智慧天下杯2012全国义务教育初中信息技术优质课评比
用表格为网页布局
浙江省宁波市实验学校 范佳宁
一、教材分析
《用表格为网页布局》是浙教版《信息技术》八年级上册第三单元的第十五课，在前几课中学生对于网站、规划站点、在FrontPage 2003里建立站有了初步的了解，这节课是真正开始制作网页的第一课，对后面整站的制作起着承前启后的作用。对于网站制作的初学者，如何合理的布局，并在FrontPage 2003中用表格的形式体现这个布局，是本课要解决的一个问题。在对页面上的对象定位时，表格起到了非常重要的作用。表格的绘制与编辑，对于已经学过Word表格绘制的学生来说，已经不是难点，但要求学生对表格属性选项的设置有一定的掌握。
二、学情分析
大连第七十九中学七年级的学生，对于能够亲手制作网站，会有一定的热情，能够较为认真主动地学习制作，在接触互联网的过程中，对于网页的布局风格在不同类型网站中的应用有初步的体验，但尚需教师进行进一步的点拨、归纳。因为有过在Word里制作杂志的经验，很多技术都能熟练操作，但是一遇到FrontPage与Word不同的时候（如在Word中可以设置图文混排，但在FrontPage怎么都排不好），会感到困惑，需要老师及时的点拨、指导。
三、教学目标
【知识与技能】
1. 认识网页布局对整个网页元素的组织编排的重要性及网页布局风格的应用
2. 根据网页设计内容，利用表格合理布局网页页面
3. 学会并熟练掌握插入表格、编辑表格、设置表格属性的技能
【过程与方法】
1. 通过对生活中常见事物的分析，让学生理解认知网页布局的重要性，通过对不同类型的网站比较，让学生感受网页布局风格的应用
2. 理解表格在网页布局中的作用。
3. 通过对比学习、自主探究并交流评价，由word表格制作的知识迁移学习FrontPage中表格的创建和编辑，设置表格属性。
【情感态度与价值】
1. 培养学生审美能力、组织设计能力、合理评价自己及他人作品的能力
2. 培养学生做事有组织、有规划的习惯。
四、教学重点:
1．理解布局在网页制作中的作用，及不同网页布局的应用。
2．插入表格，对表格进行合并、拆分等方式进行调整，设置表格属性。
五、教学难点：
网页布局的应用、设置表格属性。
六、教学策略：
以任务驱动为主线，以学生自主需求为出发点，通过比较、体验式的教学法，启发学生感悟、理解信息的应用，培养信息处理能力。通过学生发现问题、自主探索、解决问题、内化应用的一系列过程完成教学任务，充分发挥学生主体性和教师的引导、组织、帮助作用，通过师生双边信息交流，搭建良好的主动学习的平台。
七、教学方法：
讲授法、对比引导法、探究学习法、任务驱动法
八、教学准备
1．多媒体教学课件；2．空白A4纸；3．多媒体网络计算机教室
九、教学过程
| 教学过程 | 教师活动 | 学生活动 | 设计意图 |
| 导入 | 以中国的首个空间实验站——天宫一号为话题，与学生一起讨论空间站的布局。指出，在空间站里，无论是功能区的划分还是搭载物的确定，都是经过精心布局的。布局是非常关键的一步。平时做事的时候应该养成事先布局的习惯。同时，布局是有其文化内涵的，特定的布局风格能传递特定的思想和情感。网页建设也是一样的，除了网页内容，网页的布局也传递着网页的文化和思想，烘托网页的主题。所以，今天我们的任务是为网页布局。 |
学生思考、回答：规划、布局 学生思考、感悟 学生思考、体会 学生明确目标 |
引出布局的重要性，提出做事要事先布局。 提出布局的文化内涵，不同的布局风格体现不同的思想和文化。网页布局亦如是。 明确本次课的主要内容和总任务 |
|
新 授 课 |
一、规划主页布局 通过几个网页实例，让学生体验不同的网页布局风格传递了什么样的思想，适用于什么类型的网站。讲解网页布局风格应用在这几种不同网站中的不同体现。再展示2个隐去了标题的不同类型的网站，请同学们根据网页布局的风格判断网站类型。 指出网页要素。指出制作个人网页时，可以发挥自己的创意设计网页布局，把网页设计得个性、灵动、富有创意。强调要让访问者感觉网页布局能烘托主题、简洁、美观、操作方便。 展示教师设计的网页布局，阐明设计意图。请同学们自己选择主题为主页设计一个网页布局图。教师巡回了解学生的设计意图，加以指导。 设计完后展示学生作品，由学生阐述设计意图，加以适当的评价。 二、在FrontPage中用表格实现布局 提问学生先前在FrontPage中输入文字插入图片过程中遇到什么困惑？我们在Word中是如何实现图文定位的？FrontPage中没有Word的图文混排功能。那么如何在FrontPage中解决文字、图片等多媒体在网页中的准确定位？实现网页的布局？ 展示网页的编辑视图，引导学生注意到利用表格布局可实现对网页内容方便的定位。 展示教师的布局图，讲解如何用表格实现此布局图。 回顾word中的表格制作，包括插入表格、编辑表格等操作。告诉学生在FrontPage中表格制作方法与word中类似。鼓励学生尝试在FrontPage中制作表格。请一位学生演示并解说FrontPage中表格的插入、合并单元格、拖动表格边框等一些操作。 请学生根据自己的网页布局绘制表格。在表格里面插入相应的内容，文字、图片等。教师巡回，个别辅导 三、表格属性设置 展示教师或学生的实例，切换至预览视图，预览效果时，同学们发现了什么问题？ 隐藏表格线可以通过设置表格属性来完成，请同学借助帮助文件自主探索，找到答案。请学生演示设置表格属性，边框线粗细为0. |
学生观看、体验、思考 学生观看、思考，判断 体会个人网站的布局风格 学生学习、思考 学生实践：在A4纸上设计主页布局。 学生互相交流，在评价中思考、学习 学生提出文字、图片定位困难 学生回忆word中图文混排操作 学生了解表格在网页布局中的作用。学生注意到利用表格布局可实现对网页内容方便的定位 学生思考、学习 学生回忆、发言 学生观看同伴演示 学生根据演示，自主探究、独立的完成操作任务 学生回答：表格边框线条多余。 学生尝试解决问题， |
学生通过对不同类型网站的网页布局风格的比较、体验，感悟网页布局的文化，和网页布局风格对烘托主题方面的作用。 阐明网页布局的原则 通过实践，学习为网页布局。鼓励学生发挥自己的创造力，让学生自主选题规划主页，张扬学生个性，而不是一味的模仿。适当评价激励学生。 引起学生共鸣，由学生发现问题，提出问题。以学生内需驱动学习。 通过知识迁移，发现软件功能的不同之处。 引出利用表格进行网页布局。让学生了解用表格在网页布局中的意义和作用。 阐明如何用表格实现网页布局图。 提出问题，明确目标 温故知新，知识迁移、学习新知 学会表格制作的方法。成功利用表格为网页布局。 引导学生发现问题，通过自主探究解决问题，培养学生解决问题的意识和能力。 |
| 展示评价 |
四、作品展示、评价 同伴间展示自己的作品，对照评价表中的标准对作品进行自评、互评 1. 作品展示，相互欣赏 2. 学生评价，整体协调性，美观性 3. 评价标准：评价表 |
学生欣赏作品，互相交流评价，体会成功喜悦 |
展示学生作品，这是一个再次给予肯定的过程，让学生感受到创作的乐趣、在评价提升审美情趣和技术水平，培养正确的自我评价和评价他人的能力。 |
| 课堂小结 |
五、课堂小结 请学生总结这节课的收获，教师组织、引导（围绕教学目标和重难点，结合板书回顾、总结）。指出主页制作的后续工作，为下次课做好铺垫。 |
学生回顾本节课内容，并期待后续制作过程。 |
引导学生小结出主要知识点：网页布局、表格的建立和编辑、表格属性设置。 |
| 项目 | 评价 |
| 网页布局能烘托作品主题 | ☆ ☆ ☆ ☆ ☆ |
| 网页布局美观、简洁 | ☆ ☆ ☆ ☆ ☆ |
| 网页布局操作方便 | ☆ ☆ ☆ ☆ ☆ |
| 网页设计富有创意 | ☆ ☆ ☆ ☆ ☆ |
| 总 评 | 颗 ☆ |
视频来源：优质课网 www.youzhik.com
