打开文本图片集

摘要：在网页交互技术课程中，传统的模式学生主动性和参与度较差。BOPPPS的教学模式可以反转翻转课堂，可以提升学生在主体位置，结合线上线下的混合式教学模式它结合了传统教学和在线教学的优点，旨在提高学生的学习主动性和参与度。通过课前预习、课中互动、课后复习等方式，可以更好地促进学生对知识的理解和应用，可以有效地提高学生的学习效果和参与度，进而提高网页交互技术课程的教学效果和质量。教学实践中，通过过引导学生讨论和分析与职业素养和社会责任相关的案例、问题，以及组织相关的实践活动等方式融入思政元素，从而能够更有效地培养学生的职业素养和社会责任感。

关键词：教学模式；BOPPPS；网页交互；课程思政

0引言

在国家和高职院校的培养目标及教学要求引导下，随着教育改革的逐步深入，对课程的教学模式、教学要求等都提出了更高的要求和标准。在教育信息化政策的推动下，混合式教学在高校教育教学改革中是趋势也是共识［1］。在混合式教学满意度统计中，亦发现高校学生在信息发达的今天更愿意接受符合他们学习习惯的混合式教学；通过观察比对考试成绩，也证实混合式教学确实行之有效［2］。

1 课程现状

网页交互技术是马鞍山师范高等专科学校软件技术及相关专业的专业基础课，本课程旨在培养学生的WEB前端开发能力。网页交互技术在各行各业的应用越来越广泛，无论是大型互联网公司还是小型企业，都需要具备WEB前端技术的人才来进行网站的开发和维护，课程在计算机行业及相关领域中具有广泛的应用前景。其次课程涉及的知识面广，不仅有对前期课程学习过的HTML、CSS等知识进行灵活运用，还包括JavaScript、jQuery等前端交互技术。如何教好学好网页交互技术，培养出WEB前端开发应用型人才，是从事网页交互技术教师一直关心的问题。

1.1教学模式不适合，学生的学习主动性差。

在课程教学中，《网页交互技术》无论采用PPT+代码演示的传统的教学方式，还是采用“项目驱动式”授课方式授课，各自都有利弊。首先传统的教学模式，学生的学习主动性差。传统的教学模式也称“填鸭式”授课方式，采用板书（代码演示）加课件形式，这种教学模式传统、单一，学生主动性差、参与度低，课堂学习氛围差，仅停留在表层的内容学习，不能充分地理解各个知识点之间的联系，与以学生为中心的教学理念不适应。“项目驱动式”教学会较之传统的教学方式上在课程知识的综合运用方面会有所提升，实践过程中发现，项目的完成需要更多综合知识的运用，项目的选取比较困难，部分学生就会知难而退，失去学习兴趣。

1.2教学管理和教学互动难。

学生对于《网页交互技术》课程的重要性认识不够，上课的学生人数多，每个班 50 人左右，同一学期 2到4个班级一起上课，课程管理难度大。由于大班授课，教师以讲为主，讲授知识多，学生的即时反馈比较差，课堂互动相对比较少，教师对学生个体的知识掌握程度了解得也不够全面，教学效率低。

1.3课程思政元素融入不够。

传统的教学模式，教师的时间更多地投入到知识点的讲解当中去，很难有更多的精力投入到对课程思政元素的挖掘，另外因为师生之间的互动性不够，教师也不了解学生思想状态，不能及时发现和解决学生思想政治上的问题。项目驱动式教学模式，师生的关注点更多的是在于项目的实现，会将更多精力投入到技术上，难免会出现“重技术轻教育”的现象出现。

2 BOPPPS+翻转课堂线上线下混合式教学模式

BOPPPS教学模式源于加拿大的教师技能培训，是一种以教学目标导向、以学生为中心的教学模式[3]。BOPPPS 中的字母代表了教学过程的相关环节，其中字母 B 代表“bridge-in”为课程导入，字母 O 代表“objective or out-comes”为课程目标或预期成果，字母 P 代表“pre-essment”为课程前测，字母 P 代表“participatory learning”为课中参与式学习，字母 P 代表“post-assessment”为课程后测，字母 S 代表“summary”为课程总结，BOPPPS模型含义及表现形式如表1所示。

由此可见，BOPPPS 模式是课堂教学过程的“流程图”，BOPPPS模式流程图如图1所示。因其结构完整，各环节教学要点简洁明了，操作性强，具有较强的普遍适用性，深受教师喜爱。

针对目前《网页交互技术》课程存在问题，构建基于BOPPPS+翻转课堂的线上线下的混合教学模式的体系，其基本框架图如图1所示。

3 BOPPPS+翻转课堂线上线下混合式教学模式在网页交互技术中的应用

3.1课前

