基于“1+X”證書制度的Web前端開發(fā)課程思政探索與實踐研究

陸王紅

摘要：該文研究了“1+X”證書制度下《Web前端開發(fā)》課程的思政教學改革，剖析了當前課程思政改革中的一些問題，闡述了“1+X”證書制度與課程思政的關系，探討在“1+X”證書背景下課程思政元素的融入和教學案例庫的設計，為相關課程的思政研究提供參考。

關鍵詞：“1+X”證書；Web前端開發(fā)；課程思政

中圖分類號：G642.0? ?文獻標識碼：A

文章編號：1009-3044（2022）30-0134-03

開放科學（資源服務）標識碼（OSID）：

2016年12月，習近平總書記在全國高校思想政治會議上指出：要用好課堂教學這個主渠道，各門課都要守好一段渠、種好責任田，使各類課程與思想政治理論課同向同行，形成協(xié)同效應[1]。2019年4月，教育部啟動了1+X證書制度試點工作，鼓勵將X證書的內(nèi)涵與外延融入專業(yè)課程中，不僅注重技能的培養(yǎng)，更要培養(yǎng)學生的家國情懷、社會責任和道德規(guī)范等軟實力[2]。

2020 年教育部教高（2020）3號文《高等學校課程思政建設指導綱要》（下文簡稱綱要）指出全面推進高校課程思政建設，發(fā)揮好每門課程的育人作用，提高高校人才培養(yǎng)質(zhì)量，確立“育德樹人”的根本目標。要想達成目標，則需要將價值塑造、知識傳授和能力培養(yǎng)三者融為一體、不可割裂。全面推進課程思政建設，就是要寓價值觀引導于知識傳授和能力培養(yǎng)之中，幫助學生塑造正確的世界觀、人生觀、價值觀[3]。

在思政教育新形勢下，依據(jù)“1+X”職業(yè)技能等級標準，深度挖掘Web前端開發(fā)實訓課程中所蘊含的思政元素，編制巧妙融入思政元素的課程教學內(nèi)容，運用教學技巧和方法進行教學設計，在實訓課堂教學中提升思政教育的針對性和時效性，職業(yè)技能與職業(yè)素養(yǎng)相互滲透，推動軟件技術專業(yè)學生職業(yè)技能與職業(yè)素養(yǎng)的同時養(yǎng)成，提升學生了解當前時事政治形勢的意識，培養(yǎng)愛國情懷和身為社會一分子的責任擔當，為后續(xù)的研究提供借鑒，具有一定的現(xiàn)實意義。

1 課程思政現(xiàn)存問題

目前計算機類專業(yè)課程思政教學實施中主要存在以下問題：

（1）流于形式。部分教師在授課過程中，不能持續(xù)、深入地挖掘與所授課程、所授內(nèi)容緊密相連的思政元素，與課程目標關聯(lián)不大，流于表面形式，思政內(nèi)容基本停留在社會主義核心價值觀、八禮四儀等基本內(nèi)容上，實際授課還是以專業(yè)知識的傳授為主，未能切實做到將課程思政與專業(yè)課程有機融合；

（2）緊跟企業(yè)不夠。受各種因素影響，不能定期對Web前端開發(fā)企業(yè)進行調(diào)研，及時跟進前端開發(fā)技術人員思想動態(tài)變化，做到深入掌握崗位職業(yè)能力的要求、綜合素養(yǎng)的提升要點，缺乏對相關企業(yè)專家意見的征求，及時修訂課程目標，形成課程思政內(nèi)容的融入；

（3）與專業(yè)、學情結(jié)合度不高。同樣的課程思政點，面對不同的專業(yè)和不同年級的學生時，教師的融入與輸出方式大同小異，課程思政改革模式相似，思政點的抓取也相似，體現(xiàn)專業(yè)、學情、課程本身的力度不夠，缺乏與之相匹配的課程思政實施標準與方案；

（4）同軌教師配合度不高。同一門課程的開設時間可能出現(xiàn)在不同專業(yè)和同年級的不同班級間，擔任教學的教師在沒有統(tǒng)一思政實施標準和方案的基礎上，課程思政點的融入方式基本由個人決定，教師之間缺少分工合作，定期教研，共同探討目前的社會熱點、典型行業(yè)案例、典型人物故事等方面所蘊藏的思政元素，并將其恰當?shù)厝谌虢虒W中，以期達到潤物細無聲的效果；

