能力本位的《网页前端框架》教法改革与探索

摘要：该文从网页前端框架课程出发，分析了传统“合一”教学的步骤、特点、缺点及应用型本科学生所处的困境。分析了学生在传统“合一”教学过程中遇到困难的原因，提出探索教学法，分析了探索教学法程序设计教学的步骤、特点及优点。

关键词：探索教学法;能力本位;主动学习;任务驱动

中图分类号：G642        文献标识码：A

文章编号：1009-3044（2022）09-0141-02

网页前端框架课程涉及Web前端开发中的基础知识，包括HTML、CSS以及JavaScript。通过本课程的学习，要求学生掌握基本网页设计能力、网页制作工具的操作，培养学生具有制作一般商业网站前端开发的能力。目前，多数应用型院校采用传统“合一”教学的方式，这种方式虽然能够让学生的动手能力得到一定提升，但核心仍然是单向传授知识，在越发需要发掘学生学习能力、应用能力的今天，该方法效果并不理想。

1 网页前端开发传统“合一”教学

1.1 传统“合一”教学一般框架

“合一”教学的核心思想在于强调知和行和整体性、共识性和互动性[1]。传统“合一”教学步骤为：（1）教师讲解相关概念以及后续练习中需要使用的知识点;（2）教师结合知识点演示、讲解例程;（3）通过练习深化提升学生对知识点的理解以及强化学生动手能力。

1.2 传统“合一”教学的特点与缺陷

传统“合一”教学模式的特点是授课过程按照教师的设计逐步进行，教师主导课堂进行，课堂以“教师和教材”为中心，主要活动是教师传授知识，学生学习知识，然后通过练习加深学生对知识的理解。学生处于被动学习地位，只需要按照教师设计好的教学过程接受新知识，然后通过实践练习巩固知识，师生互动较少。传统的“合一”教学模式能让学生系统地掌握网页前端开发所需的知识，并对单个孤立的知识点有较好的动手实践能力。

在对学生进行网页前端开发教学的过程中发现，由于学生的英语基础知识、构思能力、自控力较差，没有良好的学习习惯和学习方法，在教师集中讲解理论知识点时，许多学生不能集中注意力，忽略了理论部分知识，导致在后面的实践练习中出现问题[2]。另外，该课程是一门注重应用能力的课程，在学生掌握基础知识点的同时，还要培养学生运用基础知识分析问题、解决问题的能力。在当前教学框架下，学生虽然对单个知识点掌握较好，但是缺乏对知识点进行综合运用从而解决问题的能力。

1.3 传统“合一”教学对学生学习造成困难的原因

网页前端框架课程的特点是基础知识点相对容易理解，语法较少但是有较多的标签、属性需要记忆，原理较少但是需要灵活应用。而教师不可能在课堂上列举所有的知识点，需要学生掌握一定的通过查阅文档自学的方法。学习网页前端开发需要清晰的问题分解能力和应用能力。在传统“合一”教学模式下，学生在学习的过程中，独立思考、分析问题、利用所学知识解决问题的能力没有得到很好的发展。传统“合一”教学是从知识点到知识点的应用，读懂网页代码和编写代码需要很强的逻辑思维能力和一定的英语知识，代码中大量的英文单词和较弱的编码能力使学生产生了畏难情绪和厌学心理，分散、孤立的知识点导致学生对所学知识没有整体性的把握。在传统“合一”教学的全过程中，没有有意培养学生从发现问题到解决问题全过程的能力，这是导致学生应用能力较弱的直接原因。学生分析问题解决问题的能力直接体现了学生的应用能力，应用能力直接影响学生毕业工作后的职业发展。

1.4 解决问题的对策

首先由教师展示简单的例子，教给学生部分最基础的知识点，然后布置给学生一个简单的实验任务，要求学生探索实践并回答相关问题。学生经历探索、思考、交流、讨论后完成任务，使教学过程符合一般解决问题的认知规律，通过这一过程培养学生探索未知、获取知识的能力。

教师要变灌输式教学为学会自主获取知识的“获取式”教学。传统“合一”教学方式本质上还是灌输式教学，是以教师为中心、以教代学的授课方法。启发式教学方式是以学生为中心，从学生现有的知识基础出发，启发诱导学生在已有的知识基础上自行学习，扩展知识，使学生经历探索、思考、实践的过程，教学过程符合学生的认知规律。

2 探索教学法

2.1 探索教学法的概念

通过总结应用型本科在网页前端框架课程教学过程中的经验，提出探索教学法。该方法的教学过程设计以培养学生的能力为核心，有意识地培养学生的扩展学习能力、问题分析能力以及着手解决问题的能力，即“能力本位”。教师在课堂上仅讲授必要的基础知识，然后由教师以实践任务的方式导出问题，并给予学生学习资料，在教师的指引下分析问题，由学生在基础知识上进行探索扩展，最终完成任务。这一过程中，学生需要自己探索基础知识之外的学习内容，这是一种由学生自己探索知识、接受知识的教学方法。

2.2 探索教学法的一般框架

探索教学法遵循“探索规律”[3]，作为学习活动，其核心环节是“活动与比较”。要让学生发现规律性知识，首先要给予一定量的规定性知识，即基础知识。其一般步骤如下：（1）教师通过案例讲解基础概念和知识点（规定性的知识）;（2）教师布置实践任务，提出问题;（3）教师对实践任务进行简要分析，告知学生需要使用的知识点内容;（4）教师引导学生进行任务实践和探索性实验，使学生通过自主学习扩展基础知识（规律性知识）;（5）引导学生利用扩展的新知识帮助解决（2）中的任务。（6）大部分学生完成实践任务后对任务实现过程进行讲解，教师对知识点进行梳理、总结。（7）重复（2）至（6），让学生在原有知识基础上得到足够扩展。

