新工科背景下HTML5程序設(shè)計課程混合教學(xué)模式探究

郭麗萍 盧欣欣 林新然

摘 要：新工科背景下，本研究針對傳統(tǒng)HTML5程序設(shè)計課程中存在的知識點關(guān)聯(lián)性不強、學(xué)生自主學(xué)習(xí)積極性不高、學(xué)生動手操作能力不強、學(xué)生創(chuàng)新能力弱等問題，設(shè)計出一種線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)模式，并從課前準備、課中討論、課后復(fù)盤、增加項目實踐環(huán)節(jié)、課程考核評價等方面對該混合教學(xué)模式進行詳細闡述。與傳統(tǒng)平行班相比較，這種教學(xué)模式取得了一定成效，能為同類計算機應(yīng)用開發(fā)課程的教學(xué)改革提供理論參考和實踐路徑。

關(guān)鍵詞：HTML5程序設(shè)計;混合教學(xué)模式;翻轉(zhuǎn)課堂;線上教學(xué)

為應(yīng)對新一輪科技革命和產(chǎn)業(yè)變革、提升國家硬實力和國際競爭力，國家提出以互聯(lián)網(wǎng)和工業(yè)智能為核心的新工科建設(shè)，旨在培養(yǎng)適應(yīng)新興產(chǎn)業(yè)和新經(jīng)濟形式、實踐能力強、創(chuàng)新能力強的卓越工程技術(shù)人才。2017年，教育部為積極推進新工科建設(shè)，先后印發(fā)《教育部高等教育司關(guān)于開展新工科研究與實踐的通知》《教育部辦公廳關(guān)于推薦新工科研究與實踐項目的通知》，積極探尋工程教育的中國模式。2018年4月，教育部印發(fā)《高等學(xué)校人工智能創(chuàng)新行動計劃》，要求積極開展新工科研究與實踐。2020年5月，為推進新工科建設(shè)再深化、再拓展，教育部決定在高等學(xué)校培育建設(shè)一批未來科技學(xué)院。在新工科建設(shè)背景下，HTML5程序設(shè)計課程作為周口師范學(xué)院軟件工程專業(yè)的核心課程之一，仍存在一些不足。課題組結(jié)合該課程的特點，嘗試對其教學(xué)模式進行探究。

一、HTML5程序設(shè)計課程的目標(biāo)及地位

國家教育主管部門明確指出，地方高校要對區(qū)域經(jīng)濟發(fā)展和產(chǎn)業(yè)轉(zhuǎn)型升級發(fā)揮支撐作用，充分利用地方資源特色，培養(yǎng)大批具有較強行業(yè)背景知識、工程實踐能力、勝任行業(yè)發(fā)展需求的應(yīng)用型和技術(shù)技能型人才。課題組所在學(xué)校的軟件工程專業(yè)立足于學(xué)?！盀閰^(qū)域和國家主導(dǎo)產(chǎn)業(yè)、新興產(chǎn)業(yè)提供有力的人才與智力支持”的服務(wù)定位，著力培養(yǎng)具備科學(xué)思維能力、軟件開發(fā)能力、軟件工程實踐應(yīng)用能力和創(chuàng)新能力的應(yīng)用型人才。移動應(yīng)用開發(fā)是軟件工程專業(yè)的研究方向之一，該方向旨在培養(yǎng)具有扎實移動應(yīng)用開發(fā)理論基礎(chǔ)和應(yīng)用能力、較強的專業(yè)技能和職業(yè)素養(yǎng)的高素質(zhì)技能型人才。圍繞這一目標(biāo)，該方向設(shè)置了一系列移動應(yīng)用開發(fā)相關(guān)課程。HTML5程序設(shè)計課程是移動應(yīng)用開發(fā)系列課程中的一門專業(yè)必修課，該課程開設(shè)于大二下學(xué)期，通過讓學(xué)生學(xué)習(xí)HTML5標(biāo)準的新特性，著重培養(yǎng)學(xué)生采用HTML5新技術(shù)設(shè)計、開發(fā)網(wǎng)站和移動APP前臺的能力，為學(xué)生以后從事Web開發(fā)工作打下堅實的基礎(chǔ)。該課程前接網(wǎng)頁設(shè)計與制作和JavaScript等課程，后連HTML5移動應(yīng)用開發(fā)、軟件工程綜合實踐和組件化開發(fā)等課程，發(fā)揮著承上啟下的重要作用。

