选修3网络技术应用《第三节网站优化》新课标优质课教案设计

选修3网络技术应用《第三节网站优化》新课标教案优质课下载

会为图像建立超级链接和热区链接。

过程与方法：

在三个任务驱动环节中，通过自主学习、自主探究、自主实践，掌握给网页设置背景和向网页中插入图像的方法，以及为图像建立超级链接的方法；

通过交互式电子白板的图像属性配对操作以及选择题来掌握本节应会知识。

情感态度与价值观：

通过交互式电子白板的随机抽取学生、配对工具以及选择题工具，来激发学生学习的积极性；

通过三个自主完成的任务，来增强学生动手操作的能力以及独立完成操作的能力。

二、学情分析

学生在上学期已经学了网页设计的相关内容，对于Dreamweaver的相关操作并不陌生，有利于本节课用图像美化网页相关知识的学习。另外，上学期对HTML代码的学习，也为本节课图像的属性代码以及插入图像的代码的学习做好了铺垫。

三、教学重点

给网页设置背景和向网页中插入图像的方法；为图像建立超级链接和热区链接的方法。

学时难点

给网页设置背景和向网页中插入图像的区别；图像的属性及其意义。

教学活动

1. 对比导入

教师引导：我们在上节课已经基本完成了网页的大体框架，但是如果网页只有单纯的表格和文字，往往会让人感到单调凌乱。因此，我们要对网页进行美化，给网页添加适合的背景图像或设置背景颜色，并在恰当的位置插入图像、动画、音频、视频等元素，使我们的网页更加生动，更具功能性和艺术性。所以，我们这节课就来学习《用图像美化网页》，给单调的网页穿上美丽的“服装”。

首先先欣赏一下我们班一位同学设计的网页，上面这幅只有表格和文字，而下面这幅是由图像美化后的网页，是不是比上面这幅更加生动，更乐于去欣赏呢？答案是显而易见的。（利用电子白板的幕布工具，分别打开两个网页，形成对比。）

同学们是不是已经迫不及待地想去美化自己的网页了呢，在操作之前，先要知道给网页或表格设置背景图像和在网页中插入图像是两种不同的操作，那有何不同呢？我先留一个小悬念，大家先思考着，一会找同学来回答。

另外，同学们在操作时，一定要选择图案简单、色彩素雅的图像作为背景，因为背景只起到了修饰的作用，如果图案过于复杂，就容易喧宾夺主了。并且背景和文字还要形成鲜明的对比，比如深色背景要用浅色文字，浅色背景要用深色文字。

下面请同学们打开教学网站，根据任务驱动一的要求设置背景。

2. 任务驱动一自主学习

学生根据教学网站，自主学习任务驱动一，给网页或表格添加背景图像或设置背景颜色，教师进行巡视，观察学生操作情况，对个别学生进行指导。

3. 讲解插入图像

教师：同学们已经基本完成了设置背景图像的操作，也就相当于给网页穿上了“打底衫”，接下来我们就来讲一下如何向网页中插入图像，也就是给网页配上合适的“外套”。

首先将插入点放置在要显示图像的地方，执行【插入】—>【图像】命令，然后在弹出的对话框中，选择待插入的图形文件，单击“确定”，完成图像的插入。