2025 臺北雙年展 ↗
讓觀眾理解展覽主題並安排參觀。
觀察展覽主視覺、展期與策展資訊的先後順序。
觀察問題：如果今天想去看展，你會先找哪兩項資訊？
已結束展覽的網站案例，作設計觀察。WEEK 01 / 課程啟動
AI 時代，為什麼還要學網站？
01｜這週你會做出什麼從不同網站看懂「目的如何影響設計」，決定自己的學期網站主題。
2026-09-18（學期第 1 週）實體授課 · 不上機操作查看完成標準 ↓
02 / SKILLS
本週學習內容
- 觀察網站目的
- 辨識服務對象
- 比較資訊與視覺設計
- 找出訪客下一步
- 認識兩種架站方式
- 前端 / 後端
- HTML
- CSS
- JavaScript
- 資料與伺服器
03 / EXPLORE
目的不同，設計就不同。
04 / MAKE
決定你的網站主題
Step 1
看四種不同目的的網站
本週實體授課，不上機。老師帶看策展、公司品牌、個人品牌與主題內容網站；每個案例只找對象、目的與下一步。
檢查點 → 說得出兩個網站為什麼需要不同的首頁。
Step 2
模擬瀏覽器畫面，標示 HTML 結構、CSS 外觀、JavaScript 互動、前端與後端
拆解一個網站畫面
先看模擬畫面：HTML 把內容排成結構，CSS 決定字體、顏色與間距，JavaScript 讓按鈕、表單或篩選能回應操作；後端則處理資料、帳號與伺服器上的工作。
檢查點 → 能指出一個畫面元素屬於結構、外觀、互動，或是需要後端處理。
Step 3
從目的推回設計
挑兩個案例比較：展覽網站要讓人找到展期；內容網站要讓人找到想讀的文章。討論標題、圖片、選單與按鈕如何配合。
檢查點 → 用「因為希望訪客……所以把……放在……」說明一個設計。
Step 4
認識製作路徑，決定自己的主題
看下方 WordPress 與 AI Coding 比較，先知道兩種方式能做什麼。寫下主題、服務對象、訪客任務與首頁最重要的資訊。
檢查點 → 完成一句話：我的網站幫助誰，完成什麼事情。
05 / UNDERSTAND
你剛剛學到了什麼？
Website / Platform
網站呈現內容；當訪客能完成互動或任務時，就開始具備平台的服務能力。
前端 / 後端
前端是訪客在瀏覽器看到並操作的畫面；後端在伺服器處理資料、帳號、權限與需要安全保存的工作。
HTML / CSS / JavaScript
HTML 是內容與結構，CSS 是視覺與版面，JavaScript 是互動行為。三者常一起工作，但角色不同。
CMS / AI Coding
CMS 讓你在後台管理內容；AI Coding 讓你描述需求，協助產生與修改程式。
Hosting / Domain
網站需要存放空間與可找到它的地址；下週建站時就會碰到它們。
| 比較項目 | WordPress | AI Coding |
|---|---|---|
| 如何開始 | 用佈景主題、區塊與後台組合網站 | 描述需求，讓 AI 協助建立與修改程式 |
| 常見用途 | 持續更新文章、品牌內容與商品 | 客製版面與互動功能 |
| 如何修改 | 在後台編輯內容，設定 Theme / Plugin | 檢查 AI 修改、預覽測試，再發布版本 |
| 要自己判斷 | 網站架構、視覺、Plugin 與維護 | 需求是否清楚、互動是否正確與安全 |
| 本課程何時練習 | W2–W5 | W6–W7 |
06 / DELIVER
本週成果
本週過關目標
學期網站主題與想服務的對象
勾選供本次瀏覽自我檢核，重新整理後重設。繳交與期限依 Google Classroom 或學校 LMS 公告。