《个教学单元说》PPT课件.ppt

1、黄冈职业技术学院计科系:孙小英,网页设计与制作,第2单元：茶文化网站的设计 任务4：二级页面的设计,目 录,一、教学目标,四、考核与反馈,二、教学内容,五、学法指导,三、教学设计,一、教学目标-课程描述,网页设计与制作这门课程是我院计算机网络技术专业的一门专业核心课程,本课程的先修课程是网页美工，与其后续课程动态网页设计、 DIV+CSS 相结合，形成满足职业岗位实际工作需要的课程体系,一、教学目标-课程目标,掌握网站规划、网站测试发布、维护管理方法；掌握文字、图像的处理方法；掌握表格的布局方法；掌握模板、框架的使用方法；掌握CSS的运用,职业能力目标,具备初步的网站开发、维护和管理能力；具备

2、独立撰写网站制作说明等科技文件的基本能力,具备信息收集、处理、加工的能力；具备静态网页设计的基本能力，能独立设计一个内容完整、图文并茂、技术运用得当的网站,职业素质目标,培养学生按时守信的诚实作风；乐观向上的敬业精神；沟通协作的团队意识；知识获取和应用的自主学习能力；探索实践的创新能力,一、教学目标-本次课的教学目标,知识目标： 掌握模板的创建与保存方法； 掌握模板中可编辑区域的设置； 掌握模板在网页中的应用,能力目标： 能熟练运用模板完成多个具有相同或相似布局的页面的设计,素质目标： 培养学生沟通协作的团队意识；知识获取和应用的自主学习能力；探索实践的创新能力,二、教学内容-教学内容的选取依

3、据,本课程教学的侧重点就在于页面的布局设计，在网页的设计中，最重要同时也是最难、最费时间的就是各页面的版式布局设计,1、依据教学目标的要求,2：依据网站设计风格的 一致性要求,3：依据网站的更新要求,在网页设计中还有一个重要的设计原则：网站应保持设计风格的一致性。而网站风格的一致性除了对文字格式、配色方案的要求外，还体现在页面布局风格的一致性要求上。在一个网站中，除了首页独立采用一种布局方案外，一般要求所有的二级页页采用相同或相近的布局，对所有的三级页面的设计要求也是如此,茶文化网的设计与制作,利用模板设计多个布局相同或相近的页面的共享结构，既可以节省设计时间，又可以保持页面布局风格的一致性，

4、同时也利于页面的更新操作,二、教学内容-教学内容的载体,1、教学任务：完成“凤凰旅游网”二级页面的设计（学生分组完成,二、教学内容-教学内容的载体,2、训练任务：完成“凤凰旅游网”二级页面的设计（学生独立完成,二、教学内容-教学重点、难点,教学重点,教学难点,模板的创建、保存与应用,模板的保存位置；模板中可编辑区域的定义与修改,三、教学设计-时间安排,复习旧课,任务布置及分析,讲练结合,扩展任务训练与评价,项目,时间,5分钟,15分钟,70分钟,90分钟,90分钟,三、教学设计-教学准备工作,分组情况按第一次上课时时确定的方案执行,上课之前将相关资料、素材分发给学生,素材准备,确定分组,教学组

5、织流程,一、复习旧课并 引入新课,二. 分析任务,三. 提出解决 方案,四、学生实施任 务、老师指导,三、教学设计-教学步骤,六、学生继续 实施任务,五、疑难问题 讲解,七、归纳总结,八、完成训练 任务及评价,1、复习旧课 布局表格的特点 标准表格与布局表格的区别 如何根据页面的版式设计需求合理选择相应表格,三、教学设计-具体过程,2、布置本次设计任务 打开茶文化网站各二级页面，展示网页效果，确定本次任务目标,3、任务分析 （）各子页面在布局上存在的共同点,三、教学设计-具体过程,各子页在布局上基本是相同或相近的,2）利用已学知识实现布局结构相同的网页的设计方法,方法1：每个页面单独进行设计

6、方法2：设计好一个页面后，在已经设计好的页面上直接进行修改，再通过“另存为”保存为其它网页,思考：以上设计方法有何缺点？（通过此问题引入模板这一应用。,4、提出解决方案 如果将所有子页面相同的格式设为模板，再通过模板建立不同的网页，即可解决上述问题 解决方案一： 、先设计一个子页面（如about.html) 2、通过“文件”“另存为模板”，将已设计好的页面存为模板 3、创建其它各个子页面并将模板应用于其中 解决方案二： 、先创建一个模板，在该模板中设计所有子页面相同或相近的布局格式 2、保存模板 3、通过模板创建各个子页面,三、教学设计-具体过程,5、学生开始实施任务、老师指导 对设计方案作简

7、单的说明后，要求学生按上课前所发的资料中提供的详细设计方案开始实施任务。在这一过程中，老师积极参与指导并记录下学生在任务实施过程中存在的问题。（由于在前一次课中已利用表格完成了其中一个子页面的设计，所以对于此次设计任务要求学生用第一种方案去实施。,三、教学设计-具体过程,6、疑难问题分析与讲解 针对学生在任务实施过程中出现的问题进行详细的分析与讲解,7、学生继续完成任务,7、归纳总结,三、教学设计-具体过程,对学生完成任务的情况进行点评，并针对典型问题进行讲解。最后对模板的设计知识进行归结总结,8、训练任务 要求学生按第二种方案完成“凤凰旅游网”所有二级页面的设计,三、教学设计-具体过程,9、

8、训练任务质量评价,通过训练任务既考核学生对于模板应用的掌握程度，又加强学生对表格布局的运用,扩展功能:重复区域的使用,四、考核反馈-考核方式,模板的创建与运用,页面布局的整体方案及效果,考核内容:图片文件是否单独存放于images文件 夹中；图片及网页的文件名是否使用合理的名称 分值比例:10,考核内容:模板的创建与运用 分值比例:60,考核内容:布局方案的合理性；布局效果的美观性 分值比例:30,针对学生对于扩展任务的完成质量进行评价,评价方式：采用学生自评与教师评价相结合的方法,四、考核反馈-教学反馈,反馈,课堂反馈 教师提问 学生提问 学生完成任务质量,课后反馈 QQ群 电子邮箱,五、学法指导,平时多看一些优秀的网站，学习他人之长,遇到不懂的问题要及时地向老师或同学请教,对于教学中的设计