PS网页设计与制作

PS网页设计与制作（主页）

一、教材分析

设计制作网页的方法有很多，所用软件也各不相同，在本次拓展课程教学中，采用Photoshop设计网页。本课是第四课时，在之前的课中，教师介绍了网页大小、图片素材的保存及处理方法，学生已了解有关网页的相关知识点，本节课在此基础上，开始学习PS网页设计，通过新建文档，完善网页中的其它要素，如：文本、页头、页脚、图片等要素。 二、学情分析

认知水平：本班学生为八年级学生，善于接受新鲜事物，欠缺专注力、知识迁移能力。 知识技能水平：

在前几课时的学习中学生了解了网页的常见大小，主页包含的各项要素，七年级下已学习过PS的相关知识与技能，有一定的基础。本节课，学生需要灵活运用以前的所学，制作出有个人特色的主页。学生在自主实践环节是遇到的问题，通过同伴互助、范例展示等方式，更好地理解为何这么做，以及怎么做。 三、教学目标

（一）、知识与技能

1. 了解主页大小，掌握设置主页大小的方法。

2. 掌握文本设置的方法，尝试通过更改大小、字体、变形、混合选项呈现出有个人特色的文本。

3. 了解导航栏的样式及位置，掌握矩形的绘制调整方法。 （二）、过程与方法

1. 通过课堂任务的设计，强化学生个人自主探究能力及小组协作学习能力。 2. 培养学生对问题的分析和解决能力，更好地理解PS制作主页的方法与策略，提高学生对PS的理解与认识。

（三）、情感态度与价值观

提倡学生多观察、多动手实践，不怕失败，只怕不动。在信息技术课堂上勇于探索实践，通过作品展示自己。 四、教学重点

主页大小设定、标题和图片的大小及位置、导航栏制作 五、教学难点

主页中各对象的大小及位置 六、教学方法

任务驱动、分层教学、同伴互助 七、教学准备

极域多媒体网络教室、Photoshop cs5、学案 八、教学过程 教学教学活动 阶段 1. 展示范例，吸引学生的注意力，调动学习的积极性 观看放映 聆听老师 观察素材文件 并进入创设情境 展示同个年龄段同学的作品，可以吸引学生的注意力，也更贴近学生的生活，引起更多的共鸣，尽快进入学习氛围。 选择PS制作网页，拓宽学生的知识学生活动 设计意图 创设情境 2.师：刚才大家看到的是我们八年级一些同学的网页设计作品，在这些作品当中，有关于美食的，有关于旅游的，还有关于漫画的，还有关于科技的，等等。那么，你知道这些作品是怎么完成的？ 3.教师小结：这些网页，我们一般称之为主页，都是在PHOTOSHOP中完成。 1. 启动PHOTOSHOP，向学生展示 思考并发表自己的看法 面，提升PS的操作技能。 观看放映 参与互动 思考并回答 PS强大的图片文字与处理功能，学生在七下学习过，通过师生互动，帮助学生复习一些跟复习旧知2. 对比说明，网页设计时使用到哪些功能 3. 小结： 图片——拖动至新建文档 文字——文本工具 图片文字相关的操作。 导航——形状 在复习了PHOTOSHOP的一些基本操作后，接下来，我们要开始正式设计主页了。在前一次课中，大家已选好图片素材，并初步加工，怎么用在网页中呢？ 师：引导学生尝试启动软件，开始新建文档 (1).登录FTP，下载前一首先引出学生的疑课保存上交的图片素材 虑，启发学生展开(2).启动PHOTOSHOP，参考学案，尝试新建文档 (3).同伴互动，落实新建文档时的各项参数：800*600 背景色透明或其它 思考。 信息技术课堂更多的希望学生通过尝试探索发现问题，进一步尝试探索寻求解决问题的办法，从而提高解决问题的能力。 通过学生演示+讲解的方式，更加直观地让全班同学了构建新知（图片） 师：主页新建完成后，第二步要添加背景图片，那么，如何将上周保存过的图片添加进来呢？邀请学生上台演示。 师：XX同学演示得非常好，首先，打开文件，使用移动工具，将图片拖动到文档中。当然，我们可以根据自己的构想，调整图片的大小及位置。 (4) .学生使用教师机面向全班展示操作过程，并做相应的讲解。教师 适当点评及补充说明。 解之前课上保存的 (5) 课堂操作时间，学生操作，同伴互助，教师巡视。如果有困难，先图片如何运用到网页中。 自行尝试探究，再向同伴寻求帮助，如果实解决不了，可向老师寻求帮助。 师：现在我们需要给网页添加标题，(1) .学生观看放映，对那么，你觉得网页的标题有什么特点？ 照范例及个人经验，思考 (2) .学生回答问题,表达个人的看法（2-3人） 师：教师小结标题特点：醒目，颜色、 (3) .学生使用教师机面向全班，演示如何在文档中添加文字，以及更改文字的形状、大小、颜色。通过修改图层的混合选项，使文字呈现出更多丰富的样式。 (4) .课堂操作时间，学生操作，同伴互助，教师巡视。如果有困难，先自行尝试探究，再向同伴寻求帮助，如果实解决不了，可向老师寻求帮助。 结合学生的个人经验，鼓励学生表达个人看法。不仅仅是通过教师给出的几张图片得出一个结论，更多是从学生的生活和个人体验出发。 大标题的制作也是本课的一个重点，设计的意图是学生通过对比尝试，找到更适合自己的网页，制作出更具个人特色的作品。采用分层教学，鼓励同学结合个人实际情况，下载安装新的字体，对于另外的基础较弱的学生的，则鼓励通过开关的改变，颜色调构建新知（标题）大小或者字体与网页中的其他文本不一致，位置根据整体页面布局而定 师：有请一位同学给大家演示如何制作网页的标题 教师通过设问的方式引导学生讲解有关文字的操作。 教师板书： 文本：字体：字体库中的或自行下载 形状：变形 立体：混合选项 大小：大于普通文字