. 项目化实战教程
《网页设计与制作》 项目单元教学设计
编号：0101
学 校：
专 业： 项目单元： 赏析典型网站 授课教师：
0 / 7
. 《网页设计与制作》教学设计 编号：0101
项目名称 项目单元名称 计算机系部网站建设 赏析典型网站 任课教师 章节 第一章 任课班级 课时 4 （1）了解优秀网站的布局结构 知识目标 （2）了解优秀网站的色彩搭配 （3）对网页的组成元素有一定的了解 教学目标 技能目标 （1）能针对优秀网站的布局结构及色彩搭配进行分析 （2）具备自我收集资料进行分析、归纳整理的能力 明确课程要学什么，学完该课程自己能做什么，引导学生对该课程产生情感态度 浓厚的兴趣，有动力学好该门课程。 （1）了解网页制作相关概念 教学内容 （2）熟悉网站开发流程 （3）欣赏并分析典型网站 重点 难点 欣赏典型网站并分析典型网站，明确本门课程最终实现目标。 在掌握网站设计基本概念的基础上具备赏析和分析网站的能力。 教学重点和难点 教学方法和策略 教学方法：项目展示法，把知识点融入到项目中讲解。 教学策略：通过典型项目展示，在项目中引导学生掌握该课程相关知识点。 秉承“授人以鱼不如授人以渔”的总体教学理念。 通过项目展示，引导学生掌握知识点的同时，掌握该门课程的学习方法，并积极、主动的通过网络去自我汲取课程相关知识，开阔知识面。 教学设计思路 1 / 7
. 教学实施步骤 宏观导入课程： 教师活动 学生活动 1、 专业课程体系简介 2、 本课程与其它课程之间的关系 3、 本课程对应的社会职位：网页设计师 ? 展示最新社会招聘网页设计师信息 ? 网页设计师发展现状数据统计资料 ? 网页设计师发展趋势数据预测资料 项 目 单 元 导 入 4、 要想成为网页设计师需要具备的综合素质 以提问的方式引入本单元，把学生的思维聚合到本门课程上来，并活跃气氛。 问题：你印象最深的网站是哪个网站？是什么吸引了你？ 注意：教师可事先准备一个自己印象最深的网站，描述一下自己的感受，引导学生表达自己的看法。 讨论： 学生针对自己印象最深的网站展开讨论 目的： （1）引导学生对该课程产生兴趣。 （2）强调沟通、表达的重要性。 学生从宏观角度掌握自己专业课程体系，了解本课程与其它课程之间的相互关系，认识本门课程对应的社会职位。 2 / 7
. 一、赏析典型网站 1. 赏析综合性门户网站 2. 赏析电子商务型网站 3. 赏析校园系部信息网站 二、赏析的角度（结合案例） 1. 网站页面元素 以下知识点结合案例展示进行讲解。 1.2.1 网页制作相关概念 ? WWW ? 网页 ? 网站 ? 静态网页与动态网页 ? HTML语言 ? URL ? IP地址 ? 域名 1.2.2 网页构成的基本元素 ? 文本 ? 图像 ? 动画 ? 音频和视频 ? 表单 2. 页面布局 结合案例进行讲解布局类型 ? “国”字型布局 ? “厂”字型布局 ? “封面”型布局 ? Flash型布局 ? 变化型布局 3. 网站风格 涉及到的知识点： 1.2.4 网站风格定位 （1）协调运用颜色 （2）适当选择线条和形状。 （3）均衡的分割版式。 学生辩证去欣赏和分析并随时和教师进行互动，表达自己对网站布局及风格定位的理解。 （1）具备一定的赏析网站能力； （2）结合欣赏分析网站，掌握网站相关理论知识点。 学生通过视觉感受网站，深刻理解概念 ? ? ? ? ? ? ? ? 学生通过视觉感受网站，重点掌握以下布局类型： ? “国”字型布局 ? “厂”字型布局 ? “封面”型布局 引导学生记录笔记。 WWW 网页 网站 文本 图像 动画 音频和视频 表单 3 / 7
. 三、通过创建一个测试页面来展开对网站开发工具的介绍 跟学生探讨对网站开发工具的认识，了解学生对网站建设的认知度，并引导学生业余时间查看网站开发工具都有那些，进行比较。 了解网站开发工具并具备自己主动查找资料的意识。 四、网站开发流程 ? 网站需求分析及策划 ? 网站设计与制作 ? 测试发布 ? 维护推广 探讨网站开发总体流程，引导学生根据个人具体情况，从一个知识点出发根据自己的思维想法去网络里探求知识 学生从宏观角度了解一个网站从无到有的过程。 五、知识拓展 涉及到的知识点： 1.4.1 网页创意设计思维 1.4.2 网页设计配色基础 六、讨论Web技术发展 引导学生不能只学习课上的知识点，一定要有自我拓展知识自我学习的能力 学生具备自我拓展知识的能力 展望未来WEB技术的发展，技术在不断发展，鼓励学生掌握前沿技术，为就业打好基础。 提高沟通和表达能力 项目单元 小结 本章节以“鉴赏优秀网站”为任务驱动，了解了网站的布局结构、色彩搭配，以及网页的相关概念、网页制作的基本流程，为网页的进一步设计制作奠定了基础。 （1）欣赏各大知名学院门户网站 项目单元 任务 （2）欣赏各大名校系部网站 （3）分析网站布局及风格定位 （4）欣赏并分析门户类网站站点、电商类网站站点、手机移动端网站站点。 4 / 7
网页设计与制作教案
