《Web前端開發入門》在線開放課程的建設與應用

【摘要】本文以《Web前端開發入門》為例，介紹了在線開放課程在課程標準、教學內容、教學模式、評價方式等方面優化的探索實踐。

【關鍵詞】在線開放課程? Web前端開發入門? 教學改革? 混合式教學

【中圖分類號】G642 ? 【文獻標識碼】A 【文章編號】2095-3089（2022）08-0179-04

一、課程建設背景

2019年上海市教委啟動了職業院校在線開放課程的建設，該類課程是在精品課程建設基礎上，優化課標設計和教學評價體系，完善并整合在線資源，使其與教學實際需求匹配融合。凝聚提煉經典教學實錄與教學案例，發揮優質職業教育教學資源的輻射功能，推動信息技術與教育教學深度融合，促進優質教育資源應用與共享。

我校于2019年申報了《Web前端開發入門》在線開放課程，2020年正式立項。該課程是中等職業學校網站建設與管理專業的一門專業核心課，其功能是使學生掌握使用HTML5+CSS3進行網頁制作的基本知識和基本技能，它是一門基礎性、實用性都很強的專業課程。在互聯網+、新興技術不斷發展的背景下，Web前端開發人才緊缺，從招聘網站需求量可以看出，市場供給嚴重失衡，2019年教育部等四部委啟動了1+X證書的試點工作，工信部的Web前端開發職業技能等級證書成為首批試點培訓評價組織及職業技能等級證書，1+X證書制度與 Web 前端開發技術課程的融合勢在必行。

二、課程建設目標

重新梳理課程內容和任務要求，建立一套系統完整的課程標準，拓展整合優質課程資源，優化教學模式，完善評價機制，真正做到“課證融通”，全面推進Web前端開發課程的標準化教學。

三、課程建設所面臨的問題

（一）教學內容滯后

Web前端開發技術迭代更新速度快，一線教師普遍缺乏企業實戰經驗，對當下行業內所采用的開發技術并不熟知，教學內容基本還是以教材為主，這就導致了學生所學與市場所需脫節，無法滿足企業需求。

（二）教學模式守舊

在教學過程中教師還是習慣于講授、演示的方式，學生處于被動的接受狀態，對于新知往往只知其然不知其所以然，學習的主動性和積極性被抑制，教學效果欠佳。

（三）評價方式片面

過于關注學生對技能點和知識點掌握的結果導向評價，強調學習效果，弱化過程評價、態度評價、能力評價，不利于學生綜合素養的塑造，也違背了學生全面發展的初衷。

（四）教學資源單一

教學資源主要還是以文檔內容為主，對于知識技能點的講解較為抽象，不夠直觀生動，不利于學生理解。

四、課程建設思路

本課程以 OBE 成果導向為指導思想，圍繞“文化素質+職業技能”的培養方向，采用項目驅動，任務引領，講、練、做一體化技能訓練式教學。

（一）細化落實課程標準

以行業內相關崗位技能要求為基礎，參照Web前端1+X初、中級的課程內容，結合行業專家和課程專家的意見建議，完成本門課程課程標準的開發。

（二）優化調整教學內容

將企業實戰項目引入課堂，以典型的工作任務作為知識載體構建教學內容，使得學生的能力更符合崗位要求。

（三）改革創新教學模式

教師的角色由知識的灌輸者、守護者轉變為學生學習活動的組織者、參與者、共享者，在這個學習過程中，教師以學生為本，依學定教。

（四）豐富完善評價方式

依據課標細化評分標準，做到每課次涉及的知識技能點全覆蓋，在此基礎上增加職業素養的評價維度，同時注重過程性評價，引入多元評價主體，確保評價的科學、客觀、公正，使評價能成為學生認識自我、發展自我、管理自我、激勵自我的一種手段，促進學生全面可持續發展。

（五）整合開發優質資源

根據教學內容中的重點與難點、學生的認知規律和興趣特點，將抽象的知識內容轉化為形象演示，讓知識易懂，吸引學生的學習興趣。按照教學內容需要整理和補充微課、多媒體課件以及動畫和視頻等教學素材。以知識點為單位開發配套的測試練習題，為學生在課前、課中、課后學習測試和評價服務。

五、課程建設成果

（一）“崗課賽證”四位一體，重構教學內容