二、HTML5程序設(shè)計課程內(nèi)容及存在的問題

HTML5程序設(shè)計課程圍繞培養(yǎng)學(xué)生HTML5新標(biāo)準的理論知識和獨立設(shè)計開發(fā)網(wǎng)站、移動APP前臺能力的課程目標(biāo)，設(shè)置了HTML5新增頁面元素、Canvas繪圖、多媒體元素、獲取地理位置信息、離線Web應(yīng)用、本地Web存儲等課程知識內(nèi)容。在實際教學(xué)過程中，課題組所在學(xué)校仍然采用“教師講授為主，學(xué)生被動接受”的傳統(tǒng)教學(xué)模式。由于該課程具有理論與實踐并重的特點，這種傳統(tǒng)的教學(xué)模式在實際應(yīng)用中存在一些不足。

（一）知識點關(guān)聯(lián)性不強，學(xué)生難以記憶

由于課程知識點比較多且相對零散，知識點之間缺乏內(nèi)在邏輯，不同章節(jié)的知識點之間關(guān)聯(lián)性較弱，學(xué)生在學(xué)習(xí)過程中容易出現(xiàn)顧此失彼的現(xiàn)象。傳統(tǒng)的教學(xué)模式不便于學(xué)生對零碎內(nèi)容進行理解和記憶，也間接導(dǎo)致學(xué)生學(xué)習(xí)興趣不高。

（二）學(xué)生自主學(xué)習(xí)積極性不高

由于課程采用“教師講授為主，學(xué)生被動接受”的傳統(tǒng)教學(xué)模式，大部分學(xué)生習(xí)慣等教師講完新知識后，再跟著教師的思路進行鞏固練習(xí)，沒有養(yǎng)成主動學(xué)習(xí)的良好習(xí)慣，無法有效激發(fā)自主學(xué)習(xí)動力。雖然教師也會經(jīng)常強調(diào)預(yù)習(xí)的重要性，并督促學(xué)生進行課前預(yù)習(xí)，但實際效果欠佳，學(xué)生自主學(xué)習(xí)的意識和動力不足。

（三）學(xué)生動手操作能力不強

本課程可分為理論課和實驗課，課時占比為1∶1。在理論課上，教師通過講授法、案例法等教學(xué)方法對知識點進行講解;在實驗課上，教師根據(jù)教學(xué)內(nèi)容設(shè)置一定的實驗題目，學(xué)生利用實驗課及課余時間完成實驗作業(yè)。在做實驗題目時，大部分學(xué)生通過參考書上的案例代碼完成。然而，想要達到對理論知識熟練掌握并舉一反三的程度，僅靠完成實驗題目遠遠不夠。學(xué)生在脫離課本后，自主編寫代碼能力明顯減弱。

（四）學(xué)生創(chuàng)新能力弱

HTML5程序設(shè)計課程是一門非常注重實踐的課程，不僅要求學(xué)生掌握課本上的核心理論知識，更希望學(xué)生在遇到一些需要綜合知識或創(chuàng)新思維解決的實際問題時，能夠靈活運用所學(xué)知識處理各種棘手問題，把課本中的理論知識真正應(yīng)用到實際項目中。然而，大部分學(xué)生的創(chuàng)新能力較弱。

鑒于實際教學(xué)過程中存在的以上問題，課題組嘗試采用一種新的教學(xué)模式來改變教學(xué)現(xiàn)狀，促使學(xué)生更好地完成課程學(xué)習(xí)。

三、線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)模式