（5）與“1+X”證書關聯(lián)度不高。目前大多數(shù)的課程思政基本停留在課程理論知識點和操作技能本身的專業(yè)教學，而與之相關的技能證書所要求具備的綜合能力則涵蓋職業(yè)技能和職業(yè)素養(yǎng)，這就要求專業(yè)教學與職業(yè)技能等級標準要有效對接；

（6）缺乏有效的課程思政考核機制。目前課程的考核機制還是以知識目標和技能目標的達成為主，教學成效所包含的課程德育目標對應的具體成效，還未達到可觀察、可評估、使學生有成就感的水平。

2? 課程思政實施研究

2.1 Web前端開發(fā)課程地位

Web前端開發(fā)課程是高等職業(yè)院校軟件技術專業(yè)的一門專業(yè)方向課程，該課程以實踐能力為導向，結(jié)合HTML、CSS、JavaScript、jQuery等Web前端開發(fā)中的核心知識和技術，注重學生對理論基礎知識、專業(yè)技能的理解、掌握及運用，整個課程通過對實際案例和應用環(huán)境進行分析與設計，使學生能夠真正掌握Web前端開發(fā)的知識和技術在實際場景中的應用，并培養(yǎng)學生建立終身學習的意識，增強學生自主學習的能力，提升學生職業(yè)素養(yǎng)和核心競爭力。

2.2 課程思政方向

課程思政是將職業(yè)精神和價值觀融入課堂知識傳授、能力培養(yǎng)之中的有效思政教育方法[4]?！禬eb前端開發(fā)》課程的知識點涵蓋HTML、CSS、JavaScript、jQuery等大部分的前端開發(fā)技術，而前端開發(fā)證書所對應的職業(yè)技能等級標準涵蓋職業(yè)素養(yǎng)、職業(yè)技能和理論知識等內(nèi)容，遵循不同的內(nèi)容要融入的思政元素不盡相同的原則，在課程思政點的挖掘過程中，力求做到密切貼合課程教學與職業(yè)技能等級標準?！禬eb前端開發(fā)》主要選取愛黨愛國、民族自豪、工匠精神、人文素養(yǎng)、法律意識、正能量、勇于擔當?shù)确矫娴乃颊剡M行融合[5]。

2.3課程思政元素融入設計

《Web前端開發(fā)》共包含三大模塊，分別為基礎模塊、技術模塊和實踐模塊。每個模塊包含的知識點和思政元素的融入如圖1所示：

2.3.1基礎模塊

主要包含實踐概述、開發(fā)工具以及網(wǎng)站服務器配置。在授課過程中，教師首先帶領學生瀏覽課程總體的實踐目標、實踐知識地圖、實施安排等，培養(yǎng)學生的大局觀念和總體意識，幫助學生樹立自信，增強為中華民族的偉大復興而奮斗的信念；接下來介紹網(wǎng)頁設計與制作的常用方法與技巧，培養(yǎng)學生耐心、專注、嚴謹?shù)目少F品質(zhì)；最后介紹使用的開發(fā)工具HBuilder及網(wǎng)站服務器部署。目前前端開發(fā)常用的軟件有Dreamweaver、sublime、Notepad++、HBuilder等，其中HBuilder是數(shù)字天堂推出的一款Web前端開發(fā)的國產(chǎn)軟件，通過介紹和使用此軟件，可激發(fā)學生的民族自豪感。

2.3.2技術模塊

此模塊主要包含核心知識、CSS新特性和移動端三大部分。

（1）核心知識部分由HTML制作靜態(tài)網(wǎng)頁、CSS設計頁面樣式、JavaScript開發(fā)交互效果和jQuery開發(fā)交互效果等組成。其中HTML制作靜態(tài)頁面為學生講解HTML的基本結(jié)構(gòu)，HTML中的多種常用標記的定義、功能及使用方法，通過設計貼合生活、緊貼職業(yè)技能要求的多個小案例，引導學生傳承和弘揚中華美學精神，樹立正確審美觀，提升審美水平，陶冶高尚的道德情操、塑造美好的心靈，培養(yǎng)學生勤學、善學的精神品質(zhì)，通過網(wǎng)頁內(nèi)容的核查，提升學生的法律意識。

（2）CSS新特性部分由CSS3新特性開發(fā)頁面樣式和HTML5新特性制作靜態(tài)網(wǎng)頁兩種方法組成。CSS3新特性大概分為選擇器（含偽類、偽元素）、背景和邊框?qū)傩浴⑽谋拘Ч?D/3D轉(zhuǎn)換等，HTML5新特性主要包括語義化標簽、增強型表單以及新增表單屬性等，通過完成相關的網(wǎng)站頁面，幫助學生建立扎實的Web前端開發(fā)專業(yè)技能基礎，引導學生在制作過程中用心體會以人為本的設計理念，并形成良好的操作習慣，努力成為兼具技能與核心素養(yǎng)的雙創(chuàng)型人才。

