摘要：文章探討了如何利用知識圖譜改進網(wǎng)頁設(shè)計與制作課程的教學(xué)，從重構(gòu)教學(xué)內(nèi)容、創(chuàng)新教學(xué)方法、融入課程思政以及優(yōu)化考核評價等方面提出了具體的改革方案。

關(guān)鍵詞：知識圖譜；網(wǎng)頁設(shè)計與制作；教學(xué)改革

中圖分類號：TP393

文獻標識碼：A

文章編號：1009-3044（2025）14-0148-04

0引言

習近平總書記在中共中央政治局第五次集體學(xué)習時強調(diào)：“教育數(shù)字化是我國開辟教育發(fā)展新賽道和塑造教育發(fā)展新優(yōu)勢的重要突破口”[1]。這一論斷深刻揭示了教育數(shù)字化轉(zhuǎn)型對于我國教育事業(yè)發(fā)展的重要性。網(wǎng)頁設(shè)計與制作課程作為數(shù)字時代創(chuàng)新教育的重要組成部分，其教學(xué)質(zhì)量和效果對培養(yǎng)具有創(chuàng)新能力和實踐能力的Web前端工程師至關(guān)重要。

然而，網(wǎng)頁設(shè)計與制作課程教學(xué)現(xiàn)狀卻面臨一系列挑戰(zhàn)，如內(nèi)容體系單一、知識面廣泛但難以深入、教學(xué)方法落后等問題。在此背景下，構(gòu)建網(wǎng)頁設(shè)計與制作課程的知識圖譜具有至關(guān)重要的意義。知識圖譜作為一種強大的知識組織和表示工具，能夠?qū)⒄n程中的知識點進行系統(tǒng)整合和關(guān)聯(lián)，形成一個清晰、全面的知識框架。通過知識圖譜，學(xué)生可以更加直觀地理解各個知識點之間的聯(lián)系和邏輯關(guān)系，從而更好地掌握和應(yīng)用所學(xué)知識。同時，知識圖譜還能夠為學(xué)生提供個性化的學(xué)習資源和路徑推薦，適應(yīng)數(shù)字化發(fā)展新要求，促進個性化與終身學(xué)習。

1網(wǎng)頁設(shè)計與制作課程現(xiàn)狀分析

1.1課程分析

網(wǎng)頁設(shè)計與制作課程是面向高等職業(yè)教育信息網(wǎng)絡(luò)技術(shù)專業(yè)的主干課程，同時也是任職崗位課程和必修考試課程，旨在培養(yǎng)學(xué)生具備Web前端開發(fā)工程師的能力和素質(zhì)，要求學(xué)生掌握圖像處理的基本操作，能夠制作靜態(tài)網(wǎng)頁、搭建并管理動態(tài)網(wǎng)站。課程由兩部分構(gòu)成：第一部分為網(wǎng)頁設(shè)計，主要內(nèi)容包括網(wǎng)頁布局設(shè)計與網(wǎng)頁圖像處理，于第一學(xué)年下學(xué)期開設(shè)；第二部分為網(wǎng)頁制作，重點涵蓋HTML5、CSS3、Ja?vaScript等核心技術(shù)，安排在第二學(xué)年上學(xué)期進行。課程采取理論講解與實操訓(xùn)練相結(jié)合的方式，使學(xué)生既能牢固掌握基礎(chǔ)知識，完成網(wǎng)頁布局，又能自行設(shè)計和美化，創(chuàng)造出有價值的網(wǎng)站。

1.2學(xué)情分析