基于BOPPPS+翻转课堂线上线下混合式教学模式，将课堂延伸为“课前—课中—课后”三部分，BOPPPS模式的前测在课前，同时在课前新增设学生自主学习和课前后测两个环节，为教师提前备课在课中进行针对性教学做好充足的准备，依据课中后测结果设计为：拓展资源、深度学习;查缺补漏、扫除障碍两个环节，教学全过程均以学生为出发点和落脚点，依据学情进行教学设计、教学实施及教学改进。这要求教师要因时制宜来合理运用教学方法，对教学内容具有整合能力，还需善于将学科知识转化为学生易于接受理解的教学形式及表达方式，根据学生诉求与存在薄弱点来解决问题和难点。这些要求都促使教师必须提升教学和研究能力。教师根据教学测试结果或讨论情况进行准确的学情分析，具体操作流程如图2所示。

3.2课中

课中教师根据课前测试结果的得到更精确的学情分析，释疑解难，进行课堂讨论、并采用头脑风暴、案例分析、情景模拟、学生上讲台即兴演讲等，以帮助学生充分参与课堂教学，打破传统的以教师为主和学生被动接受的模式。通过学生自主学习知识内化和教师课堂教学知识传授的颠倒安排，达到传统教学中的师生角色互变，同时进行课后反思和持续探究，灵活地引入前测和总结环节。具体操作流程如图3所示。

3.3课后

课后经过前期课前课中的以学生为主体的主动式参与学习，学生对课程内容已经基本掌握，在此基础上，需要要求学生的知识水平向更高阶水平的推送，布置拓展性作业，每课有课后反思，不断提高学生学习的积极性和主动性，培养和提高学生自主学习和深度学习的内区力，同时满足不同学生个性化学习的实际需求，使学生获得充分自由的全面发展。教师就拓展部分的作业，进行在线答疑，且教师也要进行教学反思与总结。具体操作流程如图4所示。

3.4课程思政元素融入

将课程思政元素加入课程导入部分，让其贯穿整个教学过程。课程导入或引入是决定一堂课教学效果的关键，好的课程导入可以迅速吸引学生的注意力，启发学生思考，引导学生去探寻答案，起到增强学生好奇心的效果。课程导入结合章节内容，选取符合社会主义核心价值观的案例，提出问题、分享时事、热点事件等方式引入。教学过程中，教师还可以通过引入真实的、具有代表性的典型案例分析，引导学生进行深入的分析和讨论；或模拟真实的工作尝尽，让学生扮演不同角色，帮助学生理解和掌握在实际工作如何体现职业素养和社会责任感；或组织学生进行小组讨论和社会实践进行经验分享，引导学生分享自己的看法和经验，让学生亲身体验和理解职业素养和社会责任的实际意义。

4 结束语

在 BOPPPS 教学模式下随着学生课堂上教学过程参与度强度的逐渐增加，课程的授课内容也相应有所减少，教师依据所授课程的课程标准和教学目标，鼓励学生能够主动完成面向教学目标的参与互动式学习，并当堂或课后测试学生的接受程度与学习效果，学生可合理安排碎片化的时间对每节课所学内容与知识点进行学习与巩固[4]。翻转课堂则将课堂教学扩展到课前的预课堂，以达到补充BOPPPS 教学模式的目的，减轻课堂教学时间不足造成的压力，提高学生主动自主学习的能力。

教师在课程教学中，结合学情分析，准确研究与把握学生学习的心理，认真践行“以学生为中心，持续改进”的教学理念，教学过程中充分了解学生的专业基础能力的同时，本着“教书育人”的理念，将课程思政元素精心设计到课程导学中、学生在上课前通过学习通教学平台在线资源进行《网页交互技术》的基本学习内容；根据课程教学进度，教师可随时将每章节的教学资料发布到在线学习通平台，学生自我规划利用零散碎片化时间依据章节学习引导单自主完成学习；课堂上，释疑解难，进行课堂讨论、学生上讲台即兴演讲等，以帮助学生充分参与课堂教学，打破传统的以教师为主和学生被动接受的模式。

作者简介：

张小翠，安徽无为人，从事计算机相关课程教研和教学工作

吴慧林，安徽庐江人，从事计算机相关课程教研与教学工作

基金项目：

1.马鞍山师范高等专科学校校级教研项目：基于BOPPPS+翻转课堂的线上线下混合式教学模式在《网页交互技术》课程中的应用探索，项目编号：2023xjjyxm16

2.安徽省教学研究重点项目：“1+X”证书制度下标准化人才培养模式研究，项目编号：2021jyxm1461

3.安徽省教学研究一般项目：“1+X证书”制度下基于“CDIO-OBE理念的PHP程序设计”项目驱动式教学方法的研究，项目编号：2021jyxm1470