主軸名稱

【A主軸】教學創新精進

補助課程類別

■通識實踐課程

□嘉義巡禮微學分課程

□微學分課程

□AI導入課程

□業師協同教學

□跨域共授課程

□國際學者協同教學

課程名稱

網頁程式設計基礎入門

授課教師

主授：許政穆

共授：(無則免填)

開課學期

114-2

聯絡電話

05-2717742

E-mail

hsujm@mail.ncyu.edu.tw

開課單位

通識教育中心

修課人數

生理男

生理女

其他

結案報告公開

本人同意將結案報告書公開於高教深耕計畫相關網站。

聯合國永續發展目標(SDGs)

□1.終結貧窮

□3.健康與福祉

□5.性別平權

□7.可負擔的潔淨能源

□9.工業化、創新及基礎建設

□11.永續城鄉

□13.氣候行動

□15.保育陸域生態

□17.多元夥伴關係

□2.消除飢餓

■4.優質教育

□6.淨水及衛生

□8.合適的工作及經濟成長

□10.減少不平等

□12.責任消費及生產

□14.保育海洋生態

□16.和平、正義及健全制度

關鍵能力

□STEAM領域

□人文關懷

■跨領域

□問題解決

■自主學習

□社會參與

□國際化

教學活動類型

可複選

■講授法

■課堂實作，主要由學生自行操作、討論、完成之實作任務。 

□課程專題實作，需於期末提出專題報告/成果發表/展演等教學活動

□場域/產業/服務專題實作，於產業/社區等真實職場情境進行之專題實作，如實習專題或產品製作等。 

□線上課程，如磨課師、開放式課程等由線上進行教學與評量之課程類型。 

□數位學習科技輔助，如採用線上課程平台、線上評量、AR/VR等科技進行教學活動。

□延伸教學活動，如於暑假設計場域實習課程，協助學生將課堂成果進一步發展參與競賽等。

□其他，請說明：

課程執行場域

■實體教室

□實體教室+線上教學

□實體教室+校內實習場域

□實體教室+校外實習場域（包含業界、社區等大學課室外場域）

□校外場域+線上教學

□校外實習場域（包含業界、社區、與學校進行產學合作場域或合作夥伴場域）

課程目標

及內容

課程目標：

本課程目標是使用 HTML/CSS 技術與生成式 AI 輔助進行基礎網頁設計與網站架設，包括瞭解網頁設計原理、HTML/CSS 標記用法、生成式 AI 提示語 (Prompt) 撰寫、網頁標記內容生成等，透過一系列專案實作，使修課學生認識網頁設計基礎知識能力，並培養運用 AI 工具進行自主學習與創作的現代開發素養。

教學內容：

1. 網頁設計原理與技術基礎：引導學生理解網頁設計的基礎原理，學習HTML標記架構與CSS樣式設計。
2. AI工具協作網頁標記學習與網頁設計：導入AI輔助教學，訓練學生撰寫精確提示內容，讓AI協助理解網頁語法並生成相對應的 HTML/CSS 網頁標記內容，藉此大幅提升網頁製作效率與實務開發能力。
3. 專題導向網頁實作 (PjBL)：結合專題導向學習（Project-based Learning）策略，落實做中學的理念。學生將透過個人獨立或團隊合作，整合上述網頁技術與 AI 工具，完成具備個人特色的實務專題作品（例如：課程簡介、產品介紹、公司簡介或個人履歷網站）。

具體措施與

亮點成果

建議方向：

1. 本次教學加入AI協作的網頁設計，由於AI工具相當多元本次除了使用ChatGPT外，也使用易於上手的 Google AI Studio 以對談方式進行網頁生成，也鼓勵同學以AI協助期末主題式網頁製作。
2. 學生意見回饋如下。本次修課人數23人，扣除出席率極低與休學同學人數，有效的修課參與人數應為20人，但問卷填答有24人次，故以填答人數作為分析人數基礎。修課學生認為資訊科技應用能力與問題解決能力都有達到4分以上，表示學生認為網頁設計課程能幫助他們資訊科技能力提升與問題解決能力。但溝通表達能力與團隊合作能力並無提升，也符合課程特性。因課程是教授網頁設計，大都是屬於個人作品且只有學期末有上台分享自己作品外，並無其他課程團隊活動。未來將嘗試於課程中融入溝通表達與團隊合作能力提升的學習活動。

 在下表中最後一列為各項調查的高於等於滿意(或相對提升)的整體調查人次百分比除了國際認知與視野項目偏低(59%)外，其他項目都有達75%以上。因為課程式網頁設計與國際認知與視野關聯度較低，未來可在課程內介紹國際主流的網頁框架技術或增加以國際認知主題的網頁製作，增加修課生的國際認知視野。

從原始調查資訊顯示，調查結果落於普通與相同的部分以體育系學生為主，而學生也有反映課程有難度，要記標記與軟體操作都有困難較難跟上進度。未來將會進一步簡化教材以直覺式的學習教材設計，或是以他們學系領域特色資訊進行網頁設計，嘗試提升這類學生的學習意願與動機。

1. 學生作品發表、成果報告或獲獎情形。

課程有提供網頁空間供同學展示期末成果，網址如下 http://120.113.713.41/2026SGED，共有19位修課同學完整期末作業的繳交。
 主題可分為自家寵物、個人作品、個人簡介、嘉義美食、咖啡館、畢業國中、電玩簡介等。

檢討與建議

建議方向：自我檢討評估與改善機制、執行上的問題或困難處、教師或學生的變化等。

1. 此次課程學生完成(1) 個人網頁標記版、(2)個人網頁AI版、(3) 個人課表、(4)多版本學校簡介等網頁設計。基本的網頁標記與CSS語法都有涵蓋到，但部分同學對於CSS的語法用途尚覺很難，未來可以導入鷹架教學方式引導學生建立CSS知識與使用概念建立。
2. 往年課程期末主題網頁建置，都以式套用bootstrap模板方式來製作。而這次鼓勵同學以AI 協助進行網頁設計，大部分同學使用 Google AI Studio 與 OpenAI ChatGPT 進行協作，而網頁互動效果較佳的同學則是以Claude作為輔助生成。但是可以發現以AI生成的網站，雖然看起來較為協調但內容很明顯可以感受是AI生成文案，未來課程將明確說明文案內容仍須由同學自行整理而非以AI生成為主。