HTML5編程技術課程教學在高職院校中的改革探索

周錫玲

摘要：課程是職業院校人才培養工作的基礎，承擔著人才培養工作的核心功能，對保障人才培養質量起關鍵作用?，F如今，課程建設總體水平不高，課程教學效果不優仍然是職業院校普遍性的短板和瓶頸，亟待加強和改進。結合本院校背景，本文深入分析了《HTML5編程技術》課程在實際教學過程中存在的不足，并提出了在教學過程中使用多種教學方式相結合的解決方案，從而激發學生的學習興趣，使教學效果更佳，并為新形勢下HTML5編程技術課程教學改革提供參考。

關鍵詞：教學效果;教學改革;HTML5編程技術

中圖分類號： TP311? ? ? 文獻標識碼：A

文章編號：1009-3044（2021）03-0134-02

Abstract：Curriculum is the foundation of talent training in vocational colleges， which undertakes the core functions of talent training and plays a key role in ensuring the quality of talent training.Nowadays， the overall level of curriculum construction is not high and poor curriculum teaching effects are still common shortcomings and bottlenecks in vocational colleges， which urgently need to be strengthened and improved. Based on the background of our college， this paper deeply analyzes the shortcomings of the HTML5 Programming Technology course in the actual teaching process， and proposes a solution that combines multiple teaching methods in the teaching process to stimulate students' interest in learning and make The teaching effect is better， which can provide references for the teaching reform of HTML5 programming technology courses under the new situation.

Key words： teaching effect; teaching reform;HTML5 programming technology

1引言

隨著互聯網行業的持續發展，移動互聯網等新業務不斷發展壯大，海量的平臺開發工作形成了巨大的人才缺口，尤其是Web前端、移動端HTML5開發人才更為緊缺。隨著互聯網業內競爭的不斷加劇，企業平臺開始在界面友好性和操作方便性方面投入更多的精力，只有平臺更加人性化，才能吸引更多的用戶[1]。從現有技術體系來看，HTML5是Web前端開發的關鍵技術[2]，它具有進化而非顛覆、化繁為簡、良好的用戶體驗等新特性，它的使用可以滿足各個平臺上技術的支持，也可以保障幾乎所有的主流瀏覽器都可以訪問?！禜TML5編程技術》是我院計算機應用技術專業中前端開發方向的核心課程之一，該課程主要講解HTML5的新特性、HTML5的基本語法、CSS3的新特性、CSS選擇器、文本類網頁設計、圖文展示網頁設計、表單、畫布、音頻與視頻、響應式Web設計、Bootstrap等知識點，通過該門課程的教學，旨在培養學生使用HTML5+CSS3開發出絢麗的網站的能力。

2 課程教學現狀分析

《HTML5編程技術》課程是我院計算機應用技術專業一直開設的課程，根據學生上課的平時表現以及對學生的考試結果進行分析，得出該課程存在以下幾個方面的不足：1）學生綜合運用所學知識解決實際問題的能力還欠缺，過于依賴教師講解，需要進一步培養其獨立思考的能力以及綜合運用知識的能力;2）教學方法和手段亟待創新。雖然采用了項目式教學法，但教學過程中的實踐內容設計還不夠完善，學生動手能力有限，對教學質量有一定影響;3）學生水平參差不齊，對于知識點的接受能力有所不同，少部分同學的學習積極性不高，學習氛圍不夠濃厚。

3 多種教學方法相結合在教學中的應用

針對教學過程中存在的問題，本文提出采用任務驅動法+案例教學法+討論法相結合的教學方法。任務驅動教學法是學生在教師的指導下，以一個共同既定任務為中心，自主解決問題，利用已知的和可得到的資源，完成教師布置的任務[3]。案例教學法指將案例作為教學材料，結合教學主題，通過討論、問答等師生互動環節讓學習者了解與教學主題相關的概念或理論，并培養學生高層次能力的教學方法[4]。討論式教學方法是針對解決問題，而逐漸發展起來的一種教學技巧，這種方法是通過學生以分組討論，或者共同討論的形式，解決問題的一種方法[5]。

本文以《HTML5編程技術》課程中的“黑馬書城”網站設計為例說明任務驅動法+案例教學法+討論法相結合的教學方法在實際教學中的應用。該教學方法主要分為以下幾個階段：利用信息化教學手段引導學生思考問題，引出主題、采用案例教學法講解知識點、分組討論完成項目分析、項目實現、總結與評價、課后布置任務，鞏固練習。

1）利用信息化教學手段引導學生思考問題，引出主題