（3）移動端由HTML5制作移動端靜態(tài)網(wǎng)頁、CSS3制作移動端靜態(tài)網(wǎng)頁和JavaScript開發(fā)移動交互效果組成。隨著智能手機的興起和大范圍的普及，人們越來越習慣和喜歡通過手機端App來完成購物、生活、學習、工作和娛樂，進而越來越多的手機網(wǎng)民開始依賴于手機端App軟件，而App的開發(fā)同時又能促進了移動電子商務的發(fā)展，也有利于企業(yè)實現(xiàn)更為精準的營銷。通過完成實訓案例，啟迪學生將思維深入知識的發(fā)現(xiàn)和再發(fā)現(xiàn)過程中，激發(fā)學生創(chuàng)新意識，提高其獨立思考能力和邏輯思維能力。

2.3.3實踐模塊

此模塊以企業(yè)開發(fā)項目——設計制作防疫知識科普網(wǎng)為載體，貫穿Web前端開發(fā)的大部分核心技術，融合了相關職業(yè)資格證書對知識、技能和態(tài)度的要求。項目設計以Web前端項目開發(fā)過程為線索來進行，通過分析職業(yè)崗位需求，將知識、技能和情感、態(tài)度融入具體的項目之中，培養(yǎng)學生的規(guī)范性意識和制作前端網(wǎng)頁的職業(yè)能力和職業(yè)素養(yǎng)，為適應以后的工作崗位奠定基礎。將愛國教育、工匠精神、勞動教育、職業(yè)素養(yǎng)等思政元素融入課堂教學中，使學生在學習過程中提高分析問題、解決問題能力的同時，了解當前時事政治形勢，培養(yǎng)學生愛國情懷和積極向上的人生觀、價值觀。項目的開發(fā)流程嚴格按照企業(yè)開發(fā)流程進行，學生通過完成網(wǎng)站首頁和網(wǎng)站分頁的設計與制作，學習過程與工作工程相互滲透，學生的學習能力、綜合實踐能力、設計創(chuàng)新能力得到提升。

2.4教學案例庫設計

《Web前端開發(fā)》課程按照“由知到行”“知行結(jié)合”的體系結(jié)構(gòu)進行開發(fā)，由基礎模塊、技術模塊和實踐模塊三部分組成，其中前兩個模塊采用項目任務驅(qū)動式教學法，利于激發(fā)學生的學習熱情，高效理解并掌握相關技能；實踐模塊以企業(yè)開發(fā)項目為載體，若想課程教學能夠有效開展，建立教學案例庫是首選。案例庫的選題應在結(jié)合學情的基礎上，遵循課堂教學的原則，不僅要考慮知識與技能的快速、有效掌握與應用，也要考慮課程思政的恰當融入，同時還要緊密切合Web前端開發(fā)技能證書的標準和要求。

本課程的授課對象是高職四年級的學生，他們思維活躍，對當前社會熱點非常敏感，喜歡頭腦風暴，熱衷信息技術以及智能移動終端技術，學習有熱情，動手實踐能力強。因此在項目案例中，選取了能夠觸動學生的案例，從社會熱點到身邊日常，涉及多個方面，深入挖掘思政元素，并尋找恰當?shù)娜谌敕绞?。下面以實踐模塊中設計制作網(wǎng)站首頁為設計案例。

《設計制作“防疫知識科普網(wǎng)”首頁》案例設計：

（1）網(wǎng)站整體規(guī)劃設計

明確網(wǎng)站主題，規(guī)劃網(wǎng)站目錄結(jié)構(gòu)和內(nèi)容，設計頁面風格，頁面布局采用三行布局——頭部、主體、底部。主體部分分成4行，其中而三行分左右兩列。

1）涉及知識點：Web前端項目開發(fā)流程、網(wǎng)頁設計規(guī)范、熟悉常見的網(wǎng)頁布局方式，規(guī)劃設計網(wǎng)站的目錄結(jié)構(gòu)、內(nèi)容結(jié)構(gòu)、頁面風格的方法，標簽的嵌套、頭部標簽、Div標簽，CSS樣式、網(wǎng)頁布局屬性；

2）對照Web前端開發(fā)證書（初級）的知識技能要求：會使用HTML文本標簽、頭部標簽、Div盒模型應用，能使用CSS樣式對網(wǎng)頁進行布局；

