《网页设计与制作》信息化教学设计与实践

何 丽，李 蓉，刘卫红，曾 建

（广东农工商职业技术学院 计算机学院，广东 广州 510507）

一、引言

为加快推进信息技术融入职业教育改革发展的核心领域，按照《高等职业教育创新发展行动计划（2015-2018 年）》以及建设“人人皆学、处处能学、时时可学”的学习型社会的要求［1］，广东农工商职业技术学院开始积极探索教学信息化与课堂教学的深度融合。

《网页设计与制作》课程在教学改革中，针对课程在传统教学设计上存在的问题：学情分析不够深入、信息化技术手段运用缺失、教学过程难以把控等，以课程的一个教学单元作为切入点，基于混合式教学理念以及探究性学习理念，从教学目标设计、教学策略设计以及教学评价设计三个层面重塑教学结构，再造教学流程，打开学习网页开发的新思路，启发学生学习创新，提高教学质量。

二、信息化教学单元设计总体思路

教学单元设计中的“教学单元”来自于课程大纲的教材内容和进程表［2］。在教学设计过程中，为实现核心能力及能力指标，学生“如何学”成了引导教师思考的唯一议题。信息化教学单元设计总体思路［3］如下：

（一）教学目标重构设计

单元教学目标是从课程教学目标转化而来，并紧扣与之对应的专业能力指标。在学习者特征分析的前提下，按照课程教学目标分析学生在新的教学单元中涉及到的知识点以及理清知识点与知识点之间的联系；分析本单元教学目标与其它教学单元教学目标的关系；确定出知识、技能和素养目标以及教学重难点。为强化预期教学目标的实现，应采用可评测、可验收的方式进行阐述，让学生和教师都能更清晰了解本单元的学习内容和学习后应具备的能力。

（二）教学策略重构设计

依托教学平台，整合并优化教学资源，借助信息化技术手段以学生为中心开展教学活动。教学活动的开展分为三个阶段：课前准备阶段、课中发展阶段以及课后整合阶段。课前准备阶段的主要任务是借助学生原有学习经验激发学生学习新知的动力，明晰新知中学习重点，侧重于知识目标的达成。课中发展阶段的主要任务是检验准备阶段的效果、继续创造学习环境、展开各项学习活动，鼓励学生主动学习。课后整合阶段主要任务是整理学习内容、检验并展览教学目标、反省与改善。

（三）教学评价重构设计

教师通过教学平台追踪并分析学习数据，分阶段实时动态评测学生学习效果的同时，为学生提供学习改进建议，调整学习者的行为，为教师提供教学反思依据，全面总结教与学，有效达成教学三维目标，促进学习者持续发展。

三、信息化教学单元设计案例

（一）课程学习成果

结合“Web 前端开发工程师”的岗位需求，紧扣《国家职业教育改革实施方案》，参照软件技术专业人才培养方案和课程标准，确定了《网页设计与制作》课程的学习成果。本教学单元“随心而动的CSS 定位”为“任务六-Web 页面布局”中的子任务，对应学习成果为专业技能L05（如图1），即能根据实际需求设计网页布局。

（二）教学目标和教学重难点

本课程授课对象是高职软件技术专业一年级学生，学习者已掌握HTML 以及CSS 的基础知识，能应用盒子模型搭建网页结构，能区分块元素、行内块元素以及行内元素这三种基本网页元素类型，同时也能对这些元素进行相互转换。熟悉标准文档流以及浮动的布局规律，能利用不同网页元素进行网页纵向和横向布局。对新颖先进的信息化手段具有浓厚的兴趣，对“互联网+”世界充满好奇，勇于实践。但较缺乏空间想象、抽象思维能力；信息整合能力较差，以及软件质量意识薄弱。在学习者特征分析基础上，通过对知识点的分解以及理清知识点之间的联系，确定出本教学单元的教学目标和教学重难点（如表1）。

（三）教学策略

本次教学单元采用了混合式教学方式来设计整个教学过程，通过融合现代教育技术与传统教学优势，从教师主导和学生主体相结合的视角出发，引进企业真实项目，依托教学平台，重塑教学结构，再造教学流程。整个教学过程分为以下3 个阶段［4］：

1.课前导学阶段，学生完成（局部作品初稿）；

2.课中研学阶段，学生解决课前作品中存在的问题，完成（局部作品终稿）；

3.课后练学阶段，学生完成完整作品的制作。

针对每个教学环节分别设计师生之间以及生生之间的教学活动（线上活动和线下活动），具体如表2所示。在整个教学实施过程中，采用基于移动端的多维积分评价系统为每个阶段生成教学评价，在评测学生学习效果的同时，为学生提供学习改进建议，为教师提供教学反思依据，有效达成教学三维目标。

（四）教学评价

图1 《网页设计与制作》课程学习成果

表1 《随心而动的CSS 定位》教学目标

本单元教学目标是通过课前导学、课中研学以及课后练学三个阶段达成，所以对学生的评价也是基于这三个阶段来设计。课前导学阶段：通过 “小程序”平台，学生对多种形式的导学作品（效果图、核心代码、思维导图、汇报视频等）进行投票，形成“课前导学”阶段积分；课中研学阶段：通过 “小程序”平台，教师对研学阶段作品依据电子量规进行评价，形成“课中研学”阶段积分；课后练学阶段：通过“小程序”平台作为入口完成理论部分的自动化评测，同时由教师基于练学量规完成课后电子作品的评价，由企业专家抽样完成专业点评。进而形成“课中研学”阶段积分；每个阶段的积分会自动化通过系统进行累计，最后为每一位学生生成本教学单元的总积分，同时为学生给出改进性建议。

表2 《随心而动的CSS 定位》教学活动

四、结束语

通过合理的使用信息化手段（如微课、思维导图、CSS Mindmap、FLASH 动画、直播等）弥补了学生信息整合能力不强的弱点，突破了传统教学的重点和难点。采用教学平台加强课程教学管理，有效达成教学目标。对比往届学生，优秀作品的比例提高了25%；采用基于成果导向的信息化教学方式得到了学生高度认可。同时，作为一名计算机专任教师，通过对一个教学单元深入进行成果导向的信息化教学设计与实践，也进一步促进自身对《网页设计与制作》课程的教学改革。截止目前，已完成整个课程的信息化平台建设。实践结果表明，网页设计与制作课程教学单元信息化教学设计的教学效果明显，具有可借鉴性和一定的推广价值，同时也有待大家进一步深入研究。