翻轉(zhuǎn)課堂教學(xué)模式源于美國邁阿密大學(xué)，是指重新整合各個教學(xué)環(huán)節(jié)，將教學(xué)過程中的“以教師為主”轉(zhuǎn)變?yōu)椤耙詫W(xué)生為主”。這種教學(xué)模式強調(diào)以學(xué)生為主體，教師只起到引導(dǎo)作用。翻轉(zhuǎn)課堂教學(xué)模式把教學(xué)過程分為課前、課中和課后三個階段。在課前階段，教師全方位把控教學(xué)內(nèi)容，通過錄制短視頻對教學(xué)核心內(nèi)容進行提煉，學(xué)生通過自主觀看短視頻完成對課程內(nèi)容的初步理解和吸收。在此過程中，教師可以適當(dāng)進行督促和引導(dǎo)，從而滿足學(xué)生的個性化學(xué)習(xí)需求。在課中階段，教師和學(xué)生同時參與并在線下課堂中完成教學(xué)。此階段主要由教師有針對性地對學(xué)生在課前學(xué)習(xí)中遇到的疑問進行解答，學(xué)生通過集體討論、分小組學(xué)習(xí)等形式進一步深化學(xué)習(xí)。在課后階段，教師可以適當(dāng)給學(xué)生留一些作業(yè)，學(xué)生借此對學(xué)習(xí)成果進行鞏固。最后，教師通過多種評價手段檢驗學(xué)生的學(xué)習(xí)效果，進而合理安排接下來的課程內(nèi)容。

四、混合教學(xué)模式在HTML5程序設(shè)計課程中的應(yīng)用

鑒于線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)模式具有教學(xué)信息明確、視頻短小精悍、便于學(xué)生復(fù)習(xí)等特點，可以彌補一些常規(guī)教學(xué)中的不足，課題組嘗試把線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)應(yīng)用于HTML5程序設(shè)計課程教學(xué)中，分為課前、課中、課后等階段進行闡述。為增強學(xué)生的動手編碼能力和創(chuàng)新能力，課題組在實際教學(xué)中還引入了項目實踐環(huán)節(jié)。

（一）課前階段

在課前階段，教師需要為學(xué)生準備好課程章節(jié)必需的預(yù)習(xí)資料。學(xué)習(xí)資料應(yīng)盡可能豐富，包括但不限于微課視頻、在線學(xué)習(xí)文檔、練習(xí)題等?？紤]到現(xiàn)在的學(xué)生平時喜歡使用移動平臺，因此，可以把微課視頻作為課前學(xué)習(xí)的主要方式。微課視頻不應(yīng)簡單羅列知識點，還應(yīng)盡可能增加知識的趣味性。每個微課視頻時長盡量控制在15分鐘以內(nèi)，以免引起學(xué)生的視覺疲勞。為了充分吸引學(xué)生的注意力并調(diào)動學(xué)生的學(xué)習(xí)自主性，課題組還在視頻播放過程中設(shè)置1～2道必答題目，學(xué)生只有答題后才可以繼續(xù)觀看視頻。在上課前一周，教師通過網(wǎng)絡(luò)平臺把微課視頻等相關(guān)學(xué)習(xí)資料推送給學(xué)生。由于時間比較充裕，學(xué)生可以充分利用課余時間進行自主學(xué)習(xí)和探索，對有疑問的地方進行標(biāo)記?？紤]到部分學(xué)生的學(xué)習(xí)主動性不強，教師可以在課前進行多次提醒。學(xué)生在看完視頻后，可以通過在線平臺上的自測題目對預(yù)習(xí)成果進行檢驗。這些均依托超星學(xué)習(xí)通教學(xué)平臺完成，該平臺能夠?qū)W(xué)生的學(xué)習(xí)全過程進行監(jiān)測，并生成統(tǒng)計數(shù)據(jù)。微課視頻除了幫助學(xué)生完成初步學(xué)習(xí)，還可以用于學(xué)生的課后復(fù)習(xí)。便捷的移動平臺能保證學(xué)生隨時隨地利用碎片時間開展學(xué)習(xí)活動。

（二）課中階段

課中階段由學(xué)生和教師共同在線下課堂完成，學(xué)生仍然是學(xué)習(xí)的主體，教師起到引導(dǎo)作用。首先，教師主要對學(xué)生在微課視頻、自測題中遇到的疑惑進行解答。其次，為了加深學(xué)生對知識的理解，教師可以對知識點進行適當(dāng)擴展，并通過小組討論、分組學(xué)習(xí)等形式啟發(fā)學(xué)生，幫助學(xué)生對知識進行內(nèi)化吸收，拓寬知識的廣度和深度，并最終達到厚積薄發(fā)的效果。在此階段，教師要特別注意，在組織學(xué)生進行討論時，可以適當(dāng)對學(xué)生進行引導(dǎo)和鼓勵，始終圍繞完成課程目標(biāo)的暗線來開展課堂活動。有效的課堂討論環(huán)節(jié)能夠增強學(xué)生的表達能力、邏輯思維能力和發(fā)散思維能力。

