高校HTML課程教學的現狀與對策

何家莉 等

李春麗? 黃妹彩? 譚文杰

[摘 要]HTML是一種用于創建Web頁面的標記語言，是Web應用程序開發中必不可少的一部分，屬于前端開發技術的學科范疇。HTML已成為高校大多數計算機科學專業的必修課程和其他相關專業的必修或選修課程，且在眾多教育行業中深受喜愛?，F階段，Web開發行業對人才質量的需求也越來越高，僅學習HTML基礎知識和技能可能無法滿足迅速發展的Web開發行業的需求。因此，在HTML課程教育中，教育者不僅要讓學生掌握HTML基礎知識與技能并能靈活運用，也要在教學中適當引入思政元素。文章將簡述HTML教育的現狀，并提出了有關高校HTML教學方法的對策。

[關鍵詞]高校；HTML教學；對策

在互聯網高速發展的今天，掌握一門計算機語言尤其重要。高校HTML課程安排在其他機器語言、匯編語言、高級語言之前，考慮到HTML在網站前端開發過程中起到支撐的作用，非常適合剛剛步入網頁設計的新手進行學習。在學習理論知識的同時，可以結合實踐學習，培養實際操作能力，這樣做有助于學生在HTML和網頁設計方面建立堅實的基礎。

一、高校HTML課程的性質和定位

HTML是一種超文本標記語言，其命令可用來解釋圖形、文字、聲音等，它包含許多標簽，通過這些標簽將互聯網實現從分散到統一[1]。高校HTML課程作為計算機科學、軟件工程、信息管理等專業核心課程之一，屬于前端開發技術的學科范疇，旨在培養學生對HTML技術的理論知識和應用能力。HTML作為網頁制作的基礎，是Web前端開發的核心技術之一，通過學習HTML課程，能夠幫助學生掌握Web前端開發所需的基本技術和知識?，F如今，大部分的網頁都是以HTML為基礎來進行開發的，只有在學習各種動態網頁技術之前掌握好HTML語法，才能算是完成基本的入門。高校HTML課程讓學生理解HTML與CSS、JavaScript等前端技術的關系，了解網頁制作基本原理和方法，注重實踐，鼓勵學生在實踐中掌握技能，并通過課程設計、實驗等方式加深對HTML的理解和應用。

高校HTML教學要始終貫徹“任務驅動、工學結合、項目開發”，堅持“實用、夠用、必需”的原則，促使學生實踐動手能力、項目開發與設計能力都實現提升。HTML課程既具有極強的實踐操作性，又包括多項可視化成果，學生學習興趣非常濃厚。

二、高校HTML課程教學現狀

（一）課程結構安排合理性不足

在傳統教學模式下，教師采取理論教學與實踐教學相結合方法，課時比例設置為1：1，教師在講解HTML理論知識的過程中，雖然會讓學生進行思考，分析例題與案例，來提高自身分析問題的能力，但是這樣的教學方式會讓部分學生感覺枯燥，加之課程本身具有抽象的性質，使課程沒有變得易于理解和引起大部分學生的興趣。而在實踐教學環節，主要是教師提供指導，讓學生在固定時間內完成教材中的實訓項目，學生缺乏主動性和自覺性。同時，學生的實踐內容僅來源于課后習題和教材實訓項目，實踐內容受到局限，學生的創造能力得不到發展、思維得不到延伸。最終導致學生的學習效率差，對知識的理解也不夠全面和透徹。

（二）教學方法缺乏思政元素

在HTML課堂教學中，教育者僅是教會學生知識技能和教會學生如何在考試時得到高分，忽略培養學生的人格、情感和價值觀。出現這種現象的根本原因是教育者對思政教學的理解不夠深入，甚至有些教育者在教育教學過程中忽略思政教學。教學中缺乏思政教育不僅會導致教育教學目標失衡，造成學生在學習知識技能的同時缺乏健康的人格和堅定的價值觀，而且會使學生的思維受到局限，造成學生無法拓寬視野，缺乏判斷力和分析力。如果教學方法缺乏思政元素，那么教師無法及時指導學生，將使學生的人格發展受到影響，進而導致一系列的心理健康問題。

（三）實踐操作性不強

社會崗位對于HTML網頁前端開發人才的要求較高，但是在高校的培養方案中，學生涉及的專業課程較多，導致無法很好地兼顧每門學科。而HTML課程涉及的內容較多，學生也無法深入研究，出現“學而不精”的現象。其次，受到傳統教學方法的影響，學生缺乏與現實社會問題相結合的案例設計和分析，導致學生在崗工作時難以掌握網頁開發的工作流程和方法。缺少實踐操作，技術和能力得不到有效提高，與社會崗位需求人才存在差距。

（四）學生自主學習能力有待加強

