Web前端开发课程内容改革的探索与尝试

阮晓龙

河南中医学院 河南郑州 450008

Web前端开发课程内容改革的探索与尝试

阮晓龙

河南中医学院 河南郑州 450008

Web前端开发是大多数高校计算机专业的必修课程，通过各个高校所开设的Web前端课程的对比分析，并结合课程的特点和自身的教学实践，从教学内容、教学方式、实验教学等方面对Web前端开发课程进行教学内容改革探索与研究。

Web前端开发；课程改革；云服务；课程设计；交互

随着互联网的高速发展，高素质的Web前端开发人员越来越受到重视，大量的人才缺口与并不乐观的就业形势逐渐得到广泛关注，促使高校对相关专业及相关课程给予足够重视，并纷纷实行改革。笔者认为Web前端开发类课程对于计算机及相关专业的学生而言是非常重要的专业课程，通过近几年对Web前端技术的研究，特别是对Web前端开发的关注和参与，并结合实际教学经验对Web前端开发课程进行了探索和尝试。

以下将从五个方面介绍对Web前端开发课程教学内容和实验教学的探索与研究。

1 课程现状与困境

1.1 课程现状

Web应用服务的快速发展，推动了Web技术的快速发展，更多的敏捷开发技术缩短了Web应用项目的开发周期，Web表现形式和用户体验也发生了极大改变。

目前，Web前端开发课程的大部分教学内容停留在网页设计、网页制作和工具软件的使用上，内容落后，不能很好地与Web前端技术同步发展。在教学上普遍采用教师课堂上讲授相关知识，学生在实验课上对所学知识点进行练习的方式，很难发现和评估在实验学习中暴露出语法等基础方面的问题。由于较少组织项目级别和团队模式下的实践学习，学生的学习仅仅停留在知识点的掌握层面，鲜有项目开发经验的积累。

1.2 教学中的困境

Web前端开发是高校计算机专业的一门专业技能课程，学完该课程后学生应具备独立设计开发一定水准的网站的能力，但是由于该课程的内容涉及较多、技术性较强、涉及面较广、技能和实践要求较高，学生个体差异较大等原因，传统的教学思路和教学方法不能满足课程教学的要求。

在正常的教学过程中学生往往很少能够参与一个项目从需求分析，规划设计、具体开发直至项目部署调试的全过程，因此造成学生缺乏完整项目开发的经验，仅仅停留在对“实验项目”的学习上。由于缺乏实际应用项目的开发经验，其解决实际问题的能力也很难得到提高。

2 教学内容的探索

2.1 课程定位

笔者所在学院自2010年起，将Web前端开发课程定位为面向开发，以编程为主的专业基础课，目的是让学生掌握并灵活应用Web前端开发技术(HTML5，CSS3，JavaScript，JQuery等)，能够理解Web程序框架结构，理解Web程序结构的特点，从而掌握独立分析规划和程序开发的能力，为Web Service开发的学习奠定基础。

2.2 教学内容知识结构

Web前端开发课程教学内容的知识结构，包括六个部分。

第一部分：Web基础(包括2章)。

第二部分：Web开发与测试工具(包括2章)。第三部分：HTML开发(包括5章)。第四部分：CSS开发(包括6章)。第五部分：交互(包括2章)。

第六部分：Web发布(包括1章)。

2.3 教学内容设计

本课程的教学内容共计18章，54学时。

表1 教学内容章节对比分析表

表1 (续)

表1 (续)

3 实验教学的探索

3.1 实验教学内容的知识结构

Web前端开发的实验教学知识结构，分为三个部分，共九个实验项目。

第一部分：基础知识与入门(包括1个实验项目)。

第二部分：网页开发技术(包括6个实验项目)。

第三部分：交互开发(包括2个实验项目)。

3.2 实验内容与实验设计

表2 实验教学内容知识结构对比分析表

3.3 实验教学环境与平台

3.3.1 实验教学环境

在实验教学过程中，每个学生都配备一台计算机和云服务器。配置的计算机用来实现Web开发，云服务器用来做Web发布，每位学生的实验内容和自主实验内容，以及开发类的作业，都发布到云服务器上。

3.3.2 实验教学平台