3 探索教学法在网页前端框架课程中的应用

下面给出探索教学法在网页前端框架课程教学过程中的一个应用案例，案例中的课程内容旨在让学生学习HTML的表单中<input>系列标签的用法以及数据的传递形式。

（1）通过案例讲解基础概念和知识点。首先讲解表单的概念以及最基本的探索框架，如图1所示。

对图1中的表单中的关键属性进行讲解，引入表单中最基本的元素——<input>标签。其中，表单的method属性为值“GET”，这可以使表单的内容显示在URL中。

（2）要求学生仿照写出图1中的代码，得到与教师一样的运行结果;提出问题——表单中的数据通过什么方式传出，传到了哪个地址？

（3）教师提示学生观察<form>的action属性以及<input>中的name和value属性。

（4）给予学生实践时间，引导学生动手实验，促使学生寻找到（2）中问题的答案。

（5）根据学生完成（2）中任务的情况，对（2）中的问题进行详解。

通过修改<form>中的action属性同时观察URL的变化，可以分析得知action的值表示的是表单数据提交的目的地址，通过修改<input>中的name和value属性同时观察URL的变化，可以得知表单数据以“name值=value值”的形式传递。此时学生已经掌握了<input>标签中value、name属性与数据传递的规律，接下来继续提供学生基本知识，并开始新一轮的探索教学。

（6）提供学生<input>标签中的type属性的可选值。

（7）要求学生自行测试不同type值带来的不同效果，包括表现形式以及其值在表单中的传递形式。

（8）提示学生：表单元素的value属性值可以通过将<form>的method属性设置为GET，然后在URL中可以看见。

复制（1）中的<input>标签，将type修改为”number”，观察网页变化。可见输入框仅仅允许输入数字，并且有微调按钮，提交表单后，数据的传递形式同（5）中描述一致。此时让学生自行实验、学习其他的type类型。

（9）学生完成（7）中的任务后，总结归纳单选框、复选框等表单元素的使用方法。

4 考核方式的改变与探索

以往对于合一型教学的考核方式一般由平时成绩和期末考核成绩构成。平时成绩一般由考勤和课后作业组成，占总成绩的30%～40%。占据大部分成绩构成的期末考核采用笔试或者机试的形式，可见在教学考核中，期末成绩占比过大。另外，笔试题型因纸质试卷的局限，只能出少量的应用程序设计题型，远远不能体现出学生的实践动手能力和应用能力，受限于期末考试的卷面篇幅，也很难全面考查学生在课程中各方面知识的掌握情况。期末考核比重过大容易使学生忽略日常课程中的练习，问题分析能力和动手实践能力不能得到有效锻炼，期末考核也不能反映出学生该课程的真实水平。

对于以往考核方式的不足，在教学中对该门课程考核方式做出了一些探索和改进，调整核心思想，设计一种对学生在整个课堂教学过程中的表现进行评价的方法，并将其作为考核的主要内容。基于以上思想，结合探索教学法的教学过程特点对成绩评定方式和构成做出了调整。对于此类实践性、应用性较强的课程，要将平时成绩占比提升到总成绩的60%～70%。其中，考勤以及课后作业仍然各占平时成绩中的10%，其余40%～50%由学生课堂表现构成。而课堂表现的评分则是依照学生在探索教学过程中任务的完成情况、问题分析是否正确来进行评定，教师需对该过程做多次记录。通过对学生课堂表现进行详细记录并以此作为考核内容的主要部分，不仅可以比较真实地反映学生对课程要求能力的掌握情况，还能够引导学生将学习重心放到平时课堂中，有利于学生问题分析能力、实践能力的提升。

5 结论

探索教学法的教学模式核心在于引导学生自主地进行探索学习，在“任务驱动”的前提下，以学生的活动、经验积累、能力提升为中心展开教学设计，达到“能力本位”的目的，是一种关注学生发展、能力提升的教学模式。

学生进行自主学习后获取到新知识，有获得感和成就感，增加了学生自信心，培养了学生的自主学习精神。同时，在这一教学过程中，学生注意力被吸引到如何解决任务问题上，学习注意力集中，既提高了学习效率又培养了学生通过实践探索获取知识、解决问题的思维。新的教学考核方式更好地切合了“能力本位”这一目的，能够较好地反映学生能力的真实情况。

探索教学法变传统“合一”教学模式的灌输式教学为获取式学习，采用启发式方法引导学生探索知识，自主获取知识。学生经过思考、实践探索、再思考的过程，逐步建立起正确的认知规律，养成自主学习的习惯，提升探索研究的能力，在学习过程中体会到探索知识、发现知识、掌握知识的快乐。

参考文献：

[1] 曹昱.高校可持续发展教育“知行合一”教学模式探析[J].汉字文化，2019（19）：56-57.

[2] 郑建波，尚文涛.应用型本科院校教学中存在的问题及改革途径[J].西部素质教育，2019，5（13）：167，169.

[3] 郜舒竹.“探索规律”释义[J].课程·教材·教法，2015，35（1）：102-107.

【通联编辑：代影】