基于工学结合的《HTML&CSS网站设计》一体化课程建设

摘 要：高职院校担负着培养面向生产、建设、服务、管理第一线需要的高技能、应用型专门人才的使命，将工学结合和一体化教学综合运用是高职课程改革的有效方法。本文介绍了《HTML5&CSS3网站設计》课程建设思路，以及以培养学生综合职业素质能力为目标的任务导向一体化课程的教学设计等，为今后的高职课程改革提供一定的经验。

关键词：HTML5&CSS3 网站设计 工学结合 一体化 项目导向

一、引言

网站开发技术日新月异，尤其在近几年呈现多元化的发展，在网络直播、移动APP、微信小程序、桌面应用开发等应用领域处处可见。HTML5和CSS3是下一代Web应用的基础，使互联网进入了一个崭新的时代。高职院校网站开发类课程需要改革创新，将课程教学与市场需求、技术变革相结合，才能适应时代的发展。

二、课程建设基本情况

《HTML5&CSS3网站设计》课程以企业网站前端开发的岗位需求与工作过程为导向，将实际的案例项目为载体导入课堂引导基础教学，通过学习情境设计、教学设计、学习任务书编写、教学资源开发等环节进行课程内容的开发，从HTML5和CSS3的基础知识入手，重点讲解HTML5和CSS3新增功能和最新前端技术，通过大量实例对HTML5和CSS3进行深入浅出的分析，培养学生的技术应用能力、创新能力及综合职业素质，充分体现课程的实践性、职业性和拓展性。

三、课程设计的理念与思路

1.课程设计理念。《HTML5&CSS3网站设计》课程作为动漫设计与制作专业的核心课程，秉持“以就业为导向，以能力为本位”的职业教育理念，针对高职学生的认知特点，我们从专业人才需求分析、工作岗位分析、典型工作任务分析、学习领域生成、职业能力分析、项目设计、教学设计、任务书编写、教学资源开发等环节对课程进行建设，突出学生的教学主体作用，重视职业能力的培养，充分体现课程教学的职业性、实践性和开放性。

2.课程设计思路。《HTML5&CSS3网站设计》课程以能力为本位、以职业实践为主线、以项目课程为主体，打破了传统的学科体系的模式，将职业岗位能力中用到的知识点融合在项目中。学生通过各项目的实践操作，熟练地掌握岗位所需知识和技能，不断提高解决问题和项目实操能力。

2.1根据区域经济的特征与学院的职业教育能力进行专业定位。根据陕西地区经济的特征与西北地区的发展趋势，结合学院职业教育能力，将动漫设计与制作专业定位为培养应用型动漫人才。

2.2根据专业定位，对《HTML5&CSS3网站设计》课程进行定位。根据动漫设计与制作专业定位，深入西北地区乃至全国相关企业进行调研，对专业的工作岗位和工作任务进行分析，明确专业的核心能力，进行课程设计，使课程目标与专业的工作岗位和工作任务相对应，确定《HTML5&CSS3网站设计》课程为动漫设计与制作专业的专业核心课。

2.3以“工作过程”为导向，参考行业标准，确定网站设计岗位的工作过程。参考行业职业资格标准和行业专家意见，加强与企业之间交流合作，并且根据企业对从业人员岗位需求共同修订教学大纲、课程标准，确定在职业岗位上，实施工作过程，完成工作任务所需要的职业知识和技能。

2.4提炼典型工作任务，设计学习情境。根据网站设计岗位职责的描述和实际工作情况，提炼典型工作任务，通过任务案例驱动，再根据课程内容的关联性设计成学习情境。

2.5实施“教、学、练、做”一体化的教学过程，多种教学模式结合使用。充分利用校内外实训基地，构造一个立体化的多层次的完善的工学结合的实践教学体系，通过专职教师和企业工程师的及时指导，顺利达到预期的培养效果。采用互动式教学、案例教学相结合的模式，调动学生学习的兴趣和主动性。