在講解知識點之前，教師通過信息化教學手段，使用超星學習通等平臺發布與本堂課所講網頁設計知識點相關的討論，發布討論后，教師以一定的加分機制鼓勵學生積極參與討論，待學生提交答案后，抽取學生提交的答案進行點評，針對精彩的留言，教師給予額外的加分，該過程可以充分調動學生的學習積極性，激發學生的學習熱情。然后，教師根據項目描述來展示該項目要實現的效果，讓學生對需要完成的任務有一個直觀的感性認識，接著引出完成該項目所需要的知識點。

2）采用案例教學法講解知識點

教師講解“黑馬書城”網站設計所涉及的知識點：常用圖像標簽、CSS背景設置、CSS陰影和漸變，并通過小案例對每個知識點進行舉例，通過舉例讓學生直觀地了解到知識點的具體應用場景以及所產生的效果，讓學生自己能從案例中總結出本質規律、并歸納出解決問題的方法，以培養其解決實際問題的能力。

3）分組討論完成項目分析

將班級成員根據水平將不同層次的學生搭配組成小組，由學習成績較好的同學擔任小組的組長，每個小組完成相同的任務，該任務由各小組成員相互協作完成。打開黑馬書城網頁，安排每組學生在規定的時間內對該網頁的頁面結構、所使用的標簽和CSS樣式進行分析，由小組組長記錄討論結果。討論結束后，由每個小組派出代表說明項目分析活動的結果，各小組之間進行互相點評，最終，由老師給出評價。小組討論使得每個學生都參與其中，組員之間互幫互助，共同進步，可以培養學生的溝通能力、表達能力、團隊合作精神，激發學生的學習興趣，提高學生解決問題的能力。此外，小組與小組之間由于存在競爭的關系，因此可以更好地提高學生的學習積極性。

4）項目實現

實踐是教學過程中最重要的一個環節，只有通過實踐才能檢驗學生對知識點的掌握情況。根據對“黑馬書城”網站的分析，要求學生在規定的時間內獨自完成網站設計任務。在學生完成任務的過程中，教師走到學生中去為學生解答疑惑。在解決問題的過程中，教師應該避免直接告訴學生解決問題的答案，而應該引導學生思考出錯的原因以及解決問題的思路。通過獨立完成任務，培養學生解決問題和綜合運用知識的能力。

5）總結與評價

學生完成任務后，教師要及時地對學生完成任務的情況進行總結和評價。歸納和總結學生在完成任務過程中值得借鑒或需要改進的地方，引導學生進行反思。針對學生在編寫代碼完成網頁設計的過程中遇到的問題進行分組討論，分析問題出現的原因，避免學生在以后的實踐過程中犯同樣的錯誤。與此同時，教師對學生在完成網頁過程中的代碼編寫、網頁效果等方面進行綜合評價，讓學生對自己還需要改進的地方有所了解。任務中可以進一步完善的地方可以作為任務的拓展與提高，讓學生課后進一步尋求解決方法。

6）課后布置任務，鞏固練習

知識的學習不能只停留在課堂上，課后的鞏固也是至關重要的。《HTML5編程技術》課程是一門實踐性強的課程，只有通過不斷的練習，學生對知識點的運用才能熟能生巧，學生的動手能力才能得以提升。因此，針對能力水平層次不同的學生，教師應該布置難易程度不同的課后作業，讓不同能力水平的學生在完成課后作業的過程中獲得成就感和滿足感。

4? 結束語

針對《HTML5編程技術》課程在實際教學過程中存在的問題，本文進行了改革探索，提出了任務驅動法+案例教學法+討論法相結合的教學方法。通過以“黑馬書城”網站設計的教學過程為例可以得知，任務驅動法、案例教學法、討論法貫穿整個教學的始終，體現了“做中學，學練結合，以練促學”的教改思路。通過該教學方法，可以突出學生的主體地位，培養學生主動參與的意識，激發學生的求知欲，培養學生的團隊合作意識;通過布置難易程度不同的課后作業，可以培養學生獨立思考問題和解決問題的能力，學生通過完成作業可以獲得成就感和滿足感，繼而更加激發他們的學習熱情。本文提出的多種教學方法相結合的教學方法相信可以給我院的HTML5課程改革提供一定的指導意義。

參考文獻：

[1] 黑馬程序員.響應式web開發項目教程（HTML5+CSS3+Bootstrap）[M].北京：人民郵電出版社，2019.

[2] 焦新偉.HTML5在WEB前端開發中的應用研究[J].網絡安全技術與應用，2020（4）：73-75.

[3] 宋積滿.任務驅動教學法在計算機應用基礎教學中的應用[J].信息與電腦（理論版），2019，31（21）：250-251，254.

[4] 史小平.以案例教學法為核心的高職學生自主學習能力培養途徑探析[J].湖南工業職業技術學院學報，2017，17（4）：115-118.

[5] 趙宏池.討論式教學法在思想政治課程標準與教材分析中的運用[J].科學咨詢，2020（33）：123.

【通聯編輯：李雅琪】