通過課前座談與問卷調(diào)查分析，發(fā)現(xiàn)學(xué)生群體以00意識和較高的配合度后為主，呈現(xiàn)以下特征，且許多學(xué)生在入學(xué)前已接觸過：學(xué)生普遍具有較強的服從編程、網(wǎng)頁設(shè)計等相關(guān)知識，計算機基礎(chǔ)及實踐操作能力突出；但理論學(xué)習興趣相對薄弱，缺乏系統(tǒng)化思維和綜合分析能力，解決復(fù)雜問題的能力有待提升。對于目標明確、有志于從事數(shù)字媒體、網(wǎng)站前端開發(fā)及全棧開發(fā)等相關(guān)領(lǐng)域的學(xué)生，普遍具有明確的學(xué)習目標和較高的學(xué)習積極性。他們能夠主動學(xué)習新知識，積極參與實踐項目，表現(xiàn)出較強的自我驅(qū)動能力。但也有部分學(xué)生因?qū)φn程難度感到畏懼或?qū)ξ磥砺殬I(yè)發(fā)展方向不明確，表現(xiàn)出學(xué)習興趣不足的現(xiàn)象。

1.3存在問題

本課程采用以實踐操作為主導(dǎo)、理論教學(xué)為輔助的教學(xué)模式。然而，在教學(xué)實踐過程中，存在以下突出問題。

1）根據(jù)課程考核數(shù)據(jù)顯示理論知識點分布零散且抽象，學(xué)生理論部分的平均，學(xué)生理解與記憶得分率僅為72.3%，顯著低于實操部分的85.7%。理論知識點缺乏系統(tǒng)性，且部分內(nèi)容過于抽象，導(dǎo)致學(xué)生在理解和記憶上存在較大障礙。例如，在講解CSS盒模型時，學(xué)生普遍反映難以將其抽象概念與實際布局設(shè)計相結(jié)合。

2）實踐操作步驟繁雜，知識連貫性與長期記憶效果不足：盡管實踐操作在短期內(nèi)能夠顯著提升學(xué)生的學(xué)習效果（課堂實操任務(wù)完成率達90%以上），但由于操作步驟繁雜且前后銜接不夠緊密，學(xué)生在后續(xù)課程中的知識遷移能力較弱。以綜合應(yīng)用為例，學(xué)生在獨立完成項目時往往難以將分散的知識點有效整合，導(dǎo)致項目完成質(zhì)量參差不齊。

3）課程間孤立性強，學(xué)生綜合運用能力薄弱：根據(jù)學(xué)生反饋及期末項目評估結(jié)果，超過70%的學(xué)生表示難以將網(wǎng)頁設(shè)計、網(wǎng)頁制作與其他相關(guān)課程（如數(shù)據(jù)庫基礎(chǔ)、程序設(shè)計）的知識融會貫通。例如，在開發(fā)一個完整網(wǎng)站時，學(xué)生普遍缺乏對前后端協(xié)作、數(shù)據(jù)交互等綜合性問題的系統(tǒng)性思考，導(dǎo)致項目整體邏輯性與功能性不足。

綜上所述，當前教學(xué)模式雖在短期內(nèi)能夠提升學(xué)生的實操能力，但在理論知識的系統(tǒng)性、實踐操作的連貫性以及跨課程知識的綜合運用方面仍存在顯著不足，亟須通過優(yōu)化課程結(jié)構(gòu)、加強知識點銜接以及引入綜合性實踐項目等方式加以改進。

2知識圖譜的主要特征和實踐意義

2.1知識圖譜的基本含義

知識圖譜（KnowledgeGraph）是一種結(jié)構(gòu)化的語義知識表示方式，旨在以圖的結(jié)構(gòu)形式描述現(xiàn)實世界中的實體、概念及其相互關(guān)系[2]。它通過節(jié)點（實體或概念）和邊（關(guān)系）構(gòu)成的網(wǎng)狀結(jié)構(gòu)，將分散的知識整合為一個有機整體，形成結(jié)構(gòu)化的語義知識庫，支持知識的存儲、查詢、推理和可視化。知識圖譜是教育數(shù)字化、智能化轉(zhuǎn)型的基礎(chǔ)性和前提性工作[3]。

2.2知識圖譜的主要特征

1）系統(tǒng)性。知識圖譜以結(jié)構(gòu)化方式組織和表示知識，形成邏輯嚴密、層次分明的知識體系。通過實體（節(jié)點）與關(guān)系（邊）之間的相互連接，構(gòu)建網(wǎng)狀且層次化的知識體系，不僅能在同一領(lǐng)域內(nèi)建立知識關(guān)聯(lián)，還可跨領(lǐng)域?qū)崿F(xiàn)聯(lián)系，形成綜合性的知識網(wǎng)絡(luò)。

