基于H5网页前端开发的项目启发式教学探究
2018-06-11王可心
王可心
[摘 要] H5網页前端开发是面向计算机专业的一门前端开发项目实战课程，操作性及可实践性非常强，教学中除了对理论知识的学习，应该加强对学生动手能力的培养，以HTML5表单的应用为例，对H5网页前端开发进行项目启发式课堂教学探究。
[关 键 词] 网页前端开发;项目启发式;教学探究
[中图分类号] G642 [文献标志码] A [文章编号] 2096-0603（2018）35-0101-01
随着互联网的高速发展，高素质的网页前端开发人员需求量越来越大，因而H5网页前端开发作为网页前端开发的专业课越来越受到重视，作为应用型民办普通本科高校，该以什么样的方式进行课堂教学，需要我们进行探索和研究。
一、课程现状与问题
（一）课程现状
Web应用服务的快速发展推动了Web技术的快速发展，更多的敏捷开发技术缩短了Web应用项目的开发周期，Web表现形式和用户体验也发生了极大改变。
Web前端开发是高校计算机专业的一门专业技能课程，学完该课程后学生应具备独立设计开发一定水准的网站的能力，但是由于该课程的内容涉及较多、技术性较强、涉及面较广、技能和实践要求较高，学生个体差异较大等原因，传统的教学思路和教学方法不能满足课程教学的要求。
（二）存在的问题
对于网页前端开发的学习，在教学上普遍采用教师课堂上讲授相关知识，学生在实验课上对所学知识点进行练习的方式，很难发现和评估在实验学习中暴露出语法等基础方面的问题。由于较少组织项目级别和团队模式下的实践学习，学生的学习仅仅停留在知识点的掌握层面，鲜有项目开发经验的积累。
二、课堂教学设计
在本课程的讲解过程中，我们摒弃了传统的知识点讲解方法，为了能够培养学生的编程兴趣，达到自主学习的目的，我们采用以项目为导向，串讲网页开发中的知识点，让学生更清晰地了解学习目的，使枯燥的代码形象化，下面我们以H5网页前端开发的HTML5表单的应用为例，进行项目启发式教学设计探究。
（一）创设情境
教师首先介绍，本单元要完成两个项目。项目1：移动版登陆页面。项目描述：本项目要完成一个移动版的用户登录页面，包含用户名输入框、密码输入框和登录按钮，其中“用户名”“密码”为提示文字，在用户输入文字后会自动消失，只保留用户输入的文字，获得焦点的文本框颜色会发生变化。项目2：用户注册页面。项目描述：用户注册是指将用户的相关信息提交到服务器的过程，没有注册的用户无权使用网站的一些功能，将某个输入框获得焦点后会变宽，未填写正确信息时为红色且有警示图标。
（二）明确学习目标
项目1学习目标：（1）要求学生掌握表单的应用;（2）要求学生掌握HTML5标签的应用;（3）要求学生清晰该项目的实现效果和页面结构;（4）要求学生了解该项目的实现细节以及相关知识点的应用。
项目2学习目标：（1）要求学生掌握其