Office Hour
(二) 10:10~11:00、(二) 11:10~12:00、(三) 13:20~14:10、(三) 14:20~15:10
/ H429
課程簡介
本課程透過對網頁技術(包含 HTML, CSS, 及JavaScript)及網頁程式實例的介紹,協助學生了解何謂程式設計,同時培養撰寫程式及設計網頁的能力。由於網頁技術隨著時間演進的很快,本課程會補充新的網頁製作技術及新的開發工具,期望能透過此課程幫助學生具備網頁開發的實務能力,未來足以從事此類型的工作。
課程大綱
1. 網頁伺服器設定
2. 網頁開發相關工具
3. HTML基礎
4. CSS排版
5. JavaScript網頁特效
6. Bootstrap框架介紹
基本能力或先修課程
無
113-1 基礎程式設計 黃鈴玲 老師
課程與系所基本素養及核心能力之關連
具備執行多媒體設計實務所需技術、技巧及使用現代工具的能力
具備發掘、分析及因應複雜跨領域多媒體設計問題的能力
具備計畫管理、有效溝通、尊重多元觀點與團隊合作的能力
具備蒐集、解讀與分析全球多媒體產業趨勢,及參與多媒體實務設計的能力。
113-1 基礎程式設計 黃鈴玲 老師
課程計畫表
系所核心能力
權重(%)【A】
檢核能力指標(績效指標)
教學策略
評量方法及配分權重
核心能力學習成績【B】
期末學習成績【C=B*A】
具備多媒體設計專業知識的能力
30
培養學生理解多媒體數位內容理論之能力。
培養學生熟悉多媒體數位內容相關知識之能力。
培養學生具備多媒體數位內容相關專業知識之能力,包括動畫、動漫與遊戲設計等。
培養學生具備多媒體數位內容相關設計涵養之能力,包括文創、藝術與美學等。
講述法
個案討論
實務操作(實驗、上機或實習等)
小考(肯學): 10%
期中考(肯學): 20%
作業(肯付出): 40%
課程參與度(肯學): 10%
成品製作(肯做): 20%
加總: 100
30
具備執行多媒體設計實務所需技術、技巧及使用現代工具的能力
25
培養學生具備且能運用多媒體數位內容相關專業設計技術與技巧。
培養學生具備使用現代多媒體軟硬體設計工具之能力。
培養學生實作多媒體數位內容系統之能力。
講述法
個案討論
實務操作(實驗、上機或實習等)
小考(肯學): 10%
期中考(肯學): 20%
作業(肯付出): 40%
課程參與度(肯學): 10%
成品製作(肯做): 20%
加總: 100
25
具備整合多媒體設計知識及技術的能力
20
培養學生整合理論知識與實務技術之能力。
培養學生整合視覺傳達、資訊科技及內容管理相關領域知識之能力。
講述法
個案討論
實務操作(實驗、上機或實習等)
學生上台報告
小考(肯學): 10%
期中考(肯學): 20%
作業(肯付出): 40%
課程參與度(肯學): 10%
成品製作(肯做): 20%
加總: 100
20
具備人文藝術涵養、創意思維及創新設計的能力。
5
培養學生具備人文藝術涵養。
培養學生具備創意思維之能力。
培養學生具備創新設計之能力。
講述法
個案討論
實務操作(實驗、上機或實習等)
小考(肯學): 10%
期中考(肯學): 20%
作業(肯付出): 40%
課程參與度(肯學): 10%
成品製作(肯做): 20%
加總: 100
5
具備持續學習的習慣與能力。
20
培養學生藉由多元管道達到終身學習之能力。
講述法
個案討論
實務操作(實驗、上機或實習等)
小考(肯學): 10%
期中考(肯學): 20%
作業(肯付出): 40%
課程參與度(肯學): 10%
成品製作(肯做): 20%
加總: 100
20
113-1 基礎程式設計 黃鈴玲 老師
成績稽核
教科書(尊重智慧財產權,請用正版教科書,勿非法影印他人著作)
無參考教科書
參考教材及專業期刊導讀(尊重智慧財產權,請用正版教科書,勿非法影印他人著作)
W3Schools (https://www.w3schools.com)
Refsnes Data
n.a.
n.a.
0
跟著實務學習HTML、CSS、JavaScript、Bootstrap、JQuery、JQueryMobile網頁設計
蔡文龍, 歐志信, 曾芷琳, 蔡捷雲
n.a.
碁峰
2024
網頁設計完全攻略HTML、CSS、JavaScript、Bootstrap、jQuery、Vue.js、RWD|搭配ChatGPT效率加倍
陳惠貞
n.a.
碁峰
2023
自編教材(尊重智慧財產權,請用正版教科書,勿非法影印他人著作)
無自編教材
上課進度
教學策略
1
網頁伺服器連線設定及相關工具介紹 & 智財權宣導(含告知學生應使用正版教科書) & 交通安全宣導 & 性別平等教育宣導
講述法、實務操作(實驗、上機或實習等)
2
HTML 架構、文字與圖片、超連結、音效與影片
講述法、實務操作(實驗、上機或實習等)
3
HMTL 表格及表單、排版
講述法、實務操作(實驗、上機或實習等)
4
CSS 顏色、文字、段落與列表設計
講述法、實務操作(實驗、上機或實習等)
5
CSS 背景、區域與外框設計
講述法、實務操作(實驗、上機或實習等)
6
CSS 變形、轉換與動畫設計
講述法、實務操作(實驗、上機或實習等)
7
RWD 範例實作
講述法、個案討論、實務操作(實驗、上機或實習等)
8
RWD 範例實作
講述法、個案討論、實務操作(實驗、上機或實習等)
10
JavaScript 簡介與範例實作
講述法、實務操作(實驗、上機或實習等)
11
JavaScript 範例實作
講述法、實務操作(實驗、上機或實習等)
12
jQuery 範例實作
講述法、實務操作(實驗、上機或實習等)
13
網頁特效範例實作
講述法、實務操作(實驗、上機或實習等)
14
Bootstrap 簡介
講述法、個案討論、實務操作(實驗、上機或實習等)
15
Bootstrap 期末專題實作
講述法、個案討論、實務操作(實驗、上機或實習等)
16
Bootstrap 期末專題實作、
實務操作(實驗、上機或實習等)、學生上台報告
17
網頁程式相關主題自學 & 彈性教學/學習
彈性教學-自主行動
18
網頁程式相關主題自學 & 彈性教學/學習
彈性教學-自主行動