| 課程代碼 |
50D22701
|
| 課程中文名稱 |
網頁設計
|
| 課程英文名稱 |
Website Design
|
| 學分數 |
3.0
|
| 必選修 |
必修
|
| 開課班級 |
四技電商一甲
|
| 任課教師 |
林培煌
|
| 上課教室(時間) |
|
週四
|
第1節
|
(D303)
|
|
週四
|
第2節
|
(D303)
|
|
週四
|
第3節
|
(D303)
|
|
| 課程時數 |
3
|
| 實習時數 |
0
|
| 授課語言 |
1.華語
|
| 輔導考證 |
無
|
| 課程概述 |
使學生了解網站規劃之原理與原則、培養學生具有網頁製作的能力。
|
| 先修科目或預備能力 |
|
|
課程學習目標與核心能力之對應
|
| 編號 | 中文課程學習目標 | 英文課程學習目標 | 對應系指標 |
|
1
|
了解網站規劃之原理與原則
|
|
2 管理實務
|
|
2
|
培養學生具有網頁製作的能力
|
|
13 資訊能力
|
|
3
|
熟悉網站設計建置的各項功能技巧與應用
|
|
3 計畫評估
|
|
4
|
以範例導向，Step by step方式，引導學習
|
|
5 分析構想
|
|
5
|
配合實作題練習，完成一個完整的網站製作
|
|
6 合作創新
|
|
| 就業力培養目標 |
| |
校指標 |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
| |
專業知識 |
實務技能 |
資訊能力 |
整合創新 |
外語能力 |
熱誠抗壓 |
表達溝通 |
敬業合群 |
人文素養 |
服務關懷 |
| |
5% |
30% |
25% |
40% |
0% |
0% |
0% |
0% |
0% |
0% |
| |
系指標 |
1 |
2 |
3 |
13 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
12 |
11 |
| |
管理知識 |
管理實務 |
計畫評估 |
資訊能力 |
協調整合 |
分析構想 |
合作創新 |
外國語文 |
適應社會 |
報告溝通 |
企業倫理 |
人文素養 |
服務學習 |
| |
5% |
10% |
20% |
25% |
5% |
20% |
15% |
0% |
0% |
0% |
0% |
0% |
0% |
|
| 中文課程大綱 |
1. 網頁製作軟體操作、設定
2. 編輯文字、文件。加入圖片與動畫
3. 超連結及網頁背景
4. 表格版面配置與圖層
5. 框架、共用邊框
6. 佈景主題、網頁元件
7. 網頁特效、HTML、CSS
8. 學期專題成果呈現
|
| 英/日文課程大綱 |
1. Introduction
2. Edit and graph
3. Hyperlink and background
4. Table and graph level
5. Frame
6. Web Components
7. DynamicHTML、HTML、CSS
8. Final report
|
| 課程進度表 |
週01 2/21 網站基本概念與 Sublime text 3, dreamweaver 環境介紹
週02 2/28 放假
週03 3/7實作第一個網頁
週04 3/14 利用 CSS 與 Div 建立網頁版型
週05 3/21 利用 CSS 與 Div 建立網頁版型
週06 3/28 影像處理與元件設計, 編排文章、加入影片與 FB、LINE 推文按鈕
週07 4/4 放假
週08 4/11 期中書面報告
週09 4/18 期中考週
週10 4/25 用範本製作版型相同的網頁
週11 5/2 打造可隨裝置自動調整的 Bootstrap 網站
週12 5/9 打造可隨裝置自動調整的 Bootstrap 網站
週13 5/16 利用 Div 與 CSS 設計相片縮圖展示頁面
週14 5/23 利用 Bootstrap 組件設計網頁,
週15 5/30 利用 jQuery 效果與 jQuery UI 組件設計網頁(I)
週16 6/6 期末報告 (設計製作)
週17 6/13 利用 jQuery 效果與 jQuery UI 組件設計網頁(II)
週18 6/20 期末考週
|
| 課程融入SDGs |
|
| 期考調查 |
| 期中考(第9週)考試方式 |
|
| 期末考(第18週)考試方式 |
|
| 其他週考試考試週次與方式 |
|
|
| 教學方式與評量方式 |
| 課程學習目標 | 教學方式 | 評量方式 |
| 了解網站規劃之原理與原則 |
課堂講授
|
作業
（
平時
）
|
| 培養學生具有網頁製作的能力 |
課堂講授
實作演練
|
作業
（
平時
）
|
| 熟悉網站設計建置的各項功能技巧與應用 |
課堂講授
實作演練
|
作業
（
平時
）
|
| 以範例導向，Step by step方式，引導學習 |
課堂講授
實作演練
|
作業
（
平時
）
|
| 配合實作題練習，完成一個完整的網站製作 |
成果驗收
|
書面報告
（
期中
）
設計製作
（
期末
）
|
|
| 指定用書 |
| 書名 |
跨裝置網頁設計：HTML5、CSS3、JavaScript、jQuery、Bootstrap、jQuery Mobile(第三版)
|
| 作者 |
陳惠貞
|
| 書局 |
碁峰
|
| 年份 |
2017
|
| 國際標準書號(ISBN) |
9789864765393
|
| 版本 |
|
請同學尊重智慧財產權，使用正版教科書，不得非法影印，以免觸犯智慧財產權相關法令
。 |
| 參考書籍 |
1. 施威銘研究室 (2015). 正確學會 Dreamweaver CC 的16堂課. 台北市, 旗標
2. 林蕙如譯 (2016). HTML5‧CSS3 最強圖解實戰講座 (原作者: 草野). 台北市, 旗標
3. 許郁文譯 (2016). 不再聽不懂！圖解網站建置與開發( 原作者: 松田慎). 台北市, 碁峰.
|
| 教學軟體 |
Sublime text 3,
Dreamweaver CC
|
| 課程規範 |
|