（三）課后階段

課后階段主要在線上和線下完成。在此階段，教師通過在線學(xué)習(xí)平臺給學(xué)生布置一些不同難度的練習(xí)題目，包含常規(guī)練習(xí)題和拓展練習(xí)題。學(xué)生通過答常規(guī)練習(xí)題對課程內(nèi)容進行鞏固，通過答拓展練習(xí)題對所學(xué)知識進行綜合運用和創(chuàng)新。不同難度的練習(xí)題目能滿足不同學(xué)習(xí)程度的學(xué)生需求，讓不同層次的學(xué)生獲得學(xué)習(xí)的滿足感和成就感，進而激發(fā)他們自主學(xué)習(xí)的動力。為能夠及時了解學(xué)生在學(xué)習(xí)過程中遇到的難點，課題組在超星學(xué)習(xí)通平臺設(shè)置了自由討論板塊，學(xué)生可以及時在上面發(fā)帖求助或分享經(jīng)驗。最后，借助超星學(xué)習(xí)通平臺，課題組可以及時對學(xué)生的學(xué)習(xí)測評結(jié)果進行總結(jié)分析，并根據(jù)測評結(jié)果改進教學(xué)設(shè)計、調(diào)整教學(xué)進度，從而形成良性循環(huán)的學(xué)習(xí)模式。

（四）增加項目實踐環(huán)節(jié)

本課程屬于應(yīng)用開發(fā)類課程，課程目標(biāo)除了要求學(xué)生理解并掌握基本的理論知識，更注重培養(yǎng)學(xué)生動手編碼的能力。為解決常規(guī)教學(xué)中學(xué)生動手操作能力弱的問題，課題組在原有課堂基礎(chǔ)上精簡課程內(nèi)容，在學(xué)期結(jié)束前一周為學(xué)生安排項目實踐環(huán)節(jié)，以項目形式激勵學(xué)生動手編寫代碼，讓學(xué)生在自主編寫代碼的過程中提升創(chuàng)新能力。在一周的項目實踐中，課題組要求學(xué)生自由分組完成實踐題目，每組不超過5人。本課程的教學(xué)內(nèi)容和網(wǎng)站開發(fā)相關(guān)性大，實踐題目均為網(wǎng)站開發(fā)項目，以教師命題為主，學(xué)生也可以自擬題目。實踐項目要求學(xué)生至少完成10個網(wǎng)頁的代碼編寫，并能把本課程所學(xué)知識應(yīng)用到項目中。學(xué)生完成實踐項目后，要以小組形式答辯并撰寫項目報告。通過一周的項目實踐，學(xué)生的軟件開發(fā)能力、代碼調(diào)試能力、團隊協(xié)作能力得到顯著提升。

（五）考核評價

傳統(tǒng)的考核一般只包含期末考試和平時出勤、作業(yè)等，容易出現(xiàn)“一刀切”的情況，在評價學(xué)生學(xué)習(xí)成效方面存在一定的局限性。期末成績應(yīng)該是對學(xué)生的學(xué)習(xí)過程和學(xué)習(xí)結(jié)果的綜合評價。超星學(xué)習(xí)通平臺能對學(xué)生各個學(xué)習(xí)階段的學(xué)習(xí)情況進行監(jiān)測，包括視頻學(xué)習(xí)個數(shù)、章節(jié)學(xué)習(xí)次數(shù)、出勤情況、章節(jié)測驗情況、觀看直播情況、分組完成任務(wù)情況、完成作業(yè)情況、參與討論情況等，并能生成統(tǒng)計數(shù)據(jù)。課題組在教學(xué)實踐中采用了一種新的綜合考核評價方式：把學(xué)生在超星學(xué)習(xí)通中的課程學(xué)習(xí)數(shù)據(jù)作為期末考核成績的一部分，將本課程的期末成績細分為平時成績、期末考試成績、項目實踐成績?nèi)糠?，平時成績占40%，期末考試成績占40%，項目實踐成績占20%。其中，平時成績中平時作業(yè)占30%，簽到占10%，課程視頻學(xué)習(xí)占30%，參與討論占15%，分組完成任務(wù)占15%;期末考試主要以學(xué)生上機完成編程題為主，重點考查學(xué)生的代碼編寫能力和代碼調(diào)試能力;項目實踐成績中項目完整度占50%，文檔編寫能力占20%，表達能力占15%，創(chuàng)新能力占15%。采用多維度數(shù)據(jù)對學(xué)生的學(xué)習(xí)情況進行評價，能更客觀、全面地反映學(xué)生的學(xué)習(xí)過程和學(xué)習(xí)效果。

