《网页制作》教案设计

湖南省商业技术学院

学期授课进度计划

（二年级第一学期）

课程名称网页制作与设计

适用班级 16高21、22

制定教师易会芝

审批签字

2017-2018 学年第一学期制定

教学计划

学期授课进度计划表

学期授课进度计划表

实训方法上机实训

实训准备教案、素材、案例、教材、计算机机房

实训要求1.对照实习报告的要求，完成上机任务；

2.任务完成后及时要求教师考评；

3.完善实习报告，填写实训总结；

遵守实训纪律，不游戏，不睡觉，不高声谈论。

实训过程

内容操作要求及步骤

任务一

新建网页1

1、双击打开软件——新建HTML网页——网页名字为nes01——输入以下文字然后保存

2、文字要求：标题宋体二号蓝色正文：五号宋体加粗

任务二

新建网页2

制作如下网页素材见文件夹网页命名文字为index 保存在文件夹中上交给老师

操作步骤：新建HTML网页——输入文字——将标题设置为36号，蓝色，宋体——插入两

根红色的水平线——插入时间——插入商标——插入背景图片——保存

完善报告填写实训总结，并上交实习报告。

自主练习剩余时间，可进行自主练习，内容不限，但不可违反上机纪律

实训总结本次课是学生第一次上机，制作一个较简单的网页，学生存在对DW界面不熟，操作不熟练等缺点，需加强操作

课题 2.1编辑和添加文本教学课时2课时

教学目标知识目标

1、掌握输入和编辑文本

2、学会插入文本，掌握设置文本格式的方法

能力目标掌握网页中三种常见列表的创建，及其各自的特点情感目标提高学生自主学习和团队竞争意识

教学重点插入和编辑文本

教学难点创建列表

教学资源1.教学场所：多媒体教室

2.教学设备：安装有Dreamweaver cs5软件的计算机

3.教学资料：辅助课件.多媒体教学软件

教法讲解法、任务驱动教学法学法小组讨论法

教学过程

过程安排教学内容教师活动学生活动设计意图

导入新课（5min）提问：在DW中输入文本和在Word中

输入文本有何区别？

将学生分组，并提

出问题，引导学生

小组之间讨论并

总结

讨论并思考以讨论的形式

提高学生之间

的交流沟通

任务一插入文本(20min) 一、插入文本

1、插入普通文本

2、插入不换行空格

3、插入水平线

4、插入日期和特殊字符

二、编辑文本

1、基本样式设置

2、设置段落格式

3、创建列表

演示并强调重点认真听讲并记

下重点

文本插入是基

础知识，为下

面任务二打下

基础

任务二(55min) 完成以下网页实例：1、引导学生讨论

该网页由哪几

部分组成

2、引导学生小组

组内分工，完

成小模块

小组讨论本实例即是对

任务一的巩

固，也为下一

次课打下基础

作业布置

1、找一篇文章输入至页面中，然后利用所学知识，对其进行格式编排

实训过程内容操作要求及步骤

任务一创建站点1、熟悉DW界面

2、在D盘根目录创建一个站点名称为《我的足球网》，本地站点文件夹为jcwww，如下图所示

任务二

设置默认图像

文件夹

利用教师所给素材，制作简单网页《我的偶像》，素材见文件夹

完善报告填写实训总结，并上交实习报告。

自主练习剩余时间，可进行自主练习，内容不限，但不可违反上机纪律

实训总结本次上机主要是让学生掌握站点的建立及输入文本和编辑文本等，学生操作较好，大部分能完成任务。

实训课题制作简单网页实训课时2课时

实训目标1、掌握新建网页、编辑文字、处理图像

2、新建站点

3、插入水平线、空格、自动更新时间

实训重点制作简单网页流程

实训难点综合运用HTML工具

实训方法上机实训

实训准备教案、素材、案例、教材、计算机机房

实训要求4、对照实习报告的要求，完成上机任务；

5、任务完成后及时要求教师考评；

6、完善实习报告，填写实训总结；

4、遵守实训纪律，不游戏，不睡觉，不高声谈论。

实训过程

内容操作要求及步骤

任务一

足球偶像网页1、熟悉DW菜单栏常用界面

2、完成以下简单网站，素材见素材库

完善报告填写实训总结，并上交实习报告。

自主练习剩余时间，可进行自主练习，内容不限，但不可违反上机纪律

实训总结本次上机内容较多，主要考察学生综合性的练习，如图片的插入，文字的编辑及水平线的插入等，需要学生对前面的知识非常熟悉，13高12班整体班级学习氛围较好，所有学生

都能按时上交作业，值得表扬

课题 2.2添加和编辑图像教学课时2课时

教学目标知识目标

1、掌握图像裁剪、重新取样、亮度、锐化的设置

2、掌握图像属性设置

能力目标掌握运用软件对图像处理的能力

情感目标提高学生团结合作精神，提高学生竞争意识教学重点图像的编辑

教学难点图像的编辑

教学资源1.教学场所：多媒体教室

2.教学设备：安装有Dreamweaver cs5软件的计算机

3.教学资料：辅助课件.多媒体教学软件

教法讲解法、任务驱动教学法学法小组讨论法

教学过程

过程安排教学内容教师活动学生活动设计意图

导入新课(5min) 前面介绍网页的时候有说过，在保

证画质的情况下，图片的数据量越

小越好。问题：如果一张图片数据

量很大，我们该如何编辑？

演示cluo.jpeg

这张图片，分析数

据量为93k、画质

为1024*768规格

的图片如何更改

数据量和规格？

分组讨论用什

么方法来更改

数据量和规格

提出问题引发

学生思考，引

出这次课的主

题

任务一编辑图片(30min) 给出cluo.jpeg和gg.jpeg两张图片

进行对比，提出任务：如何从

cluo.jpeg变化到gg.jpeg？

具体操作步骤：打开DW软件——插

入图像cluo.jpeg，对图片属性设置

如下目标值：

编辑完成后与原图像进行对比，会

发现数据量、规格都发生变化，但

浏览网页更友好

对图片宽、高、裁

切、重新采样、锐

化等设置进行演

示

观看教师演示，

并思考

cluo.jpeg变成

cluo.jpeg的方

法

引导学生学习

理论的时候思

考如何理论运

用到实践