混合式教學在Web前端開發課程中的應用研究＊

劉蘊涵，楊帆，趙瑋，楊冠男

(南京財經大學信息工程學院，江蘇 南京 210023)

0 引言

Web 前端開發技術是信息管理與信息系統、計算機類本科專業必修的一門核心課程。該課程以實踐能力為導向，注重學生對理論基礎知識的理解，教授學生掌握和使用HTML、CSS 和JavaScript 技術，培養團隊合作精神。通過對瀏覽器網頁進行布局設計，使學生能夠真正掌握Web 前端開發知識在實際場景中的應用。同時為應對當前新冠疫情常態化，以教室為場景的面對面課堂教學時常面臨被暫停，全國各高校積極嘗試混合式教學及其體系的構建。這一過程中會遇到的重點與難點在于：①面對當前在線教學資源海量化、知識碎片化的特點，教育教學內容的甄選以及在線課程設計耗費教師大量的時間與精力。②多種在線課程學習平臺的使用也會給學生在學習過程中造成混亂，反而影響學生的學習效率。③課程開展的過程中，需要充分發揮學生自主學習的能力，克服在線教學的時空限制最大程度地提高學生Web 前端開發的實踐應用能力。

本文通過總結各種網絡教學平臺與工具應用的經驗，歸納教學設計與實施體驗，結合學生的反饋效果，在解決關鍵問題基礎上提煉出行之有效的線上線下混合式教學模式。線下教學做到讓學生自主學習，線上輔導幫學生解決疑問，這種教學模式對于學生的創新能力培養有著重要意義。

1 Web技術混合式教學模式的構建

由于大數據、信息系統與管理等課程隨著信息技術的快速發展課程內容具有變化快、時效性強的特點，這不僅要求學生要系統地掌握課程章節的基本原理與方法，還需要匹配與現實專業技術工作相關的典型案例，以培養學生解決實際問題的能力與操作水平。根據這一要求，可以通過充分利用網絡教學平臺上實時更新的優秀課程資源，將線上與線下教學內容進行設計與融合，充分發揮兩者各自優勢，形成互補。

1.1 混合式教學資源構建階段

當代大學生越來越習慣于在線學習的方式，通過多渠道靈活、及時地獲取電子資料，這可以大大提高學生對于計算機網絡相關專業知識的理解與掌握程度。與此同時，教師合理地、有計劃地把集結高校、名師、國家級精品課等優質課程資源用于教學，既能夠支持學生的個性化學習，也能夠提高教學效率。因此，我們擬制作一個包含在線課程視頻、在線章節測試、在線代碼源等的Web 技術開發課程資源庫。針對編程類課程的特征，教學設計更加注重鍛煉學生的計算思維和解決問題的綜合能力，包括知識內容方面、學生自主探究任務單、學習資源準備和開發、問題情境設計等多個方面。教學設計步驟如下：①按照課程各章節順序將所有知識點進行梳理和歸納，根據課程體系的遞進層次對每章節知識點的重要性與難易度進行標注；②根據標注知識點甄選“線上”優質教學視頻與最新編程案例，將其分為引例與課后案例兩類。③結合教學大綱要求，準備“線下”課堂教學資料，包括講義課件、小組任務協作材料、習題等。最后，創建“線上”教學平臺（如南京財經大學網絡教學平臺、SPOC 等）并上傳教學資料。在教學過程中充分利用構建成的課程資源庫，隨時不斷更新代碼及課程資源庫的內容。這樣可以解決傳統線下教學資源不足、單一的問題，使學生學到更全面的知識，隨時都能夠接觸到最新的案例代碼，練習編寫并應用。這樣有利于學生對課程內容進行自主探究與共享，從而發揮出學生的主體性。

1.2 混合式教學模式實施階段

由于教學設計階段性特征明顯，按照教學環節分為課前、課中與課后三個階段，每個階段依托教學內容達成各項教學目標。如圖1 所示，呈現了不同階段的主體、任務、活動形式等。

圖1 混合式教學Web開發課程總體實施方案