2）適用性。知識圖譜能根據(jù)不同應(yīng)用場景和需。首先，知識圖譜可應(yīng)用于多個領(lǐng)域；其次，依據(jù)使用者需求和偏好，提供個性化知識服務(wù)；在教育領(lǐng)域，知識圖譜可根據(jù)學(xué)生的學(xué)習歷史和興趣，推薦適合的學(xué)習資源和路徑；再者，知識圖譜支持高效語義查詢，能夠快速檢索和提取知識，學(xué)生可通過知識圖譜快速查詢特定知識點的相關(guān)信息，并匹配相應(yīng)的學(xué)習資源。

3）融合性。。知識圖譜能整合多源異構(gòu)數(shù)據(jù)它可整合來自不同來源的數(shù)據(jù)，形成，如結(jié)構(gòu)化數(shù)據(jù)（數(shù)據(jù)庫）、半結(jié)構(gòu)化數(shù)據(jù)（XML、JSON）和非結(jié)構(gòu)化數(shù)據(jù)（文本、圖像）[4]。在構(gòu)建過程中，可將多個知識圖譜有機融合，建立起所有課程之間的整體聯(lián)系，實現(xiàn)廣度與深度上的交叉融合，提升知識遷移能力。

4）可視化。知識圖譜不僅通過圖形化方式直觀，便于理解和分析，還能借助可視化工具進行交互式探索。通過點擊、拖拽等操作，動態(tài)查看和探索知識圖譜中的不同部分，并可根據(jù)需要查看不同層次的知識細節(jié)。

2.3知識圖譜在網(wǎng)頁設(shè)計與制作課程中的應(yīng)用價值

作為一種高效的知識組織與展示工具，知識圖譜在網(wǎng)頁設(shè)計與制作課程改進中展現(xiàn)出顯著可行性。首先，知識圖譜能有效解決知識點碎片化問題，通過系統(tǒng)化整理與可視化呈現(xiàn)課程內(nèi)容中的知識點與概念，極大提升學(xué)生學(xué)習效率和深度理解。其次，知識圖譜助力構(gòu)建清晰的課程體系，展示課程間邏輯關(guān)系與跨學(xué)科聯(lián)系，為學(xué)生規(guī)劃個性化學(xué)習路徑提供有力支持。在教學(xué)資源整合方面，知識圖譜能夠統(tǒng)一整合多源教學(xué)資源，促進跨平臺資源共享，同時為教學(xué)質(zhì)量監(jiān)控與持續(xù)改進提供堅實保障。綜上所述，將知識圖譜技術(shù)應(yīng)用于網(wǎng)頁設(shè)計與制作課程的改進，不僅顯著提升教學(xué)效果，還推動教學(xué)資源的優(yōu)化配置和教學(xué)模式的創(chuàng)新發(fā)展。

3基于知識圖譜的課程教學(xué)改革路徑

課程是基于教育學(xué)邏輯構(gòu)建的知識體系，而知識圖譜則從知識邏輯、學(xué)習邏輯和認知邏輯三個維度出發(fā)，深入探尋各知識點之間的內(nèi)在關(guān)聯(lián)，提煉出關(guān)鍵構(gòu)成要素。網(wǎng)頁設(shè)計與制作課程的教學(xué)改革路徑，依照“目標—內(nèi)容—活動—評價”體系[5]，從重構(gòu)教學(xué)內(nèi)容、創(chuàng)新教學(xué)方法、融入課程思政和優(yōu)化考核評價四個方面展開，旨在通過知識圖譜的應(yīng)用提高課程教學(xué)質(zhì)量和效果，培養(yǎng)適應(yīng)數(shù)字時代需求的創(chuàng)新型人才。以下為具體的改革路徑：

3.1重構(gòu)教學(xué)內(nèi)容