3）融入思政元素：關注時事政治，弘揚學生愛國情懷，培養(yǎng)學生大局觀念和總體意識，通過熱點事件，增強公民意識，激發(fā)學生制作熱情。

（2）設計制作首頁內(nèi)容

分別為導航板塊、信息板塊、防疫知識視頻、其他板塊添加內(nèi)容，并完成基本樣式設置。

1）涉及知識點：列表標簽、Div標簽、表單標簽、視頻標簽、超鏈接標簽、CSS盒模型、浮動模型、定位模式。

2）對照Web前端開發(fā)證書（初級）的知識技能要求：能熟練運用HTML多種標簽、掌握CSS選擇器、背景、字體樣式、文本樣式、顏色、背景功能等。

3）融入思政元素：通過討論和交流培養(yǎng)學生遵守信息安全相關的法律規(guī)范及道德規(guī)范觀念，提升法律意識。自主設計制作網(wǎng)頁模塊，培養(yǎng)學生數(shù)字化資源的學習能力，提升職業(yè)素養(yǎng)，尊重學生的勞動價值，使學生獲得學習的成就感和滿足感。

（3）優(yōu)化完善首頁效果

使用CSS對首頁進行優(yōu)化、美化。

1）涉及知識點：常用HTML標簽的CSS屬性含義及其設置方法，網(wǎng)頁美化的思路和一般步驟，CSS3新特性、彈性布局、盒模型。

2）對照Web前端開發(fā)證書（初級）的知識技能要求：能使用CSS設計頁面樣式，了解CSS3特性、CSS3動畫效果、彈性布局的使用方法，能使用CSS3新特性開發(fā)頁面樣式

3）融入思政元素：頭腦風暴的引入，較大地拓寬了學生的邏輯思維，小組協(xié)作的方式，為學生創(chuàng)造出和諧友善的學習環(huán)境，引導學生自主探究，完成項目，幫助學生樹立自我發(fā)展的人生觀，拓展任務的布置，使學生深刻體會學習的成就感，從而培養(yǎng)推陳出新的大國工匠精神。

（4）添加首頁交互效果

為首頁導航區(qū)的圖片添加翻頁效果、信息板塊添加選項卡切換效果。

1）涉及知識點：JavaScript數(shù)據(jù)類型、變量、選擇器、函數(shù)、事件，jQuery中DOM操作、事件和動畫。

2）對照Web前端開發(fā)證書（初級）的知識技能要求：掌握JavaScript基礎語言、函數(shù)、事件，掌握jQuery中選擇器、事件和動畫功能。

3）融入思政元素：良好的網(wǎng)頁的交互功能可以為用戶提供良好的使用體驗，通過“換位”意識，強化學生以人為本的開發(fā)理念，自主設計選項卡效果，培養(yǎng)學生數(shù)字化資源的學習利用能力，增強學生對已學知識的綜合運用能力，提升職業(yè)素養(yǎng)。

3 結(jié)語

在思政教育的新形勢下，積極響應國家職業(yè)教育政策，依據(jù)“1+X”職業(yè)技能等級標準，深度挖掘Web前端開發(fā)課程思政元素，將價值塑造、知識傳授和能力培養(yǎng)三者融為一體，在實踐中開展有效教學，探索，研究獲取的成果不僅能夠推動專業(yè)課程建設與改革，對軟件技術專業(yè)課程教學改革具有及基地意義，而且也有利于實現(xiàn)專業(yè)技術人才“德技兼?zhèn)洹钡挠顺尚А?/p>

參考文獻

[1] 習近平.把思想政治工作貫穿教育教學全過程 開創(chuàng)我國高等教育事業(yè)發(fā)展新局面——劉云山講話 王岐山張高麗出席[N].人民日報，2016-12-09（1）.

[2] 秦媚，姚波，李娉霞，等.1+X證書制度背景下課程思政實施現(xiàn)狀及對策分析[J].現(xiàn)代職業(yè)教育，2021（43）：18-19.

[3] 丁海霞.高職計算機專業(yè)課程思政與工匠精神融合研究[J].湖北開放職業(yè)學院學報，2021，34（20）：26-27，30.

[4] 曹寧，陳之酉，李友節(jié)，等.課程思政視域下職業(yè)院校實訓課程內(nèi)容的重構(gòu)[J].天津中德應用技術大學學報，2021（5）：119-122.

[5] 馬秋芳，史宏，潘浩.1+X證書制度下前端開發(fā)課程思政研究[J].福建電腦，2021，37（8）：151-153.

【通聯(lián)編輯：朱寶貴】