上課日期

授課時間

時數

課程進度／內容

授課師資

113/08/19(一)

18:30~21:30

3

網頁基礎與開發環境1.如何建立一個說故事的網站 2.安裝開發軟體與環境設定 3.您的網頁會有哪些檔案 4.如何成為WEB前端開發人員 5. HTML與HTML5網頁開發技術 6.HTML基本與進程文字7.HTML建立與解析超連結 8.網站架構的規劃9.網站的運作方式 10.發佈您的網站上線 11.實例應用：實作零售網站架構規劃，以利後續網頁與版型的設計

許季秦

113/08/21(三)

18:30~21:30

3

WEB表單、互動元素與其他物件 1.HTML表單設計 2. HTML互動元素3. iFrame的嵌入技巧4. HTML訊息代碼 5.實例應用：實作零售網站使用者註冊與登入頁面之設計

許季秦

113/08/26(一)

18:30~21:30

3

進程CSS與使用者介面1.網頁字型與文字特效2.設定導覽與下拉式選單 3.設定背景與漸層色彩 4.圖片之風格設計 5.圖案之變形與動畫 6.CSS之分頁設計7.實例應用：實作零售網站之UI與UX，以優化使用者介面與使用者經驗

許季秦

113/08/28(三)

18:30~21:30

3

Bootstrap響應式網頁設計 1.Download與CDN2.Bootstrap的版面配置 3.Bootstrap的容器4.Bootstrap的各項組件 5.Bootstrap的佈景主題 6.實例應用：參考BS樣式設計，並套用至零售網站中，以提升頁面之互動與優化操作介面

許季秦

113/09/02(一)

18:30~21:30

3

流程控制與例外處理1.條件與重複式流程控制2.使用陣列與商品展示3.計時器與動畫的應用4.錯誤訊息與處理5.實例應用：於零售網站頁面中加入與客戶互動功能，並計算金額、確認購買或修改訂單等警語

許季秦

113/09/04(三)

18:30~21:30

3

JS物件導向與Web APIs1.物件導向與類別概說2.物件方法與建構子3.建立物件與調用方法4. Web APIs概說 5.JS 文件模型物件 6.第三方APIs 7.影片與聲音APIs 8. Client資料儲存 9.實例應用：為零售網站，加入產品圖片之互動功能，使用者按下圖片後，即彈出介紹該產品之影片或Youtube之影片連結

許季秦

113/09/09(一)

18:30~21:30

3

響應式多媒體的嵌入與表格 1.HTML中的圖片與影音 2.WEB中加入向量圖案與畫布 3.WEB與響應式圖片的設計4.HTML表格基本與進程5.實例應用：實作零售網站響應式多媒體頁面，完成圖像、影音與動畫於頁面之設計

許季秦

113/09/11(三)

18:30~21:30

3

CSS語法與網頁風格1.CSS入門與結構 2.CSS 的語法與運作方式3.建立CSS與樣式選擇器 4. CSS選擇器之間的關係 5.容器樣式與盒子模式 6.項目符號與自動計數 7.實例應用：實作零售網站頁面超連結之連結、已連結、取得焦點、作用以及滑鼠於上等之視覺化樣式設計，完成由目錄到細節頁面的連結

許季秦

113/09/18(三)

18:30~21:30

3

CSS媒體查詢與網格配置 1.視埠與響應式網頁 2.設定欄位與媒體查詢 3. CSS網格與版型規劃 4. CSS3圖片與影音設計 5.實例應用：實作RWD頁面，自訂可適應3種以上裝置之類別，並套至零售網站頁面中，完成輸出於不同裝置，可達到最佳的顯示效果

許季秦

113/09/23(一)

18:30~21:30

3

JS導論 1.基礎知識與變數 2.數值、日期與字串 3.運算式與運算子4. JS 與 HTML 5 5.JS 與 CSS 3 6.實例應用：透過前述CSS之建立視覺化横幅，並完成滑鼠移入則彈出產品說明與圖示、滑開則隱藏說明與圖示，以提升零售網站之互動效果

許季秦

113/09/25(三)

18:30~21:30

3

函數與事件 1.函數的結構 2.匿名函數與箭頭函數 3.常見的事件應用 4.監聽與移除監聽事件 5.實例應用：為零售網站自訂互動函數，依會員登入時間，彈出該時間之問候語，並設計CTA按鈕，進行線上摸彩活動

許季秦

113/09/30(一)

18:30~21:30

3

jQuery 函數的應用1.Download與CDN 2.Selectors 3.AJAX 4.Effect 5.Event 6.Traversing 7.實例應用：檢視是否有無此頁面之連結錯誤，提升撰寫與設計之網頁效率，整合零售網站之所有頁面。

許季秦