为了更方便地进行实验教学，建设了课程资源发布网站、网络学习平台，并通过云计算的方式对学生的代码进行托管，让学生更便捷地获得学习资源、参与学习活动，为学习Web前端开发提供了更好的保障。

3.3.3 实验学习中的软件

在实验过程中使用的浏览器(Chrome浏览器、火狐浏览器、360浏览器、QQ浏览器、IE浏览器、Safari浏览器)、Web测试工具(BrowseShot，Web Link Validator)、Web设计软件(Adobe Photoshop)、Web开发软件(Netbeans)全部是正版软件，拒绝使用盗版软件。

4 成果

4.1 教学成果

教学内容的改革，使学生的积极性与学习态度得到了明显改善。学生学习变被动为主动，不再拘泥于课堂教师的讲解，主动追求对技术的学习，主动参与到Web前端开发的学习中，对课程的理解更加深刻。

跟踪式监督，使每个学生不断学习必要的知识和技能；每届专业课程答辩，也让教师和学生积累了宝贵的学习经验，这些因素使每届课程设计质量水平都得到逐步提升。

4.2 研究成果

实验改革中建立的课程资源网包含了任课教师的多媒体课件、讲稿、软件资源、课外拓展资料等资源，学生根据这些资源可以对教师所讲内容进行预习、复习与巩固，教学效率得到了极大提高。

网络学习平台和云服务器能够实时记录学生的学习情况。学生课后在线按时提交作业，提高了理论教学的质量；实验前及时对实验内容进行预习并提交实验准备作业，强化了实验课的学习。

5 不足

5.1 教学过程监督不够

在课后的学习过程中，教学监督有待完善。学生编写的代码不能及时收集，教师并不能及时有效地对学生代码质量做出评估。

为了更加有效地对学生的学习情况进行评估与指导，后期计划进一步深化云服务的应用，为每一个学生开设虚拟化学习平台，使学生的代码能及时快捷实现集中管理和存储，同时教师还能在线预览并及时做出评估。

5.2 课程内容不完善

Web前端开发课程教学中，目前只讲授了Web前端开发的基本内容，对移动开发的重视度不够，同时在自动化测试方面，也并未涉及。后期将加强本方面的建设，计划通过增加本课程的学时数或者另开设一门课程，例如移动Web开发，以帮助学生掌握移动Web开发的能力，完善学生的知识结构和技能体系。

6 结束语

在Web前端开发课程的教学中注重培养学生的综合素质，结合实际应用和技术发展，全面调整了课程定位、教学内容，深化了实验教学内容，丰富了教学手段，借助课程资源网站和网络学习平台提升了教学控制力和教学效果。经过验证，目前教学改革的探索和尝试效果良好，既激发了学生的学习兴趣，又极大地提高了教学质量和学生技能水平。

[1] 王晓红.周立.《网页设计与制作》课程教学改革[J].北京联合大学学报:自然科学版,2006(4):90-92.

[2] 吕立霞.以产品开发为工作过程的《静态网页设计》课程改革[J].当代教育论坛,2011(4):116-118.

[3] 魏冬梅.Web前端开发课程教学探讨与实践[J].福建电脑,2013(6):181-183.

[4] 金翠芹.网页设计与制作课程教学改革初探[J].正德学院学报,2010(8):26-29.

[5] 闫齐峰,张莉平.高校《网页设计与制作》课程的教学与探析[J].兰州商学院陇桥学院,2012(12):165-166.

Explorations and Attempts of the Reform on Web-based Curriculum System

Ruan XiaoLong
Henan University of TCM， Zhengzhou， 450008， China

'The Development of Web's Front -End' is a compulsory course for the majority of the colleges and universities'computer specialty. By various colleges and universities opened web's Front-End courses' contrastive analysis and combine the course features and personal teaching practice， to exploy and study 'The Development of Web's Front-end' from the content of courses， teaching methods， experimental teaching and other aspects.

the development of Web's Front-end； course reform； cloud service； curriculum design； interactive

2014-11-20

阮晓龙，本科，讲师，网络信息中心信息部主任。

虚拟化平台在《Web前端开发》教学中的应用研究(编号：2013JX22)。