HTML5、CSS3、JavaScript 網頁切版專案實戰

HTML5、CSS3、JavaScript 網頁切版專案實戰

沒有切不出來的網頁！

網頁技術易學難精，你是否學完 HTML5、CSS3、甚至 JavaScript 之後，仍然無法完成能被企業採用、真正上線的網頁產品呢？

關鍵在於「網頁切版」的能力！網頁切版要做得好、做得精細、做得專業，需要許多經驗的累積。這門課，將會帶你【實際模仿開發】Google、Facebook 等大型公司的網頁版面設計，鉅細靡遺，手把手，從頭做到尾。

你的課程作品，就是世界級的網頁！

課程大綱

1. 網頁切版技巧總覽：
1.1 快速複習 HTML、CSS 的關鍵部份
1.2 顯示模式觀念
1.3 切版技巧之 inline-block
1.4 切版技巧之 flex
1.5 使用語意標籤

2. 行動網頁設計：
2.1 行動網頁的基本觀念
2.2 行動網頁的解決方案
2.3 RWD 回應式設計之 Media Query
2.4 RWD 回應式設計的關鍵招術
2.5 通過行動網頁友善測試

3. 網頁切版實戰一：Facebook 首頁
3.1 實戰目標：www.facebook.com (未登入狀態)
3.2 分析主要區塊
3.3 分析版面細節
3.4 鉅細靡遺：完成 FB 首頁切版

4. 網頁切版實戰二：Google 開發人員頁面
4.1 實戰目標：developers.google.com
4.2 分析主要區塊與細節
4.3 分析 RWD 回應式設計的模式
4.4 鉅細靡遺：完成 Google 開發人員頁面切版

適合對象

具備 HTML、CSS 基礎。

開發環境

任何文字編輯器，例如 Notepad++、Sublime、Visual Code 等等。

實體課程注意事項

本班為實體課程，常見QA詳情連結

校園防疫措施詳情連結

公務員全程參與課程學習後可於課程結束後申請登錄公務人員學習時數

課程影片觀看期限至課程結束後一週關閉

(一)退費期限：開課日後⅓時數內，詳情連結

(二)查詢結業狀況：結業名單連結

近期班次

講師介紹

彭兆蔚(彭彭)

(1) 國立臺灣大學心理學學士學位、國立臺灣大學資訊工程學碩士學位，具備跨領域專案開發經驗。
(2) 於 2003 年，獲得美商昇陽電腦 Sun Certificated Java Programmer(SCJP) 認證。
(3) 於 2008 年，參與美商昇陽電腦校園大使計畫。
(4) 曾任資策會軟體工程師。
(5) COSCUP 2010 開源人年會講者，講題：Implementation of websocket protocol。
(6) 網頁多人線上遊戲開發。
(7) Piconion 影像處理軟體主要開發者。
(8) iThome Modern Web 2016 講者，講題：Web 終將統治世界，用 JS 打造專業影像處理軟體。
(9) iThome Modern Web 2017 講者，講題：開發複雜網頁應用的黃金法則。
(10) 2008年至本班教學，累計授課時數至2024年3月1日為4,020小時，為資深講師。

*老師個人課程網站：https://training.pada-x.com/