教學(xué)內(nèi)容改革是課程教學(xué)改革的基礎(chǔ)。下面將從構(gòu)建知識圖譜驅(qū)動的課程體系、設(shè)計模塊化教學(xué)內(nèi)容和實施個性化學(xué)習路徑三個方面，構(gòu)建網(wǎng)頁設(shè)計與制作課程的教學(xué)圖譜結(jié)構(gòu)。

3.1.1構(gòu)建知識圖譜驅(qū)動的課程體系

傳統(tǒng)的網(wǎng)頁設(shè)計與制作課程內(nèi)容往往分散且孤立，學(xué)生難以形成系統(tǒng)化的知識結(jié)構(gòu)?；谥R圖譜技術(shù)，可以將課程中的知識點、技能點和案例進行深度關(guān)聯(lián)，構(gòu)建一個層次分明、邏輯清晰的知識網(wǎng)絡(luò)。

首先，梳理網(wǎng)頁設(shè)計與制作領(lǐng)域的核心知識點，包括HTML5、CSS3、JavaScript等基礎(chǔ)語言知識，網(wǎng)頁布局、色彩搭配等設(shè)計知識，以及網(wǎng)站發(fā)布維護等內(nèi)容。鑒于知識點之間存在前驅(qū)與后繼的邏輯關(guān)聯(lián)，利用知識圖譜技術(shù)建立知識點之間的關(guān)聯(lián)關(guān)系，依據(jù)章、節(jié)、知識點的層級架構(gòu)，對課程相關(guān)知識點進行分層、分類，明確每個知識點在課程中的重要性及學(xué)習順序，進行有序排列和深度鏈接，強化知識點間的內(nèi)在邏輯關(guān)系及關(guān)聯(lián)性，形成完整的知識網(wǎng)絡(luò)。

其次，通過知識圖譜的可視化工具，將復(fù)雜的知識體系以圖形化方式呈現(xiàn)給學(xué)生。學(xué)生可以直觀地看到知識點之間的關(guān)系，理解知識的結(jié)構(gòu)和層次，更好地掌握課程內(nèi)容。

最后，為確保課程內(nèi)容的前沿性和實用性，知識圖譜可以根據(jù)學(xué)科發(fā)展和行業(yè)需求動態(tài)更新，及時納入新的技術(shù)和工具，如前端框架（Vue.js、React）、CSS預(yù)處理器（Sass、Less）等。

在此基礎(chǔ)上，還可以設(shè)計跨課程教學(xué)模塊，實現(xiàn)專業(yè)與職業(yè)崗位的匹配。以信息網(wǎng)絡(luò)技術(shù)專業(yè)對應(yīng)的全棧工程師崗位為例，該崗位需掌握后端開發(fā)、數(shù)據(jù)存儲、網(wǎng)絡(luò)安全等知識，是多門專業(yè)課交叉融合的成果。以制作一個完整的網(wǎng)站為項目總目標，理清從設(shè)計網(wǎng)頁布局到開發(fā)前端頁面、從構(gòu)建后端邏輯到實現(xiàn)數(shù)據(jù)庫集成、從搭建服務(wù)器到配置環(huán)境、從進行安全防護到部署上線及優(yōu)化性能的關(guān)鍵知識節(jié)點，建立課程間的強鏈接關(guān)系，構(gòu)建崗位—專業(yè)的知識圖譜。

3.1.2設(shè)計模塊化教學(xué)內(nèi)容

模塊化教學(xué)是提高教學(xué)靈活性和適應(yīng)性的有效方法?；谥R圖譜的模塊化設(shè)計可將課程內(nèi)容劃分為多個相對獨立但又相互關(guān)聯(lián)的模塊，便于學(xué)生根據(jù)自身需求選擇學(xué)習路徑。

基礎(chǔ)模塊：主要涵蓋網(wǎng)頁設(shè)計與制作的基本概念和技能，如HTML標簽、CSS樣式、JavaScript基礎(chǔ)語法等。這些內(nèi)容是學(xué)習后續(xù)模塊的基礎(chǔ)，適合初學(xué)者或基礎(chǔ)較弱的學(xué)生。

