網頁設計學習成就目標:

初步認識HTML的標籤語言。
初步認識CSS樣式表的功能。
瞭解自適應(Responsive)網頁設計概念。
初步認識網頁設計的基礎架構。
學會善用Chrome瀏覽器檢視元件屬性。
學會套用BootStrap網頁框架來快速建置網頁內容。
融入更多元的Font Awesome字型圖示。
最終能獨立完成一個符合自適應式的網頁內容。
學會使用Bootstrap Layout產生器工具來快速建構網頁的框架。
學習如何放置網頁內容到伺服器空間。
單元 教學內容說明 原始檔 錄影檔 時間
A 設計環境配置
A01 網頁設計新手入門 02:41
A02 觀摩優質網站作品 03:58
A03 HTML5入門教學 04:19
A04 CSS樣式表簡介 03:28
A05 W3Schools線上網頁教學 03:01
A06 安裝Sublime Text3網頁編輯器 05:52
A07 Sublime Text3建議安裝的外掛 04:54
A08 建議使用Chromium瀏覽器 02:56
B 套用BootStrap網頁框架功能
B01 完成目標作品瀏覽 02:04
B02 自適應網頁設計 04:37
B03 BootStrap網站簡介 02:55
B04 BootStrap Layout產生器 04:36
B05 選用BootStrap樣版(BootSwatch) 02:28
B06 新增一個網頁檔案 03:13
B07 引入必要的樣式檔案與javascript檔案 05:37
B08 引入Font Awesome的字型檔案 03:15
B09 設定網站語系及標題 01:56
B10 設定頁首選單列 05:12
B11 設定頁首輪播秀 02:06
B12 設定內容區大綱 01:17
B13 設定內容區表格內容 02:49
B14 設定內容區的寬度 03:04
B15 設定頁尾內容 01:14
C 網頁作品上雲端
C01 申請免費的網頁空間 02:35
C02 上傳網頁作品到雲端伺服器空間 03:15