网页设计及制作课时说课稿.pptVIP

课程名称：《网页设计与制作》项目三：精品课程网站任务四：《DIV+CSS布局技术及应用》  课程教学内容选取与安排 * * 说课人：王慧敏 内容的选取 与组织 课程目标 课程定位 课程介绍 课程定位 岗位核心领域课程 综合性 实践性 操作性 课程介绍 课程目标 网站设计与制作能力、团队协作能力、 沟通能力、分析解决问题能力、项目实施能力 内容选取组织 以教学仿真项目和企业实际项目为载体 重构和序化教学内容 课程设计（项目实训） 16 动态网站制作 15 静态网站动态化 14 表单应用 13 网站行为 12 模版与库的应用 11 DIV+CSS网页布局 10 CSS层叠样式表 9 HTML语言 8 页面布局与编辑 7 网页动画设计 6 网页色彩搭配网页布局 5 网站效果图设计 4 网站规划与设计 3 网站欣赏 2 网页设计基础知识 1 知识模块安排 编号 项目一 书法家庄辉个人网站 项目二 电子信息工程系迎评网站 项目三 精品课程网站 项目四 武威旅游网 项目五 佳佳商城用户及留言管理系统 课时说课 项目三：精品课程网 任务四：DIV+CSS布局技术及应用 提纲 课时定位 任务名称 职业素质及能力培养 课时数 项目三： 精品课程网站建设 网站前期策划及策划书的编写 沟通能力、策划能力、文档能力 2 网站效果图的设计、切片导出及动画设计 艺术素养、Photoshop设计 动画制作能力、创新创意能力 4 DIV+CSS网页布局技术基础知识 DIV+CSS网页布局技术、团队协作、项目实施能力 3 DIV+CSS布局技术及应用 6 JavaScript脚本代码的融合 JavaScript脚本代码的应用能力 4 使用模版完善静态网站 掌握网站模板的使用方法 2 应用行为增强网页动态效果 掌握网站行为的使用方法 2 项目总结与评价 具备检查、判断能力、语言表达能力、责任意识 2 教学目标 专业能力： 1.掌握单行单列布局、二列布局、三列布局的结构应用。 2.掌握DIV+CSS布局应用与技巧。 方法能力： 1.能独立进行信息的筛选与加工。 2.能独立制定、实施工作计划。 3.具有分析问题、解决问题的能力。 社会能力： 1.具有沟通能力及团队协作精神。 2.具有创新能力。 教学内容 利用DIV+CSS技术布局制作精品课程网站主页。 重点 掌握DIV+CSS布局应用与技巧，熟练CSS语法规则。 难点 深入理解布局的精髓——盒子模型以及如何灵活、 简练的应用。 教学内容 项目教学法 1 直观演示法 活动探究法 任务驱动法 小组讨论法 宏观： 微观 启发式教学方法 利用多媒体辅助教学 以学生为主体，以培养学生自主学习能力为出发点，让学生在学习中发现问题、分析问题、解决问题。主要应用以下方法： 自主探究法、总结反思法 项目导向 任务驱动 教师展示任务效果 教师提出任务目标 教师引导、解决疑难问题 展示与评价 布置课后拓展练习 学生自主探究 一 任务效果展示 二 提出任务目标 1、复习什么是CSS的盒子模型？盒子的属性？（引导、讨论） 提高自学兴趣，被动——主动 进一步明确本节课要实现的目标，设置四个问题来分析、讨论 采用DIV+CSS布局技术制作精品课程网站的主页 提高自学兴趣，被动——主动 进一步明确本节课要实现的目标，做到有的放矢 2.在网页中，一个div盒子是如何定义的？（回忆） div id=“盒子名称”/div 二 提出任务目标 #left #right 提高自学兴趣，被动——主动 进一步明确本节课要实现的目标，做到有的放矢 3.生活中的盒子有很多，同理，一张网页中的盒子也有很多(如图)，这些盒子是如何放置到网页中的？(引导、讨论） 通过插入多个DIV 二 提出任务目标 #header #footer 四个问题层层递进，既复习了上节课的重点内容，也为下面学生的自主探究打下坚实基础，帮助学生把握本节课的重、难点。 4.精品课程网站的主页是由许多盒子构成的，这些盒子是如何放置到网页中的？又是如何把它摆放得有模有样的？(引导、讨论） 通过插入多个DIV ,通过控制盒子外观的CSS样式表 二 提出任务目标 三 学生自主探究 1.学生分析精品课程网站主页的布局。 教师为主导 学生为主体 #footer #right_jx #right_jxzy #right_top_jcjs #right_top_kcjs #main_left #header 2. 根据分析，学生画出布局草图。 教师为主导 学生为主体 #footer #right_jx #right_jxzy #right_top_jcjs #right_top_kcjs #main_left