五、混合教學(xué)模式成效

課題組負責(zé)周口師范學(xué)院2019級軟件工程專業(yè)2班和3班的HTML5程序設(shè)計課程教學(xué)。為檢驗上述教學(xué)模式的效果，課題組在初次使用混合教學(xué)模式時，只應(yīng)用于2019級軟件工程專業(yè)3班。2019級軟件工程專業(yè)2班作為對照班，仍采用傳統(tǒng)教學(xué)模式。初期，混合教學(xué)模式的教學(xué)效果并不明顯，隨著課程的推進，2019級軟件工程專業(yè)3班的學(xué)生上課更加主動，能夠積極參與教學(xué)討論。通過項目實踐，2019級軟件工程專業(yè)3班學(xué)生的動手操作能力、自主分析問題能力和解決問題能力明顯優(yōu)于2班，線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)模式效果開始顯現(xiàn)。

HTML5程序設(shè)計是一門理論和實踐并重的課程，具有知識點零散、不利于學(xué)生理解和記憶的特點。面對新工科建設(shè)對計算機相關(guān)專業(yè)提出的新要求，針對教學(xué)過程中存在的學(xué)生編碼能力、創(chuàng)新能力不足等問題，課題組通過線上線下相結(jié)合的翻轉(zhuǎn)課堂混合教學(xué)模式改善了傳統(tǒng)教學(xué)中教師“滿堂灌”的情況，在一定程度上避免了傳統(tǒng)教學(xué)模式下課堂活力不足的情況。通過課前向?qū)W生推送微課視頻等自學(xué)資料幫助學(xué)生初步理解并掌握知識點，通過在視頻中增設(shè)問題激發(fā)學(xué)生的學(xué)習(xí)興趣和學(xué)習(xí)自主性，引導(dǎo)學(xué)生積極參與教學(xué)過程;通過課中討論環(huán)節(jié)加強學(xué)生對知識的深層理解，培養(yǎng)學(xué)生的表達能力和發(fā)散思維;通過課后鞏固增強學(xué)生舉一反三的能力;通過項目實踐增強學(xué)生的動手實踐能力、團隊協(xié)作能力，激發(fā)學(xué)生的創(chuàng)新能力，最終提升學(xué)生解決問題的能力和計算機素養(yǎng)。這種教學(xué)模式也可以應(yīng)用到同類計算機應(yīng)用開發(fā)課程中。

參考文獻：

[1]教育部.關(guān)于政協(xié)十三屆全國委員會第三次會議第4781號（教育類370號）提案答復(fù)的函[EB/OL].

（2020-11-04）.http：//www.moe.gov.cn/jyb_xxgk/

xxgk_jyta/jyta_gaojiaosi/202012/t20201215_505

645.html.

[2]教育部.教育部辦公廳關(guān)于印發(fā)《未來技術(shù)學(xué)院建設(shè)指南（試行）》的通知[EB/OL].（2020-05-12）.http：//

www.moe.gov.cn/srcsite/A08/moe_742/s3860/

202005/t20200520_456664.html.

[3]高等工程教育發(fā)展戰(zhàn)略研討會在復(fù)旦大學(xué)召開[EB/OL].（2017-02-11）.http：//education.news.cn/

2017-02/21/c_129488081.htm？winzoom=1&

from=timeline&isappinstalled=0.

[4]易慶竑.基于慕課的翻轉(zhuǎn)課堂及其教學(xué)結(jié)構(gòu)研究[J].現(xiàn)代教育技術(shù)，2015（4）.

[5]姜迪，潘晟旻，方嬌莉.疫情期間基于MOOC的翻轉(zhuǎn)課堂模式在線上教學(xué)中的實踐[J].計算機教育，2021（6）.

責(zé)編：瀚 海