网站建设教学设计

《网站建设教学设计》由会员分享，可在线阅读，更多相关《网站建设教学设计（8页珍藏版）》请在金锄头文库上搜索。

1、1网站建设教学设计一、教学内容分析网站建设课程是中职 计算机 专业 2015 年级 第二 学期开设的 专业课，选用 杨丽芳、曹玉婵主编，四川大学出版社出版的中等职业教育课程改革国家规划新教材网站建设案例教程 。全书分为十五 项目，第 六项目第 3 个内容使用 AP DIV的 spry 效果既是本项目也是网站建设的核心内容及教学重点，教材中的相关知识技能也是学生必须了解掌握的，因为只有了解掌握这些才会对在网站建设具有更大的进步。提高学生在网站建设这方面的能力。二、教学对象特征分析教学对象为本校 2015 级 年级 计算机 专业学生，具有以下特点：1.学习态度作为中专的学生各方面的基础都比较差、自

2、制力不强、学习的自觉性不高，对理论重视不够，对学习有厌倦的心理。2.学生整体知识情况学生们的知识发展不均衡，一些学生对于网页制作比较熟悉，但是部分学生的基础较差，对于之前学习的网页设计内容全然不懂。3.学生对于网站建设的兴趣作为 15 级计算机的学生，部分学生对该门课程表现出浓厚的兴趣，而也有相当部分同学产生一种厌倦的心理，认为自己自己以后不想从事该类型工作，学了没有用途，因此对于学习该课程的兴趣不高。三、教学目标1知识与技能目标（认知目标）（1）指导学生了解各种类型 spry。 （2）讲解并且让学生掌握使用 spry 的方法。 （3）能根据实际情况，在网页中插入合适的 spry2过程与方法目

3、标（能力目标）（1）通过教师演示让学生，让学生更直观掌握 spry 的插入（2）让学生通过练习巩固 spry 的使用。23情感态度和价值观目标（1）培养学生学习网站建设的兴趣（2）鼓励学生认真思考，锻炼自我创新能力四、教学重点、难点重点 Spry 构件的使用、spry 特效。难点 灵活合理地使用 spry 功能五、教学策略选择与设计1讲解法2演示法：3项目驱动法：六、教学环境及资源准备教学媒体类型 教学媒体运用方式 作用（原创）主课件制作 ppt 课件，在其中插入文字、以及与课程相关的图片在课件中详细说明操作步骤，是学生更容易掌握。软件 Dreamweaver CS6 教学软件多媒体机房 10

4、4 机房七、教学过程教学活动 1（5 分钟）（ 一）导入新课1.知识回顾：由学生一起回顾如何使用 Ap DIV进行网页布局。2. 展示一个网站，引发思考：由老师提问是否经常在网页上看到中形式的菜单栏？因为这种形式的菜单栏在现实的网站中经常见到，从而会引起学生的兴趣3. 引入课题：提问学生“你们想知道这种效果的菜单栏是怎么实现的么？这个就涉及到我们今天学习的内容。 “”由于学生想知道这种菜单栏是怎么做的，利用此点引入课题，可以很好地激发学生主动学习的欲望3教学活动 2（5 分钟）（二）讲解 Spry 功能的组成 Spry 构件。（1）Spry 菜单栏（2）Spry 选项卡式面板（3）Spry 折

5、叠式（4）Spry 折叠面板 Spry 特效。 。为学生讲解Spry 功能，使学生有个初步了解，也给学生展示了这节课的主要内容，提高学生的学习欲望。教学活动 3（30 分钟）（三）spry 功能的具体讲解此部分通过在课件上步骤，由教师进行示范演示操作。 1. 知识点一：Spry 菜单栏(1)插入 Spry 菜单栏 “插入”栏|“Spry”类型|“Spry 菜单栏”按钮或 菜单栏“插入”|“布局对象”|“Spry 菜单栏”或 “插入”|“Spry”|“Spry 菜单栏”命令。 在弹出的“Spry 菜单栏”对话框中选择“水平”或“垂直” ，然后单击“确定”按钮。（2）编辑 Spry 菜单栏属性“菜

6、单项”“添加菜单项”按钮“删除菜单项”按钮“上移项” 、 “下移项”按钮“链接”“目标”（3）设置 Spry 菜单栏样式设置方法：先选中要设置的菜单（单击选中） 。然后在“属性”面板中选择“样式”就可以进行设置（4）保存含有“Spry 菜单栏”的页面通过教师操作演示引出相关知识点，由简到难，步步深入，引出知识点4教学活动 32. 知识点二：Spry 选项卡式面板（1）插入选项卡式面板 “插入”栏|“Spry”类型|“Spry 选项卡面板 ”按钮或 菜单栏“插入”|“布局对象”|“Spry 选项卡面板 ”或 “插入”|“Spry”|“Spry 选项卡面板 ”命令。对于插入到网页中的“Spry 选

