网页制作下期电子教案文档格式.docx
- 文档编号:6483624
- 上传时间:2023-05-06
- 格式:DOCX
- 页数:59
- 大小:3.96MB
网页制作下期电子教案文档格式.docx
《网页制作下期电子教案文档格式.docx》由会员分享,可在线阅读,更多相关《网页制作下期电子教案文档格式.docx(59页珍藏版)》请在冰点文库上搜索。
个性化设计
●教学课件参照:
div图层课件
●
引入:
由实践内容效果图引入本课内容:
●实践步骤:
一、准备素材,建立站点、建立新的网页文件
二、在网页中插入文字图片及div图层
三、编辑图层的属性,对图层进行嵌套
四、参照实践内容效果图完成“环游世界网页”的制作
五、浏览修改并保存
六、老师巡回指导学生完成实践任务
通过案例的教学方式,提高学生的学习兴趣
板书设计:
见PPT
课时评测设计:
网页制作完成后由老师进行检查评价
教学后记:
大部分同学都能很好地完成实践任务
3-6
4
2013-9-3
APDiv布局(案例:
冷酷青春网页的制作)
2、学会利用div与表格相结合进行布局
3、完成“冷酷青春网页”的制作
DIV元素和表格结合使用
计算机+dwcs4+素材(冷酷青春网页素材)
●教学理论内容参照课件:
APDIV布局课件
●引入:
由实践内容效果图引入本课
实践步骤:
一、准备素材,建立站点、建立新的网页文件,首页取名为index.html
二、在网页中插入文字、图片、表格、div图层等内容,并进行相关属性的设置
三、学会设置div图层,并根据CSS完成对版面的美化操作
四、参照实践内容效果图完成“冷酷青春网页”的制作
五、浏览修改,保存网页
六、巡回指导学生完成实践任务
通过案例难度的提高,可以让学生更加熟练地掌握APDIV的布局方式
学生完成任务后由老师进行检查给予指导评价
学生能够灵活应用上一个案例所学到的内容,对所学知识进一步扩展
7
1
2013-9-6
课题
总结“环游世界网页”和“冷酷青春网页”的制作情况
教学目标
总结归纳学生在制作“环游世界网页”与“冷酷青春网页”时所出现的问题
教学重难点
APDIV的嵌套
教学准备
多媒体和已经制作好的“环游世界网页”与“冷酷青春网页”
由学生的作品引入本课
●教学过程:
1、在电脑上打开两个网页,把网页展示给学生看
2、简单介绍这两个网页的制作方法及所需要的技能
二、由学生总结归纳出在制作“环游世界网页”和“冷酷青春网页”时出现的问题及难点。
三、老师逐个分析这些问题,并帮助学生理解这些困难点,与学生共同探索制作网页的一些好方法
四、学生上台操作这两个网页制作过程中的关键地方
采用学生与老师互动的教学模式,极大地提高了学生的积极性
学生积极性不高,配合情况不是很好
8-13
6
2013-9-9
CSS样式(案例:
青岛教育在线网页的制作)
1、能够熟练利用CSS样式对网页进行美化
2、能够修改操作CSS样式
3、完成“青岛教育在线网页”的制作
CSS的使用
计算机+dwcs4+素材(青岛教育在线网页素材)
CSS样式课件
1.准备素材,建立站点
2.建立新的网页文件,取名为index.html
3.在网页中插入各种文字、图片、表格、表单并进行属性设置
4.应用css样式完成对网页的美化
5.参照实践内容效果图完成“青岛教育在线网页”的制作
6.浏览修改,保存网页
7.巡回指导学生完成实践任务
青岛教育在线这个网页是一个综合性比较强的案例,通过完成它,可以增强学生对网页中各种元素熟练操作的能力
该案例较复杂,学生完成的速度比较慢,所以需要的课时数较多,通过完成这个案例,学生的耐心与能力有了明显提高
14
2013-9-13
总结“青岛在线教育”网页的制作情况
总结归纳出“青岛在线教育”网页的制作方法
表格的嵌套及美化
多媒体和制作完成的“青岛在线教育”网页
●教学过程
一、在电脑上打开已经完成的“青岛在线教育”网页
二、学生总结制作“青岛在线教育”时出现的问题。
三、老师逐个操作学生所提出难点之处
四、抽个别学生上台自己操作完成
气氛较活跃,但有少部分学生没有参与进来
15-16
2013-9-16
DIV+CSS网页布局)
●实训目标
1、学会把DIV和CSS相结合在一起对网页进行布局
2、制作完成“DIV+CSS布局”网页,掌握这种布局方式
CSS与DIV相结合的设置方法
计算机+dwcs4+效果图
实践内容效果图
一、准备素材,建立站点、建立新的网页文件,名字自定
二、在网页中插入DIV标签,并用CSS进行属性设置
三、参照实践内容效果图完成“DIV+CSS”布局的制作
四、利用CSS对div进行美化
七、学生尝试对制作完成的网页框架填入内容,依照自己的想像力制作一个完整的,内容充实的网页文件
CSS样式是网页制作中较重要的内容,通过该案例的学习,可以使学生对CSS样式的掌握更加全面
学生完成情况良好,但对CSS这个概念的理解还不是很充分
17-18
2013-9-17
本地站点的创建(案例:
我的足球网首页)
1、学会创建和管理本地站点
2、完成“我的足球网”首页的制作
理解本地站点与站点文件夹之间的关系
计算机+dwcs4+素材(我的足球网首页素材)
本地站点创建课件
二、修改本地站点的文件夹目录,指定默认的图像文件夹的位置
三、设置页面属性的内容,包括标题,背景,字体字号等
四、参照实践内容效果图完成“我的足球网首页”的制作
通过详细了解网站中网页文件和文件夹与磁盘之间的关系,从而使学生对于网站从抽象到客观有个大体的了解
网页内容较简单,同学们完成得较好,可以很好地建立学生学习网页制作的自信心
19-20
2013-9-23
卡通世界网页)
1、了解本地站点与磁盘文件之间的关系
2、熟练操作本地站点文件夹
3、完成“卡通世界网页”的制作
本地站点与站点文件夹之间的关系
计算机+dwcs4+素材(卡通世界网页素材)
一、准备素材,建立站点、建立新的网页文件,文件取名为ktsj.html
二、修改本地站点的文件夹目录,使之与素材文件夹对应
三、设置页面属性的内容
四、参照实践内容的效果图完成“卡通世界网页”的制作
通过实践任务的循序渐近,加深了学生对站点含义的了解。
网页内容中增加了表格,为下一节课做铺垫
21
2013
总结“DIV+CSS布局”、“我的足球网首页”和“卡通世界网页”的完成情况
总结归纳出前面六节课学习到的三个网页所需要的知识点及操作技能
站点与站点文件夹的含义及关系
多媒体和制作完成的“DIV+CSS布局”、“我的足球网首页”和“卡通世界网页”网页
由学生完成的有缺陷的作品引入本课
一、在电脑上打开已经完成的“DIV+CSS布局”、“我的足球网首页”和“卡通世界网页”网页
二、学生总结归纳出制作上面三个网页时出现的问题。
三、老师逐个操作和讲解学生所提出的问题
四、个别学生上台操作完成网页关键点
由学生总结在网页制作过程中出现的问题,老师辅助学生完成关键点的更正,师生互动性强。
主要由学生进行总结,老师辅助完成,这样可以锻炼学生的归纳及表达能力
22-23
2013-9
网页中的图文混排(案例:
我与足球网)
1、能够在网页中插入图片
2、学会在网页中编辑文字
3、完成“我与足球”网页的制作
图片和文字如何排列在一起
计算机+dwcs4+素材(我与足球网素材)
图文混排课件
C:
\work\wincode\data\241084457\ppt\第23-30课时.ppt
一、准备素材,建立站点、建立新的网页文件,网页文件取名为me.html
二、修改站点文件夹的目录,与“我的足球网”站点文件夹对应
三、对页面属性进行设置,在网页中插入图片、文字、表格,并对其进行属性的设置
四、在网页中插入鼠标经过图像,并进行属性设置
五、参照实践内容效果图完成“我与足球”网页的制作
六、浏览修改,保存网页
七、巡回指导学生完成实践任务
通过插入一个生动的鼠标经过图像,增加了网页制作的趣味性
图文混排是制作网页过程中最简单也是最重要的内容,学生基本上可以掌握
24-25
2013-9-20
图文混排(案例:
“再别康桥”网页和“我不知道风”网页)
1、学会在网页中插入图片、编辑文字
2、初步认识表格的布局方式
3、完成“再别康桥”网页和“我不知道风”网页的制作
熟练掌握图文混排的方法
计算机+dwcs4+素材(再别康桥我不知道风素材)
图文混排
一、准备素材,建立站点,建立两个新的网页文件,分别取名为kq.html和feng.html
二、对页面背景进行设置,在网页中插入图片文字和表格,并进行属性设置
三、利用css样式设置网页元素的格式,美化网页
四、参照实践内容效果图完成“再别康桥”网页和“我不知道风”网页的制作
五、浏览,修改保存
●实践内容效果图:
通过老师讲解一个网页,学生自己独立完成另外一个相似的网页,锻炼了学生的动手能力和领悟能力
两个网页,由老师讲解一个,学生自己做另外一个相似的,大部分同学可以活学活用。
26-27
2013-9-24
表格布局(案例:
“足球明星”网页)
1、学会在网页中用表格进行布局
2、熟练操作表格和单元格的各项属性
3、完成“足球明星网页”的制作
表格的属性设置及表格的嵌套
计算机+dwcs4+素材(足球明星素材)
表格布局课件
二、对页面进行设置,在网页中插入表格及图片文字
三、参照实践内容效果图完成“足球明星网页”的制作
四、浏览修改,保存网页
五、巡回指导学生完成实践任务
网页中表格的使用频率是最高,也是操作难度最高的,所以学生得熟练掌握,该案例的选择恰好可以体现这两点
学生对表格的布局掌握得还不够,需要多多做案例
28
2013-9-27
总结“我与足球网”、“再别康桥”和“足球明星”网页的完成情况
总结归纳出前面六节课所学习的三个网页的知识点及操作技能
表格的布局
多媒体和制作完成的“我与足球网”、“再别康桥”和“足球明星”网页
一、在电脑上打开已经完成的“我与足球网”、“再别康桥”和“足球明星”网页
二、学生通过对比自己的作品,总结制作上面三个网页时出现的问题。
三、老师逐个演示学生制作过程中出现的关键点
四、抽个别学生上台自己操作
互动性强,且可以锻炼学生的胆量及分析问题的能力
主要由学生提出制作网页过程中遇到的困难,然后其它的学生讨论归纳来解决问题
29-32
2013-9-28
表格布局(案例“悠悠音乐”网页)
2、熟练利用css样式对表格进行美化操作
3、完成“悠悠音乐网页”的制作
表格的美化
计算机+dwcs4+素材(悠悠音乐素材)
二、对页面进行设置,在网页在插入表格和其它的对象,并对表格进行美化操作
三、参照实践内容效果图完成“悠悠音乐网页”的制作
通过表格的美化操作,使学生知道,网页是可以多姿多彩的
学生基础不扎实,学习速度较慢
33-34
2013-10-7
框架布局(案例:
“HTML教程”网页)
1、学会在网页中利用框架进行布局
2、熟练操作框架及属性设置
3、完成“HTML教程”网页的制作
框架的保存方法
计算机+dwcs4+素材(HTML教程素材)
框架布局课件
二、在页面中插入框架,保存框架名:
整个网页文件为index.html,左框架为left.html,顶部框架为top.html,主框架为main.html
三、对各个框架页面进行页面属性的设置,同时设置左框架页面的超级链接,打开目标为主框架
四、参照实践内容效果图完成“HTML教程”网页的制作
通过该课的学习,可以让学生了解到框架与网页文件之间的关系
框架的保存这个知识点,学生还没有完全掌握
35
总结“悠悠音乐”网页和“HTML教程”网页的完成情况
总结归纳出前面六节课所学习的两个网页的知识点及操作技能
框架的保存与操作方法
多媒体和制作完成的“悠悠音乐网页”、“HTML教程网页”
由学生的作品引入本课内容
一、在电脑上打开已经完成的“悠悠音乐网页”、“HTML教程网页”
二、学生总结一下制作“悠悠音乐网页”、“HTML教程网页”时出现的问题及困难。
三、老师逐个演示学生制作过程中出现的困难点
通过归纳总结,可以知道学生在学习网页制作过程中遇到的困难,从而调整教学重点内容
学生学习速度比较慢,需要更多的耐心来教他们
36-37
2013-10-8
“我的家园”网页)
1、能够熟练的操作框架
2、能够利用框架与表格相结合的布局方式制作网页
3、完成“我的家园”网页的制作
框架的保存和布局
计算机+dwcs4+素材(我的家园素材)
一、准备素材,建立站点、建立新的网页文件,取名为myhome.html
二、在页面中插入框架,保存框架,各框架名称自己定
三、在各个框架中插入表格及其它页面元素,并进行相关属性设置障碍
四、设置网页的超级链接,打开目标为主框架中
五、参照实践内容效果图完成“我的家园”网页的制作
八、自己反复操作框架的保存,理解框架与网页文件之间的关系
通过表格与框架相结合的布局方式,让学生对网页的布局有更加全面的认识
完成两个框架案例后,学生重新认识了框架的含义
38-41
2013-10-10
“多媒体示例”网页)
1、能够在网页中插入多媒体元素
2、能够熟练设置多媒体元素的属性
3、完成“多媒体示例”网页的制作
背景音乐及插件的插入方法
计算机+dwcs4+素材(多媒体示例素材)
插入多媒体课件
二、在网页中插入SWF动画、flash视频、背景音乐、MP3播放器,MP4电影及其它的插件
三、参照实践内容效果图完成“多媒体示例”网页的制作
通过学习在网页中插入多媒体元素,使网页更加生动有趣,极大了提升了学生的学习兴趣
该节内容生动有趣,学生兴趣深厚
42
2013-10-11
总结“我的家园网页”、“多媒体示例”网页的完成情况
多媒体的插入方法及文件格式
多媒体和制作完成“我的家园网页”、“多媒体示例”网页
由学生上机的作品引入本节课
一、在电脑上打开已经完成的“我的家园网页”、“多媒体示例”网页
二、学生总结一下制作“我的家园网页”、“多媒体示例”网页时出现的问题及困难。
由学生提出实践中出现的问题,并进行总结归纳,可以很好的了解学生实践操作中出现的问题
学生的总结归纳能够已经有所提高
43-46
2013-10-14
插入多媒体(案例“旅游网”网页)
1、能够在网页中熟练插入视频,动画等多媒体元素
2、在网页中用表格进行布
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 网页 制作 下期 电子 教案