核心模塊：聚焦網(wǎng)頁設(shè)計與制作的關(guān)鍵技術(shù)和應(yīng)用，如響應(yīng)式設(shè)計、前端框架、交互設(shè)計等。這些內(nèi)容是課程重點，適合大多數(shù)學(xué)生深入學(xué)習。

拓展模塊：包括前沿技術(shù)和個性化發(fā)展方向，如Web動畫、Web性能優(yōu)化、前端工程化等。適合學(xué)有余力或?qū)μ囟I(lǐng)域感興趣的學(xué)生進一步探索。

模塊間關(guān)聯(lián)：通過知識圖譜技術(shù)，明確各模塊之間的關(guān)聯(lián)關(guān)系。例如，學(xué)生學(xué)習核心模塊中的“交互設(shè)計”時，可回溯基礎(chǔ)模塊中的“CSS盒模型”進行復(fù)習，或提前了解拓展模塊中的“Web性能優(yōu)化”相關(guān)內(nèi)容。

3.1.3實施個性化學(xué)習路徑

學(xué)習本質(zhì)是知識遷移過程，即將未知信息理解、消化，再以個人特有方式吸收和存儲，以便需要時迅速調(diào)用。此過程與知識圖譜原理高度契合，可將知識圖譜與學(xué)生畫像結(jié)合，制定個性化學(xué)習方案。

通過分析學(xué)生學(xué)習數(shù)據(jù)（如學(xué)習進度、測試成績、興趣偏好等），評估其知識掌握情況，構(gòu)建詳盡的學(xué)生學(xué)習畫像，并提取關(guān)鍵學(xué)習特征。結(jié)合知識圖譜與AI習路線推薦算法，精準推薦相應(yīng)學(xué)習資源，有機融合學(xué)生特征[6]，，智能定制個性化學(xué)提高學(xué)習效率和效果。例如，當學(xué)生通過測試發(fā)現(xiàn)基礎(chǔ)模塊掌握較好時，可直接進入核心模塊學(xué)習；在某知識點表現(xiàn)不佳時，推薦相關(guān)復(fù)習材料或補充練習。

學(xué)習路徑并非固定不變，根據(jù)學(xué)生學(xué)習表現(xiàn)動態(tài)調(diào)整推薦內(nèi)容，為每位學(xué)生提供最適配的學(xué)習內(nèi)容和節(jié)奏，激發(fā)主觀能動性，增強自主學(xué)習能力，最終實現(xiàn)掌握基礎(chǔ)、突破重點、攻克難點的目標。例如，對于交互設(shè)計表現(xiàn)出濃厚興趣的學(xué)生，推薦相關(guān)拓展模塊和更深入的學(xué)習資源，如教學(xué)課件、章節(jié)習題、項目案例、教學(xué)視頻等多元資料。

3.2創(chuàng)新教學(xué)方法

教學(xué)方法的創(chuàng)新是提升教學(xué)效果的關(guān)鍵。實施項目驅(qū)動教學(xué)能夠?qū)⒗碚撝R與實踐應(yīng)用緊密結(jié)合。從實際項目出發(fā)，整合網(wǎng)頁設(shè)計與制作、數(shù)據(jù)庫設(shè)計、服務(wù)器管理、前端框架等多門課程的知識點，幫助學(xué)生理解和掌握從需求分析、設(shè)計開發(fā)到部署運維的全流程實踐，提高解決復(fù)雜問題的能力。以新聞門戶類網(wǎng)站為例，該項目需包含前端頁面設(shè)計（HTML、CSS、JavaScript）、新聞數(shù)據(jù)管理（數(shù)據(jù)庫設(shè)計）、新聞提交處理（服務(wù)器管理）、視頻播放等功能。通過拆解任務(wù)，借助知識圖譜進行串聯(lián)，幫助學(xué)生明確項目要點需求，更好地理解項目全貌。同時，通過真實項目的實踐，將所學(xué)知識應(yīng)用于解決實際問題，提高綜合應(yīng)用能力，在創(chuàng)新設(shè)計中激發(fā)創(chuàng)新思維。