對于大部分的課程，學生都存在缺乏學習主動性的問題。一方面，受限于一般的學校教育模式和家庭教育環境，學生普遍處于任務式學習狀態，過于依賴老師的督促和管理，使得自主學習能力與意識得不到有效發展；另一方面，由于思維慣性、缺乏觀察、思考和理解能力，學生難以主動展開學習。學習目標不明確，缺乏動力；學習方法不當，學習效率低，達不到預期的效果，心理落差大，致使缺乏自信心，而不愿主動學習。許多學生缺乏自主實踐的能力，學生僅學習HTML的理論知識，不能對所學知識去嘗試應用和實踐，往往很難去獨立完成項目，導致成就感不足而缺少學習動力，降低了對HTML課程的學習興趣。

三、高校HTML課程教學的對策

（一）合理導入課程，激發學習興趣

HTML課程涉及內容較多，很多知識點比較復雜與抽象，學生若是缺少有效指導，將增加理解難度，實際學習效率低。教師要想學生跟上自己的講課進度，就應該保證教學內容更加有趣與新穎，能夠有效吸引學生的注意力，最大限度地激發學生的學習興趣。因此，教師可以在課程導入環節中精心設計，為學生帶來全新的體驗，保證學生在最短時間內進入學習狀態。這樣才能激發學生產生濃厚學習興趣，提高HTML的教學效果。

例如，制作“脫貧攻堅戰”網頁。在脫貧攻堅戰的決勝階段，指導學生利用HTML制作脫貧攻堅戰的網頁，此項目的主要功能是為了實現在網頁上顯示脫貧攻堅戰的具體信息，其目的是使得學生在利用HTML制作網頁的同時也可以了解國家脫貧攻堅戰的具體情況。在導入新課時，教師要利用多種方式介紹HTML制作網頁的方法，引起學生的關注，為制作網頁打牢基礎。

（二）借助動畫視頻，演示操作過程

在HTML課程中，若是將知識點以動畫視頻等方式呈現出來，將對學生有更強的吸引力，為之后教學活動的高效開展奠定基礎。在教學過程中，教師先對核心理念進行講解，然后通過展示動畫視頻，將具體操作過程呈現出來，讓學生可以輕松地理解其中的知識點，也能在教師的帶領下正確地完成相關操作。最后讓學生自主談論，將講授時間與討論時間錯開，學生課后也能根據需求對學習做出合理安排。對重難點內容要重點突出，并給出經典案例的操作方法以及講解，便于學生理解。這樣信息技術知識將在學生腦海中留下深刻印象，不僅提高了教學效率，也促進了學生思想政治素養的發展。

例如，制作“緬懷革命先烈”網頁。此網頁的主要功能包括注冊緬懷網站賬號，鼠標單擊一鍵緬懷先烈，寄存對革命先烈想說的話（保存至服務器）。通過動態網頁的建設來讓學生牢記革命精神，受到良好的思想教育。教師可以將操作過程進行演示，讓學生熟悉具體的流程，動手完成任務，并用革命精神感染學生，為學生帶來前進動力。

（三）利用多種軟件，注重課程開發

在互聯網時代，教師應該具備有效篩選網絡上海量資源的能力，并合理利用使之成為教學材料。例如，可以整合文字、圖片和音頻等資源，形成授課內容，在課堂上為學生集中展示，既拓寬了學生的眼界，也能幫助學生積累豐富的信息技術知識；同時，對于網絡上的海量資源，教師可以提供給學生形成自己的素材庫，實現多方式獲取知識的能力。教師也可以利用office系列辦公軟件、繪聲繪影、Photoshop、錄屏工具等處理收集資源，這樣不僅教師的信息化教學手段能得到提升，還能保證HTML課堂的順利實施，保證教學目標順利實現[2]。此外，在先進軟件支持下，HTML課程資源將更加豐富，在課堂上為案例教學法的應用奠定了良好條件，確保學生在掌握知識點的過程中，也能將掌握的知識用于解決實際案例中，實現處理問題能力提升。通過案例教學過程，讓HTML教學活動更加精彩有趣，有效吸引了學生的注意力，尤其讓學生將所學知識融會貫通，真正達到學以致用的目標。

例如，制作“弘揚中華民族傳統美德”網頁。此網頁的主要功能包括：顯示中華民族傳統美德詳細內容的主界面，以及上傳自己認為具有傳統美德內容的功能，并且實現評論留言等功能。在課堂上教師要適時引出更多的內容，幫助學生拓寬學習的方法，讓學生能夠在教師的帶領下獨立完成操作任務。此外，該項目的實踐過程可以讓學生更好地了解中華民族傳統美德，做到通過HTML學習了解中華民族傳統美德。

（四）注重實驗教學，培養實踐能力

