V2280 教學大綱表

教學大綱表 (105學年度第1學期)

請遵守智慧財產權，勿使用非法影印教科書，避免觸法。

課程名稱 Course Title	(中文) 互動網頁設計 (英文) Interactive Web Design			開課單位 Departments	媒體設計學系
				課程代碼 Course No.	V2280
授課教師 Instructor	莊羽柔
學分數 Credit	2.0	必/選修 core required/optional	選修	開課年級 Level	大二
先修科目或先備能力(Course Pre-requisites)：
課程概述與目標(Course Overview and Goals)：課程概述與目標：網頁是現在最重要的訊息傳播管道。而HTML5結合CSS3以及JavaScript的互動網頁是現今最為熱門的網頁製作技術。學習網頁相關的技術與知識相當廣泛，若將來想使用網路做為訊息溝通的媒介，必須要對相關技術有更深入的了解。本課程除講解相關技術之外，也盡可能以深入淺出的方式教學，適合所有對網頁設計有興趣之初學者，並以Adobe Dreamweaver以及Adobe Edge Animate作為實做練習對象。
教科書(Textbook)	自備投影片教學
參考教材(Reference)	1.Div+CSS網頁版面設計輕鬆做網頁排版隨手做SEO 2.HTML&CSS網站設計建制優化之道 3.用Dreamweaver，我也會開發APP 4.跟Adobe徹底研究Edge Animate

課程大綱 Syllabus			學生學習目標 Learning Objectives	單元學習活動 Learning Activities	學習成效評量 Evaluation	備註 Notes
序 No.	單元主題 Unit topic	內容綱要 Content summary	學生學習目標 Learning Objectives	單元學習活動 Learning Activities	學習成效評量 Evaluation	備註 Notes
1	課程介紹	課程概略敘述	第一堂課會讓學生了解這門課要學習甚麼。	講授
2	何謂HTML	HTML整體介紹	簡單介紹HTML是甚麼	講授
3	HTML語法架構與標籤	語法架構與標籤教學	學會後就可了解基礎的網頁排版是如何進行	上機實習講授
4	何謂CSS	CSS整體概觀介紹	先讓學生有個基本觀念了解到CSS是甚麼？有甚麼必要性？	講授
5	CSS語法架構	CSS語法架構與定義種類	學習CSS之前先了解語法架構，後續學習會更為容易	上機實習講授
6	CSS教學-回應式網頁教學	CSS3架構與寫法，含<div>排版以及回應式網頁製作	學會CSS後讓自己的網頁變漂亮，並且可適應所有瀏覽裝置	上機實習討論講授實作	作業
7	HTML→HTML5	介紹HTML5有什麼新的東西	當瞭解HTML4之後，學習HTML5就是一件簡單的事	講授
8	JavaScript教學-1	JavaScript基礎語法、函式與判斷式	了解JavaScript的用途，讓網頁活起來。	上機實習講授
9	期中報告	藉由一個報告來了解學生期中之前的學習效果	審視自己在期中之前的學習成效	討論講授心得發表	作業
10	JavaScript教學-2	JavaScript基礎語法、函式與判斷式	了解JavaScript的用途，讓網頁活起來。	上機實習講授
11	jQuery介紹	了解jQuery是甚麼東西？在互動網頁上扮演甚麼重要的角色？	對jQuery有著初步的認識	上機實習講授
12	jQuery教學	學習jQuery的用法與呼叫方式	網頁透過jQuery後讓互動變得很簡單。即便完全不會寫程式，只要會用jQuery，就可以讓你的網頁變得很不一樣。	上機實習講授
13	jQuery教學-滾動式網頁教學	教學如何製作滾動式網頁	滾動式網頁是目前最熱門流行的網頁瀏覽模式，只要學會如何製作，受用無窮。	上機實習講授	作業
14	工具介紹-Adobe Dreamweaver	介紹Adobe Dreamweaver及其功能概述	讓已有深厚的網頁技術概念前提之下再使用軟體或工具輔助，使自身能力更為加分。	上機實習討論講授實作
15	工具介紹-Adobe Edge Animate	介紹Adobe Edge Animate及其功能概述，Edge Animate是Adobe公司用來取代Flash的軟體之一，絕對有學習的必要性。	讓已有深厚的網頁技術概念前提之下再使用軟體或工具輔助，使自身能力更為加分。	上機實習討論講授實作
16	工具教學-Adobe Edge Animate	Edge Animate是Adobe公司用來取代Flash的軟體之一，絕對有學習的必要性，仔細介紹內部功能與實作是教學的重點。	學會製作一個類Flash的HTML5的互動動畫網頁。	上機實習討論講授實作	作業
17	簡易介紹PhoneGap	介紹如何把HTML5+CSS+JS的網頁發佈成手機的Application(APP)	了解Application(APP)在現今的重要性，只要學會製作網頁，就會製作APP！	上機實習講授
18	期末發表	檢視一整個學期的學習成效	檢視自己在一整個學期的學習成效	心得發表	作業

教學要點概述：
1.自編教材 Handout by Instructor：
□ 1-1.簡報 Slids
□ 1-2.影音教材 Videos
□ 1-3.教具 Teaching Aids
□ 1-4.教科書 Textbook
□ 1-5.其他 Other
□ 2.自編評量工具/量表 Educational Assessment
□ 3.教科書作者提供 Textbook

成績考核 Performance Evaluation：其他評量：20% 作業：80%

教學資源(Teaching Resources)：
□ 教材電子檔(Soft Copy of the Handout or the Textbook)
□ 課程網站(Website)
扣考規定：http://eboard.ttu.edu.tw/ttuwebpost/showcontent-news.php?id=504