7、项卡式面板” ，单击左上角的蓝色区域即表示选择了该“Spry选项卡式面板” ，进行编辑操作。（2）添加与删除选择卡面板 在“文档”窗口中单击选项卡左上角的蓝色区域选择该“Spry 选项卡式面板” 。 在“属性”面板中，单击“添加面板”按钮或“删除面板”按钮。（3）设置默认的打开面板 在“文档”窗口中单击选项卡左上角的蓝色区域选择该“Spry 选项卡式面板” 。 在“属性”面板中，从“默认面板”下拉列表中选择默认情况下要打开的面板。（4）编辑面板 将鼠标定位在选项卡标题所在区域即可对该标题进行编辑操作。 对于插入到页面中各“Spry 选项卡式面板”所对应的内容，鼠标移动到相应的“Spry 选项卡

8、”标题时，会显示“单击以显示面板内容”按钮，单击该按钮即可显示面板内容。（5）调整选项卡面板的顺序在“属性”面板中，通过“在列表中向上移动面板”按钮和“在列表中向下移动面板”按钮对页面中的“Spry 选择卡”进行左右排序。53. 知识点三：Spry 折叠式（1）插入“Spry 折叠式”（2）添加与删除选择卡面板 在“文档”窗口中选择一个折叠构件。 在“属性”面板中单击“面板”旁边的加号 (+) 按钮或减号（-）按钮。 （可选）更改面板的名称，方法是在“设计”视图中选择面板的文本并对其进行修改（3）更改面板的顺序在“属性”面板中，通过“在列表中向上移动面板”按钮和“在列表中向下移动面板”按钮对页

9、面中的面板进行上下排序。（4）打开面板进行编辑请执行下列操作之一： 将鼠标指针移到要在“设计”视图中打开的面板的选项卡上，然后单击出现在该选项卡右侧的眼睛图标。在“文档”窗口中选择一个折叠构件，然后在“属性”面板的“面板”菜单中选择要进行编辑的面板。4. 知识点四：Spry 可折叠面板（1）打开或关闭可折叠面板（2）设置可折叠面板的默认状态 在“文档”窗口中选择一个可折叠面板构件。 在“属性”面板中，从“默认状态”弹出菜单中选择“打开”或“已关闭” 。（3）启用或禁用可折叠面板的动画 在“文档”窗口中选择一个可折叠面板构件。 在“属性”面板中，勾选或撤选“启用动画”复选框即可。65. 知识点五

10、：Spry 效果（1） spry 效果介绍：“Spry 效果”是视觉增强功能，可应用于使用JavaScript 的 HTML 页面上几乎所有的元素。要向某个元素应用效果，该元素当前必须处于选定状态，或者它必须具有一个 ID。 （2） spry 效果的类型（3） 添加 spry 效果的方法 选中某个 Spry 对象，在“行为”面板中单击“+”按钮， 从菜单中选择“效果”|各 Spry 效果命令。 在弹出的对话框中进行相应的属性设置。、教学活动 4（35 分钟）（四）作业练习要求学生进行作业练习，完成后作品打包提交。通过大量练习，可以发现学生存在的问题，及时给予纠正，巩固本堂课程所学习的知识，并通

11、过练习，让学生学会举一反三，解决实际问题教学活动 5（5 分钟）（五）归纳总结，畅谈收获。1Spry 功能的组成；2.spry 中的知识点；3.指出学生经常出错的地方，提醒注意。归纳可以强化学习效果7教学流程图八、教学评价1. 评价方法：学生、教师综合评价法。2.评价量表九、教学设计特色和反思任务布置任务实施创设情景 明确任务学习操作 体验实践 做中教习得归纳 经验分享做中学小组探究 教师指导分解任务角色体验合作探究任务拓展知识迁移课后作业 拓展学习导入主体类比迁移 集体评价 任务检验 知识总结8特色：强调问题创设的情境性：教学从问题、课题、任务开始，以“任务驱动”和“问题解决”作为学习和研究活动的主线，以此来驱动学生的学习。这一特点的理论依据是“建构主义学习观认为，学习活动是发生在一定情境中的，学习要选择真实性任务，以解决学生在现实生活中遇到的问题为目标。”反思：本课总体上完成了事先预设的教学目标，引导学生合作交流，使得学生能参与其中，体现了学生学位主体，老师教为辅助，省时省力，高效。当然，本课也有许多不足之处。今后，要积极听课，积极反思，积极实践，努力提高教学技能，更上一层楼。