對大學生來說自主學習非常關鍵。首先，學生的自主學習可以讓學生在課堂中更容易去理解老師所傳授的知識，使學習效果事半功倍。其次，學生在HTML課程中自主學習，而不是被動接受知識的機器，可以提高學生采取科學方法主動學習知識并解決問題的能力。在高校HTML課程中實驗內容教學也是重要組成部分，為學生自我發揮提供了平臺，讓學生能夠自主分析問題并解決問題，逐步提高自主學習能力，激發學生動手的欲望，提高實踐能力是教師在教學中的一項重要任務。最后，要避免讓學生將教材中的例題或理論課上所講的例子依葫蘆畫瓢完成任務，雖然實驗完成了，但無法達到有效教學目的；而是應該給學生一些具有擴充性的題目，讓學生可以自主思考，提高其自主學習的能力[3]。教師要將學生合理分組，課堂采用討論與搶答環節激發學生課堂思考能力，在這樣的競爭中學習，確保學生保持積極學習狀態，獲得良好的學習效果。

例如，制作“美麗鄉村”網站時，教師要規定其為課外任務，要求學生獨立完成資料搜集整理和網頁編寫工作，并在課堂上進行展示和講解。在課堂案例實施過程中，學生能夠發現家鄉之美，感受家鄉不俗的魅力，并激起對家鄉的熱愛之情。而在“時政”網站特效制作過程中，教師要輔助學生鞏固專業技能。學生要自主學習網站特效制作的視頻，內容載體是時政新聞。通過視頻學習，讓學生對時事政治更加關心。在復雜的國際環境下，學生將逐步樹立正確的認識觀，懂得自己前途和命運與祖國連在一起，熱愛祖國應體現在具體行動中，努力學好專業知識。

（五）擺脫思維定式，提高創新能力

創新是一個國家興旺發達的動力，也是我們保持動力和活力的源泉。擁有創新意識是高校大學生必不可少的，同時也是社會崗位對人才的基本要求。在當今信息技術飛速發展的社會，很多東西都在不斷地更新迭代。教師要時刻關注社會的需求，也要將目光放長遠，不要局限于現在，要對未來的發展趨勢進行適當的預測，做好相應的教學應對措施。其次教師對HTML課程的實踐部分可進一步改進，采取項目式教學，不僅要求學生學會模仿案例，還要學會在此基礎上進行自主思考，發揮自己的創造能力，擺脫思維限制。同時學?？杉訌娕c企業之間的合作，讓學生能夠更直接地接觸真實的網頁制作過程與方法，也能讓學生了解社會的需求，提前讓學生與現實接軌，加強國際交流，放眼至整個世界，開闊了學生的眼界，激發了學生創新思維。

例如，在制作“最美教師”網站時，教師規定此任務為團隊合作項目，在HTML課堂教學中對學生進行分組，讓學生在課后協作完成網站制作。學生團隊進行合理分工與溝通，確立方向后上網搜集并分類篩選最美教師資料，借助HTML技術完成網頁設計，如版面設計和頁面功能體現等，最后在課堂上展示成果并由組內代表在課堂上講解網站功能。在團隊合作項目過程中，學生可以鍛煉合作能力，適應工作流程，加入創造性理解，加強獨立思考和自主創新意識，能夠發現教師之美，感受教師這個神圣職業的光輝魅力，激發學生對教師產生敬佩之心。

結束語

綜上所述，在HTML教學中，我們不僅要注重理論知識的學習，更要注重實踐操作。通過不同主題的HTML項目實踐，學生可以更好地掌握HTML技能，了解如何運用HTML語言來實現網站的各種功能，培養創造、創新思維。HTML項目實踐還可以了解社會、文化等方面的知識，讓學生在實踐的過程中發揮自己的才能，并在實踐中進行自我思考與探索，更好地提高自己的綜合素質，擺脫思維模式教育，成為全面發展的人才，為未來的發展做好準備。

參考文獻

[1]李高峰.探討HTML5前端開發課程教學改革方法[J].科技風.2020（2）：63.

[2]張鵬松.HTML5在移動學習中的應用研究[J].衛星電視與寬帶多媒體.2019（19）：22-23.

[3]明素華.數字化教學資源共享研究：以《HTML網頁設計》課程為例[J].通訊世界.2019（9）：367-368.

作者簡介：何家莉（1981— ），男，壯族，廣西桂林人，玉林師范學院數學與統計學院，副教授。

研究方向：粗糙集及軟計算。

李春麗（2001— ），女，漢族，廣西河池人，玉林師范學院數學與統計學院，本科在讀。

黃妹彩（2000— ），女，壯族，廣西百色人，玉林師范學院數學與統計學院，本科在讀。

譚文杰（2003— ），男，漢族，湖南株洲人，玉林師范學院數學與統計學院，本科在讀。

基金項目：本文系廣西高等教育本科教學改革工程項目（編號：2023JGA288）；大學生創新訓練項目（編號：S202210606095）。