创建模板公开课教案教学设计课件资料.docxVIP

创建模板

课时：1课时

备课时间：2023.11.16

授课时间：2023.11.31

教学目标：

知识目标：了解网页制作模板作用。

能力目标：学会制作模板，创建可编辑区域

情感目标：通过使用模板制作网页，对网页制作产生学习兴趣

思政目标：养成工作仔细认真的品格

教学重点：创建模板的三种方法

教学难点：四种模板的主要区域

教学方法：讲授法、提问法、情境教学法、任务驱动法

xx

内容

xx

xx

设计意图

课前准备

1.将微视频发送给xx，让xx根据微视频熟悉模板、四种模板的主要区域

2.用问卷星收集反馈

1.观看视频，对照书本知识点理解模板、四种模板的主要区域

2.通过问卷星分享自己对这几个知识点的理解，疑问

通过课前准备，让学生明白自己的薄弱点，让xx适时调整教学重难点

情境导入

“同学们，双十一前不久结束了，在双十一大部分人都在感受购物的快乐、赚钱的快乐，然而有一批人很苦恼，那就是负责网店装修的工作人员，因为要更换店铺网页，请在以下的几个选项中，选出能帮助到他们的选项

1.理解淘宝PC端双十一结束后这个情境，思考网页制作难题，

2.在DIV、表格、网页模板三个选项中选出能提升网页制作效率的功能

正确答案：网页模板

通过双十一引起学生关注，情境问题导入

新知呈现

【任务实施1】

现在老师已经下发了一个练一练的操作视频，请同学们根据老师提供的视频，尝试创建模板、另存为模板和添加可编辑区域的操作

【任务实施2】

现在老师已经下发了一个修改网页的操作视频，请同学们根据老师提供的网页，为其中的四张商品图片分别添加可编辑区域、可选区域、重复区域、可编辑的可选区域，另存为模板，模板命名为xxxxxxxx

【展示评价】邀请同学上台展示：老师随机选择一位同学，请他来展示一下自己的制作成功，也可以分享一下自己遇到的问题

对问题：请学生答疑，同学没有办法的时候老师再讲解

对成果展示：以鼓励为主

【任务1】根据老师提供的操作视频，尝试创建模板、另存为模板和添加可编辑区域的操作（如果有问题，举手提出）

创建模板的三种方法

1.使用“新建文档”对话框创建：在DreamweaverCS6中，选择【文件】/【新建】命令，打开“新建文档”对话框，在其中选择“空模板”选项卡，在“模板类型”列表框中选择“HTML模板”选项，在“布局”列表框中选择一种布局样式，单击“创建“按钮，完成创建。

2.在“资源”浮动面板中创建：选择【窗口】/【资源】命令，打开“资源”浮动面板，单击其左侧的“模板”按钮切换到“模板”分类，再单击“新建模板”按钮，新建模板。

3.使用“插入”浮动面板或菜单命令创建：新建或打开一个普通的HTML文档，然后在“插入”浮动面板的“常用”分类列表中单击“模板”按钮，在弹出的下拉列表中选择“创建模板”选项或选择【插入】/【模板对象】/【创建模板】命令。

【任务2】根据老师提供的网页，为其中的四张商品图片分别添加可编辑区域、可选区域、重复区域、可编辑的可选区域，另存为模板，模板命名为xxxxxxxx（如果有问题，举手提出）

（1）为模板添加可编辑区域。

1.通过菜单命令插入：在“模板”网页中目标位置定位插入点（或选中目标元素），选择【插入】/【模板对象】/【可编辑区域】命令（或按Ctrl+Alt+V组合键），打开“新建可编辑区域”对话框，在“名称”文本框中为添加的可编辑区域命名，单击“确定”按钮即可完成插入“可编辑区域”的操作。

2.通过“插入”浮动面板插入：在“模板”中目标位置定位插入点（或选中目标元素），在“插入”浮动面板的“常用”分类列表中单击“模板”按钮，在弹出的下拉列表中选择“可编辑区域”选项，在打开的对话框中进行命名后，单击“确定”按钮，完成插入“可编辑区域”的操作。（可选区域、重复区域、可编辑的可选区域的创建操作与可编辑区域类似，区别在于最后一步创建功能的时候选择可选区域、重复区域、可编辑的可选区域）

（2）另存为模板：新建一个网页，选择【文件】/【另存为模板】命令在弹出的对话框中选择好站点，修改模板名称为xxxxxxxx，点击保存

2分享自己创建模板的步骤，以及分享自己在制作模板时遇到的问题（在老师解答问题后，自己尝试修正）

通过递进式的实操练习，让学生熟悉模板制作，最好能自主发现问题

巩固提升

请同学完成以下课堂练习，5分钟后选择两位同学分享一下答案

1.完成题目

课堂练习题目：

1.模板文件的扩展名为()。

A.htmB.aspC.dwtD.lbi

2.在DreamweaverCS6软件中，关于创建模板的说法正确的是()。

A.在模板子面板中单击左下角的NewTemplate按钮，可以建立新模板

B.在模板子面板中双击已命名的名字，可