| 課程名稱 |
(中文) 網路首頁設計 (英文) Web Homepage Design |
開課單位 | 事業經營學系 | ||
| 課程代碼 | B4660 | ||||
| 授課教師 | 王光正 | ||||
| 學分數 | 2.0 | 必/選修 | 選修 | 開課年級 | 大二 |
| 先修科目或先備能力： | |||||
| 課程概述與目標：近幾年因為HTML5、CSS3的流行普及，JavaScript、jQuery的歷久不衰，讓許多知名的網路服務平台如Google、Facebook、YouTube... 等爭相採用相關的技術開發出互動性極佳的網站。而人手一台的智慧型手機、平板電腦，宣告了跨平台的世代來臨，網頁的應用首當其衝：讓一個網站能正確適當的展現在不同作業系統、不同螢幕大小的設備上，就成為現代網頁開發者最新的挑戰。 而這些技術是相互關聯的，在學習的連結上似乎無法完整切割，也無從逃避，但也因此讓許多人徘徊在入門的關口外，不知所措。在本課程中針對這個問題，我們精心規劃了學習新一代網頁設計時必修的課程。 由HTML、CSS開始，再進入HTML5/CSS3的新領域，讓學習者能對於網頁的建構與設定有全面性的認識與熟悉。接著再由基本的JavaScript學習網頁互動，進而利用jQuery深入應用的層面。 最後的重點是二個近年來討論度高的跨平台框架：jQuery Mobile及Bootstrap。jQuery Mobile是基於jQuery技術發展出來的行動裝置使用者介面框架，能在簡易的設定與操作下快速打造出行動裝置的使用介面。 Bootstrap更是新一代RWD 網站開發中的熱門焦點，能讓網頁因應不同大小的螢幕自動改變內容的配置，確保每個平台的使用者都能得到最好的操作體驗。 | |||||
| 教科書 | 學好跨平台網頁設計：HTML5、CSS3、JavaScript、jQuery與Bootstrap 4超完美特訓班 (第二版) | ||||
| 參考教材 | |||||
| 課程大綱 | 學生學習目標 | 單元學習活動 | 學習成效評量 | 備註 | ||
| 週 | 單元主題 | 內容綱要 | ||||
| 1 | Topic 1 | Adobe Dreamweaver 基本介紹 | 瞭解Adobe Dreamweaver 基本功能 |
|
||
| 2 | Topic 2 | 網頁設計基礎原理 | 瞭解網頁設計基礎原理 |
|
||
| 3 | Topic 3 | 網頁文字設計 | 瞭解網頁文字設計 |
|
|
|
| 4 | Topic 4 | 網頁圖片設計 | 瞭解網頁圖片設計 |
|
||
| 5 | Topic 5 | 網頁表格設計 | 瞭解網頁表格設計 |
|
|
|
| 6 | Topic 6 | 用CSS設計網站 | 瞭解用CSS設計網站 |
|
||
| 7 | Topic 7 | 網頁框架設計 | 瞭解網頁框架設計 |
|
||
| 8 | Topic 8 | 多媒體與互動效果 | 瞭解多媒體與互動效果 |
|
|
|
| 9 | Midterm Exam | Midterm Exam | Midterm Exam |
|
|
|
| 10 | Midterm Report | Midterm Report | Midterm Report |
|
||
| 11 | Midterm Report | Midterm Report | Midterm Report |
|
|
|
| 12 | Topic 9 | 圖庫與網頁範本 | 瞭解圖庫與網頁範本 |
|
||
| 13 | Topic 10 | 網站上傳、管理與推廣 | 瞭解網站上傳、管理與推廣 |
|
||
| 14 | Topic 11 | 電子商務網站 | 瞭解網頁設計於電子商務網站之應用 |
|
|
|
| 15 | Topic 12 | 網頁表單與資料庫 | 瞭解網頁表單與資料庫 |
|
||
| 16 | Final Report | Final Report | Final Report |
|
||
| 17 | Final Report | Final Report | Final Report |
|
||
| 18 | Final Exam | Final Exam | Final Exam |
|
|
|
|
教學要點概述： |