課前線上預習。給學生分組，三～五位學生為一組，指定一名組長，組織學生團隊（即組）通過申請本課程SPOC 并且進入慕課堂，演示完整的項目代碼，使學生直觀地感受知識點是如何應用到實際瀏覽器網頁設計中的，激發學生的求知欲。在展示的過程中，先介紹網頁設計效果，確定項目所要解決的具體問題，讓學生帶著問題預習。然后教師介紹每一部分功能和所涉及的知識點，布置具體的課前學習任務，并且設計發放調查問卷。教師觀察后臺學生的學習數據記錄，實時監督學生的學習進度。

課中線下教學。教師在教室場景下首先通過抽查提問等方式，及時把握學生對課前項目代碼演示的理解程度以及通過課前預習對知識點的掌握情況；其次，教師進一步對各章節知識點和重要理論進行深入分析與歸納總結，對學生在學習過程中遇到的難點疑點問題進行解答。

課后線上拓展與線下討論。利用線上教學平臺發布實踐任務，進入學生實踐環節。實驗過程強調理論與應用相結合，鍛煉學生的實際動手能力。學生以小組為單位，由組長給每一位組員分配具體任務，教師及時了解不同小組的任務分工和任務完成進度，與學生討論實驗過程中遇到的問題。對于學生考慮不足之處給予補充，對普遍存在的問題進行統一講解，對于學生存在的個別問題以一對一的方式討論解決。小組完成任務后，讓每個小組推薦一名學生介紹網頁設計的過程及遇到的問題，并重點介紹解決方法，之后進入課堂評價和總結環節。課堂評價采用教師評價和組內互評兩種方式。教師按照評分標準打分，并且在學期結束時以調查問卷的方式讓小組成員進行互評。教師完成評分之后對課程的總體情況進行分析匯總，總結案例運用的主要知識點和普遍遇到的問題，并提出進一步的改進和完善的方向，引導學生能夠自主性深入拓展學習。通過線下課堂講解串聯課前預習與整章節知識；通過小組合作提高學生的團隊協作和溝通能力；通過教師評價和學生互評，及時發現并解決問題，從而提高學生的實踐能力和表達能力，最終讓學生學會應用相關技術，提高綜合分析能力、實際操作能力和創新能力。

2 多途徑多元化評價考核機制

利用線上線下途徑建立多元化的評價體系，如表1所示。該考核機制擴大課程最終成績中的過程性考核成績的構成比例，不再將期末考試作為最終總評成績的關鍵參考要素。避免傳統考核方式中單一僵硬化，有效排除學生突擊應對期末考試的弊端，及時考察學生日常學習效果，與監督學生過程化學習形成教學中的一個閉環，最終達到提高教學效果的目的。平時成績為線上過程性考核，包括線上學習數據記錄、小組實驗成績、小組互評、隨堂測試、考勤等多項考核指標構成，側重考察學生對課程知識的理解與應用。期末成績為線下結果性考核，由傳統的線下閉卷考試的方式進行，側重考核學生對課程知識體系、客觀知識點的記憶與綜合性運用。總評成績由平時成績和期末成績按適當比例構成。

表1 多途徑多元化考核機制的實施

3 結束語

本文以“Web 前端開發技術”課程為例，通過分析在疫情期間設計并實施的以線上為中心的混合式教學模式，結合線下教室為場景的面對面傳統教學方式，進一步提煉出線上與線下有機融合的新型教學模式；設計多途徑多元化的評價體系，將線上過程化考核與線下結果性考核兩者相結合。教學實踐表明，該模式的開展推動了各教學環節從以教師傳授知識為主導向以學生主動學習為主導轉化，體現了教師與學生雙主體的混合式教學過程，充分調動學生的學習積極性，提升學生合作探究的能力,以此推進學生計算與編程能力的自主性提高。今后我們會繼續探索研究Web 前端開發課程混合式教學創新，不斷完善整體性教學流程，推動Web 開發課程教學發展，實現培養變革性交叉學科人才的目標。