2.6注重网站设计能力培养，多角度考核，提高学生的职业能力和职业素养。《HTML5&CSS3网站设计》课程以网站设计能力考核为主线，建立一体化的考核体系，包括过程考核和终结性考核两部分。

四、教学内容的组织与安排

《HTML5&CSS3网站设计》课程以学习情境为载体，在具体任务中说明知识要求、能力要求、任务描述与分析、相关理论知识以及任务实施的步骤和方法等，实行任务驱动式教学模式，使教、学、做、练相结合，突出工学结合与职业素质的培养。

1.课程整体内容结构分布。在教材原本章节的基础上对知识进行重构，将整体教学内容设置为6个学习情境，通过大量实例对HTML5、CSS3及JavaScript的各个知识点进行深入浅出的分析和讲解；通过引入任务案例，让学生掌握综合运用学习情境中各个任务的所有知识点；通过项目实训，使学生对所学知识得以巩固掌握和实践能力的锻炼；通过综合项目实训，使学生从全局角度掌握建立站点、站点初始化设置、切片、效果图分析、页面布局、定义公共样式、定义页面结构代码等网站设计的流程。

2.课程单元内容安排。每个课程单元即一个学习情境，每个学习情境中包含一个或多个任务。每个任务包括以下四个教学环节内容：上节知识点回顾、本课时内容学习、任务案例讲解和项目实训。

五、教学方法与教学手段改革

1.采用灵活多样的教学方法。在课程教学中，通过设置学习情境、引入任务案例、知识点案例、补充案例等，将理论与实践相结合，运用启发式讨论法引导学生思考，采取案例教学法、项目驱动教学法去调动学生学习的积极性和主动性，提高学生学习的兴趣、效率和效果，培养学生分析判断、独立思考和解决问题的综合能力，实现让动漫专业网站设计教学对接市场需求，企业模拟化案例变成教学内容，教学模式贴近工作过程。

2.运用现代教育技术、深化教学手段改革。充分利用现有的实验实训设备，积极采用现代教育技术手段，使教学内容更加丰富充实。先进的教学方法与手段为学生提供了一个更加灵活、方便、使用和广阔的学习和实践空间，也使教学效率大大提高，使教学水平迈上了一个新台阶。

3.课堂教学与网络教学相结合。目前已完成了网络课程建设，包括课程标准、教案、PPT课件、案例源码、实训指导书等教学资源网络开放，为学生提供了自学的条件，使教学不再受时间和空间的限制，学生可以通过网络进行本课程的自主学习和创新研究，促进了学生专业能力和综合能力的提高实现优质教学资源共享。

六、结语

目前，《HTML5&CSS3网站设计》课程建设已取得一定的成效。但在教学实施的过程中，授课教师发现学生对知识的自主探究学习能力较为薄弱，教师讲授仍然作为课堂教学的主体，因此，我们在培养学生自主学习方面进行了更深入的研究。在项目实训环节，我们打算将百单网的真实企业项目作为项目实训环节的拓展，让学生通过制作真实且有收益的网站项目，进一步调动他们学习的主动性和积极性，从而实现知识的迁移和应用。

参考文献：

[1]Elizabeth Castro，Bruce Hyslop.HTML5与CSS3基础教程（第8版）[M].北京：人民邮电出版社，2014，5.

[2]大漠.图解CSS3：核心技术与案例实战[M].北京：机械工业出版社，2014，7.

[3]Mark Pilgrim.HTML5揭秘[M].北京：电子工业出版社，2010，12.

作者简介：薄璐（1985—）。陕西西安人。讲师。硕士研究生。主要从事计算机学科教学工作。

※基金项目：2014年高等职业院校专业综合改革试点项目——陕西职业技术学院动漫设计与制作.

推荐访问： 工学 网站设计 课程建设 CSS HTML

---