网站主页的设计

《网站主页的设计》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、《网站主页的设计》教学设计　　作者：董烨华（浙江绍兴市第一中学信息处）　　来源：人教网　　发布时间：2011-08-19　　一、教材分析　　本节课讲授浙江教育出版社《信息技术基础》第六章“网页的设计与制作”的相关，并根据《浙江省普通高中新课程实验信息技术学科教学指导意见》进行了适当设计，教学侧重于让学生掌握网站的策划与构思和熟练掌握简单网页的设计与制作。　　二、学情分析　　学生已经会收集和整理素材，掌握了用FrontPage制作网页的基本操作，对网站的策划与构思有了一定的了解，但网站创建的知识以及网站策划构思的实践比较欠缺，另外学生

2、现有知识水平存在一定差异。　　三、教学目标　　知识与技能：能较熟练地运用表格实现网页布局；知道创建网站的一般过程，了解一些主页设计的知识；初步掌握网站的策划与构思。　　过程与方法：通过自主探究和小组合作完成学习任务，掌握一些探究学习的方法，培养与他人协作、交流的意识和能力。　　情感、态度与价值观：通过网站主页设计，激发学生的创作欲望，提高学习信息技术的兴趣和愿望；通过教师提供的创作背景信息，使学生更关注气候变化对人类发展的影响，增强社会责任感。　　四、教学重难点　　重点：学会运用表格实现网页布局，初步掌握网站的策划与构思。　　难点：

3、如何在主页制作中实现自己的网站设计构思。　　五、教学过程　　1．教学引入，学习准备　　教师指导学生访问课堂学习网站（如图1），然后介绍网站的创作构思与特点。　　师：这是老师为课堂学习专门设计制作的一个网站，请同学们从“名称贴切、主题鲜明、内容丰富、结构清晰、界面友好美观”五个角度，给网站做个评价，认为都满意就赶快伸出五个手指头。　　学生们高举手臂，伸出五个手指。　　师：谢谢大家的支持，你们的认可是我创作的动力。　　师：通过前段时间的学习，我们已经较好地掌握了素材收集与整理的方法；掌握了一些利用FrontPage软件做网页的基本操作；

4、在欣赏优秀网站的基础上，对网站的策划与构思有了一定了解。这节课，我们将跟随着学习网站的导航栏，一起揭开创建个人网站的第一页──设计制作网站主页。　　师：先来玩一个拼图游戏吧。　　图1学习网站首页图2学习参考页面　　设计意图：用学习网站吸引学生的注意力，使其迅速进入课堂学习状态。通过学生评价老师的网站设计，使学生对网站策划构思中要考虑的因素有进一步认识。　　2．以趣激学，化解难点　　学生浏览学习网站中“拼图游戏”活动要求。　　活动内容：将分割成小块的图片素材插入到教师预先设计好的网页中，完成拼图。　图3“威尼斯的泪”网站主页　　　　　

5、图4“威尼斯的泪”表格框架　　师：老师这里有个完工的网站主页（如图3），网站主题是关于拯救水城威尼斯的，网站名称是“威尼斯的泪”，页面十分简洁，用一张图片吸引观众目光，导航栏设置在右下处，四个超链接对应网站的四块内容，这种网页布局可归为封面型的布局类型，在个人主页和企业网站设计中较常用（具体可参考学习网站）。请大家仔细看这个网页，接着我们将用它的半成品来玩拼图（如图4）。　　教师用FrontPage软件打开半成品网页。　　师：同学们看到网页上都有些什么？　　生：哦，表格，原来刚才的网页是用这样的表格来实现布局的。　　师：对了，那再仔

6、细观察一下，这里到底用了几张表格。　　生：两张，三张……　　师：答案是五张表格，最外面一张虚线显示的表格将整体分为上下两大块，然后表格里面套表格，最终将所有网页内容，用一个个单元格定位。　　师：现在网页上半部分的九个单元格就是留给大家来完成拼图的，加油，看谁最快完成提交。　　学生下载素材，尝试着完成拼图；教师巡视，了解学生的制作过程。学生在制作过程会碰到一个主要问题“如何将图片拼得天衣无缝”，涉及到表格的属性设置这一知识点，要能够想到将表格边框设置为隐藏，将表格单元格边距和间距值都设置为0。　　师：已经有同学完成拼图提交了，某某同学

7、是最快完成的，让我们一起来看一下他们的拼图吧。　　教师根据学生完成情况，选择不同的教学，如果已经有学生很好地完成了拼图，就请学生来讲解、演示；如学生都没有很好地解决问题，教师可以通过提问“五张表格中最外一张用虚线显示的表格在预览中是否能看到它？”“表格边框隐藏是怎么实现的？”“表格属性中还能设置什么？”等问题，引导学生找到答案。　　师：只有想不到，没有做不到，网页布局，表格帮你轻松搞定。　　设计意图：以一个熟悉的游戏任务引导学生探究、学习、掌握表格布局的知识。同时，任务素材又是后续学习任务“主页设计”的一个范例，帮助化解学习难点。　

8、　3．创设情景，引起思考　　师：再次欣赏这幅拼图作品，不知道摄影师有没给它取过名，就让我们来给它设计个名称吧。　　生：“大海，大海”，“港湾”，就用“威尼斯的泪”……　　师：请大家分别用“大海，大海”和“威尼斯的泪”做名称来看这幅作品