3.3優(yōu)化考核評價

考核評價的優(yōu)化是保障教學(xué)質(zhì)量的重要環(huán)節(jié)。將知識圖譜融入網(wǎng)頁設(shè)計與制作課程的考核中，能夠有效提升考核的精準性和科學(xué)性，助力更準確地衡量學(xué)生能力水平，有效評估學(xué)生的學(xué)習成效。

一方面，建立多元化評價體系，全面且客觀地評估學(xué)生的學(xué)習效果。在設(shè)置形成性考核時，除單元測試和平時訓(xùn)練外，可從項目作品、課堂表現(xiàn)、協(xié)作能力等多個維度進行綜合考量，考察學(xué)生的整體素養(yǎng)；在設(shè)置終結(jié)性考核時，根據(jù)不同教學(xué)對象和目標層次，結(jié)合知識要素的難易程度及覆蓋范圍，全面、科學(xué)地進行抽題組卷，確保考核評價全面覆蓋且邏輯嚴謹。另一方面，開展個性化反饋機制，激發(fā)學(xué)生學(xué)習動力，改進教師教學(xué)進度。通過記錄學(xué)生的學(xué)習數(shù)據(jù)，提供針對性的學(xué)習建議和改進方案[7]。既要讓學(xué)生主動回顧與鞏固所學(xué)知識，有針對性地準備和復(fù)習，提高考核效率；又要讓教師能夠及時了解學(xué)生的學(xué)習進展和困難，實時跟蹤學(xué)生學(xué)習軌跡，根據(jù)知識掌握程度和學(xué)習行為模式，及時調(diào)整教學(xué)策略。

4結(jié)束語

本文基于知識圖譜對網(wǎng)頁設(shè)計與制作課程在系統(tǒng)化知識體系構(gòu)建、個性化學(xué)習路徑推薦、模塊化教學(xué)內(nèi)容設(shè)計、多元化考核評價實施等方面進行了探討，為教育數(shù)字化轉(zhuǎn)型研究提供了方向。然而，將知識圖譜融入教學(xué)改革是一個持續(xù)過程，需要不斷推進和評估。未來研究可進一步優(yōu)化知識圖譜構(gòu)建、深化教學(xué)模式研究、增強智能技術(shù)支持，并開展長期效果評估，以推動知識圖譜在教育領(lǐng)域的更廣泛應(yīng)用和深入研究。

參考文獻：

[1]新華社.習近平在中共中央政治局第五次集體學(xué)習時強調(diào)加快建設(shè)教育強國為中華民族偉大復(fù)興提供有力支撐[J].國防科技工業(yè)，2023（6）：7.

[2]龔璇.知識圖譜賦能下的高職院校課程思政建設(shè)新路徑研究與實踐[J].武漢船舶職業(yè)技術(shù)學(xué)院學(xué)報，2024，23（5）：53-58.

[3]時文龍，劉茂玲.知識圖譜視角下我國職業(yè)教育數(shù)字化轉(zhuǎn)型研究可視化探微[J].重慶電子工程職業(yè)學(xué)院學(xué)報，2024，33（6）：62-71.

[4]孫宇，劉川，周揚.深度學(xué)習在知識圖譜構(gòu)建及推理中的應(yīng)用[J].計算機工程與應(yīng)用，2025，61（6）：36-52.

[5]周東岱，董曉曉，顧恒年.教育領(lǐng)域知識圖譜研究新趨向：學(xué)科教學(xué)圖譜[J].電化教育研究，2024，45（2）：91-97，120.

[6]劉鳳娟，趙蔚，姜強，等.基于知識圖譜的個性化學(xué)習模型與支持機制研究[J].中國電化教育，2022（5）：75-81，90.

[7]劉昕，盧文娟，李華昱，等.一人一堂的個性化課堂[J].計算機教育，2024（1）：147-150.

【通聯(lián)編輯：唐一東】