网页制作教案10_网页制作教案图文

网页制作教案10由刀豆文库小编整理，希望给你工作、学习、生活带来方便，猜你可能喜欢“网页制作教案图文”。

4.2 课堂任务1 首页版面的设计与制作

课程名称：网站的设计与制作 课时数：4 教学目标：

知识与技能：了解图层及图层样式相关概念。

过程与方法：掌握用PhotoShop进行简单的图片处理和文字效果制作的方法

理解首页的总体设计要求、组成要素和制作方法； 情感与价值观：培养学生主动思考问题的习惯和自主学习的能力。教学重点：

用PhotoShop进行简单的图片处理和文字效果制作。教学难点：

首页总体设计要求、组成要素和制作方法的理解。教法：

任务驱动法 学法：

阅读，记录要点，动手操作。课前准备：

第四章第二节素材和实例。视频教程：首页版面的设计与制作.wmv。教学过程设计：

（一）导入设计：

色彩协调、清晰漂亮的高品质网站常常能使浏览者对整个网站留下深刻的印象。Adobe Photoshop软件能非常方便的帮助我们设计制作出漂亮的网页界面。今天我们一起来学习网站的设计。

（二）新课讲解设计：

（1）请学生带着以下问题阅读P140～142的知识预读，问题如下： A.什么是图层？图层的上下顺序跟显示结果有关系么？ B.什么是图层样式？打开图层样式的方法有哪些？（2）请学生一一回答以上问题。（3）教师总结评价并补充相关要点。（4）了解任务目标。

（5）教师演示作品成品，请学生根据已有的知识猜测该图的制作过程。（6）教师演示制作该图的关键步骤，（详见教材第16页至第21页的内容）。

操作要点及注意事项如下：

A.一般作为首页的图片大小以屏幕刚好能完全显示，并不需要滚动条为宜。B.首页在色彩的使用上要尽量与子页一致。（6）学生完成相同操作。可参考视频文件用首页版面的设计与制作.wmv。教师巡视指导。（7）学生上传作业。教师随机抽查点评。（8）教师总结评价。

（9）请学生完成任务一对照练习。

（三）小结和作业： 小结：

（1）图层的概念

（2）首页的设计要求

（3）对图像做了哪几步操作 作业：

填写《任务评价表》并上交

4.2 课堂任务2 内容页面版面的设计与制作

课程名称：网站的设计与制作 课时数：6 教学目标：

知识与技能：了解图层及图层样式相关概念。

过程与方法：掌握用PhotoShop进行简单的图片处理和文字效果制作的方法

理解内容页面的总体设计要求和方法； 情感与价值观：培养学生主动思考问题的习惯和自主学习的能力。教学重点：

PhotoShop相关技术的应用。教学难点：

内容页面的总体设计要求和方法。教法：

任务驱动法、演示法 学法：

阅读，记录要点，动手操作 课前准备：

第四章第二节素材和实例。视频教程：内容页面版面的设计与制作1.WMV，内容页面版面的设计与制作2.WMV。教学过程设计：

（一）导入设计：

根据已有的首页，我们可以分析出这个网站的色彩风格，这样我们在做内容页面的时候就可以对应起来。

（二）新课讲解设计：

（1）教师展示作品成品，请学生分析首页与内容页面在色彩的使用上有什么特点。文字的处理有什么特点？

（2）请学生根据已有的知识猜测该图的制作步骤。（3）教师补充相关要点。

（4）教师演示制作该图的操作，（详见教材第149～159页的内容）。操作要点及注意事项如下：

在已有的代码上插入对称标记的时候，要注意标记的嵌套，不要使标记交叉而导致文件出错。（5）请一位学生上台操作，其他学生完成相同操作。可参考视频文件内容页面版面的设计与制作1.WMV，内容页面版面的设计与制作2.WMV。（6）教师总结评价。

（7）学生上传作品，教师抽取部分作品展示。（8）由学生完成任务二对照练习。并上传作业。

（三）小结和作业： 小结：

（1）网站的风格（2）颜色的选取

（3）内容页面的设计技巧 作业：

（1）填写《任务评价表》并上交（2）完成本章习题。