課程名稱 |
(中文) 網路首頁設計 (英文) 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 |
|
|
教學要點概述: |