本課程以職業能力和崗位需求為核心，以Web前端開發世界技能大賽技術文檔和1+X Web 前端開發證書職業標準為依據，重新制定了課程標準，優化了課程內容[1]，重構后的內容涵蓋了網頁內容的創建、網頁的基本美化、網頁的基礎布局、CSS3變形和動畫的應用，CSS3新增布局方式的應用和響應式頁面的開發6大部分。

課程內容的組織顛覆了傳統的以知識結構體系串聯，而是以Web前端開發典型工作項目為主線，將知識點打散到每個任務中，讓學生在完成工作任務的過程中逐漸加深對專業知識、技能的理解和應用，培養學生的綜合職業能力，滿足學生職業生涯發展的需要[2]。

本課程分為基礎篇和進階篇，通過基礎篇項目——《英語培訓網站開發》的學習，學生能達到1+X Web 前端開發證書初級HTML+CSS3部分的職業能力要求。

通過進階篇項目——《Bootstrap開發工業設備企業首頁》的學習，學生達到1+X Web前端開發證書中級使用Bootstrap前端框架開發響應式頁面的要求。

（二）線上線下混合式教學，凸顯學生主體地位，促進有效深度學習

利用在線平臺的優勢，教師課前將學習資料和配套測試題發布供學生預習。學生通過線上預習對新知有了基本的了解，也為線下的課堂學習做好了鋪墊。同時，教師可根據平臺統計的學生數據收集共性問題及時調整教學方案，使得課堂教學更有針對性。

在線下課堂教學中，教師針對學生預習環節出現的共性問題進行深入講解，并以項目任務為載體，組織學生把在線所學到的基礎知識進行鞏固與靈活應用。在教學實施過程中，教師不再是課堂的主體，而是扮演著組織者、引導者的角色，通過創建情境，巧妙設疑，適當點撥，充分調動學生的主觀能動性，鼓勵學生利用課程資源包完成知識點的自主學習，通過小組討論，同伴互助的形式嘗試解決任務中的難點，通過展示交流點評取長補短，潛移默化中提升了學生的探究學習、團隊協作、交流表達等能力。

課后學生根據教師發布的作業和拓展資料對知識進行進一步思考、鞏固、拓展與提升。同時，學生可以線上分享學習體會和學習經驗。此外，教師通過在線平臺可對學生學習情況進行深度挖掘，掌握學生在線學習的訪問內容及頻率、學習路徑、學習偏好等。結合分析結果，有針對性地進行學習引導和監管，對學習有困難的學生進行個別輔導。

通過線上線下，課前、課中、課后有效融合形成學習閉環，提升教學效果[3-4]。

（三）采用多維度、多元化的評價方式，實現以評促教，以評促學

1.細化評價標準

課程的課次任務評價參照了1+X? Web前端開發等級考證和世界技能大賽“網站設計與開發”項目的評價標準，根據課次任務所涉及的知識技能點，設置相應的評分項目，做到全覆蓋不遺漏。明確、細化的評價標準使教師對每一位學生的評價都能有理有據，標準一致，學生也能根據評價表清晰地了解自己對本課次學習內容的掌握情況，便于他們更有針對性地查缺補漏。

課次評價方案中除了對學生知識技能進行評價之外，還引入了職業素養的評分項目。考查學生代碼命名是否規范，結構是否清晰，能否添加合適的注釋，代碼是否符合W3C標準，使學生從一開始就養成代碼編寫規范的習慣，從而推動他們全面可持續的發展。

2.評價主體多元化

課程貫徹以教師為主導、學生為主體的教學理念。除了將教師作為權威評價主體之外，充分發揮學生的主觀能動性，鼓勵他們積極參與到自我評價和同伴評價過程中，引導他們反思、總結學習過程中的不足，明確努力的方向，提升學習效率。

3.引入信息化手段助推過程性評價

借助在線開放課程平臺的技術優勢，使評價貫穿于教學活動課前、課中、課后的各環節。課前記錄學生視頻觀看的時間和預習測試的分數，課中統計學生的考勤和課堂互動的情況，課后統計學生的作業提交和擴展資源查看情況。通過后臺生成的精準數據可以第一時間掌握學生的學習情況，使得過程性評價有據可依[5]。

（四）教學資源整合聯動

課程教學資源豐富，內含一整套標準化的頂層課程文件（課程標準，授課計劃，評價方案，教學流程），18個課次文件，10個教學視頻，7個教輔材料，411個媒體資源，161道題庫，7套考核測試。

六、課程實施成效

（一）以課程建設為切入點構建“三教”改革生態

在課程建設中，以“雙向雙融通”為主要途徑，校企雙方師資互兼互聘，提升了教師能力，形成了結構化的教師團隊。課程內容設計對接行業標準、1+X證書標準，技能大賽標準，校企共建“學校課程+企業課程”的數字化資源包;課程實施泛在PBL、翻轉課堂和線上線下混合教學模式，構建以能力為中心的“動態、多元”課程評價體系，推進了“行動導向教學法”改革[6]。

（二）課程資源促進學生“碎片化”學習

2020學年第二學期網站建設與管理專業的18名學生進行了在線開放課程的學習，相較于傳統的學習方式，在線平臺打破了時空的限制，學生可隨時隨地通過在線平臺獲取豐富的課程資源從而進行“碎片化”學習，并根據個人情況，對于重點、難點進行鞏固強化，學生學習的積極性得到了提升。

（三）在線平臺加強了師生溝通，實現了精準教學

通過在線測試、網上輔導、互動討論、網上作業提交和批改、網上社區討論等，促進了師生之間、學生之間進行資源共享、問題交流和協作。

平臺全程跟蹤和記錄學生的學習過程、學習內容、學習效果、學習反饋，掌握每個學生的學習行為，運用大數據分析診斷生成的圖形化和可視化的分析結果，教師能清晰地了解學生的薄弱環節，從而對癥下藥，達到教學效率最大化。

（四）增加單元考核，融入1+X考核標準，推進“1”和“X”的有機銜接

除了傳統的期中、期末考核外，課程還增加了階段性的單元考核作為學生過程性評價的重要組成部分，單元考核的內容、形式、評分標準參照了1+X Web等級證書的要求，從而推進了“1”和“X”的有機銜接，提升了學生的職業能力。

七、建設反思

（一）建立激勵機制，加強引導管理

在《Web 前端開發入門》課程的教學過程中，項目驅動、任務載體的教學模式將知識融入項目，改變了過去學科式的知識傳授模式，對學生的主觀能動性提出了更高的要求，中職學生的自主學習興趣、能力存在差異，在開發課程資源的同時，應考慮建立激勵機制，加強引導管理提升學生的積極性還需要更多的嘗試、努力和實踐。

（二）緊跟行業動態，及時更新課程內容

Web 前端開發技術迭代更新速度快，幾乎每6個月就會有一次變革，這就要求教師緊跟行業動態，不斷學習新技術，并根據崗位要求及時優化調整課程內容，使學生能在課堂上學習到前沿和實用的知識技能，為今后就業打下扎實的基礎。

（三）進一步優化豐富課程資源

雖然課程資源建設已初見成效，但題庫、試卷庫、媒體庫的資源還需進一步的優化和豐富，加大微課和動畫資源的比重，以增加趣味性，降低知識理解難度。

參考文獻：

[1]張莉.1+X證書制度與Web前端課程教學融合創新探索[J].電腦知識與技術，2021（17）：90-92.

[2]張春玉，孫百虎，梁英武，耿敏，李國慶.精品在線開放課程建設的探索與實踐——以吉林省生物化學精品在線開放課程為例[N].石家莊職業技術學院學報，2021（33）：17-21.

[3]李珍琦，王召陽.線上線下相融合的混合式教學模式探究——基于“智慧學伴”平臺的課堂教學結構變革[J].中國教育信息化，2021（13）：82-87.

[4]趙彥，吳莉，周玉珍，杜娟，陸蔚，鄧小龍，許若波.國家精品在線開放課程程序設計基礎混合式教學改革[J].計算機教育，2022（1）：111-114

[5]周紅芳.高職在線開放課程建設及應用探究——以“倉儲與配送管理實務”課程為例[N].湖北廣播電視大學學報，2021（41）：33-38.

[6]李玉清.對國家精品在線開放課程《網絡營銷》的建設、應用與申報[J].辦公自動化雜志，2022（2）：6-8.

作者簡介：

何燁（1984年7月-），女，漢族，浙江蕭山人，本科學歷，講師，研究方向：Web前端開發。