人力銀行 UI/UX 設計師徵才必備條件「熟悉 Responsive Web Design(RWD) 響應式網頁與 Mobile Web 網頁製作」，設計人員和開發人員需要製作能夠滿足所有瀏覽器和屏幕尺寸的解決方案，以滿足越來越苛刻的用戶需求！
RWD 的核心是透過 CSS (media queries) 的控制，讓同一份網頁能「回應不同的裝置尺寸，呈現出適當的佈局」，同時什麼時候應該變化網頁佈局 Breakpoint，簡單來說，一個內容像水一樣，能流動、裝載在不同裝置內。
細分為以下三種
- 響應式網站(Responsive Website Design，簡稱RWD)
- 自適應網站(Adaptive Web Design，簡稱AWD)
- 漸進式網頁(Progressive Web Apps，簡稱PWA)
Breakpoints
透過網站行動友善測試你的網站。
何謂響 應式設計 RWD / 自適應設計 AWD ?
mytasker
響應式網頁
適合資訊固定、品牌形象強的網站。如：Dribbble、Disney、Bootstrap…等
不管在哪個裝置下內容都塞好塞滿，所需維護成本低，SEO排名更前面，來自谷歌爸爸的解說：「不管裝置如何都使用相同的 URL，但會根據服務器對用戶瀏覽器的了解為不同的裝置，生成不同版本的 HTML，所以搜索排行高」，缺點則是，不同設備上的佈局有限，而且比自適應性網站慢。
The 10 Best Responsive Websites
Good responsive websites (Google result)
自適應網頁
適合網站資訊量大。如：購物平台、迪卡儂、紐約時報、淘寶…等
以手機為優先(mobile first下圖)的設計概念，並針對每個用戶進行不同裝置佈局優化，並且比響應式網站快兩到三倍，易於跟踪用戶分析，製作耗時、不易維護、搜索引擎不友好，需要仔細的流量分析以優化用戶體驗。
FROONT
Mobile or Desktop first
Progressive Web 漸進式網頁，新勢力入侵
Progressive Web Application (PWA) 是一種新式的網路應用程式概念，最早是在2015年被提出，並且在次年的 Google I/O 大會上列入重點開發項目，如今Google 成為 PWA 的主要推手之一，也與 Magento 緊密合作，推動 PWA 在電商領域上的應用，同時 Google 也維護相當多有關於 PWA 的研究與參考資料，有興趣的朋友可以前往他們的官方網站參考看看。轉自Astralweb
星巴克 PWA 能夠以離線模式運行，從而使客戶能夠瀏覽菜單，並將商品添加到購物車中，而這一切都無需持續連線 Internet。上網後，可以直接查看特價格並下達食物和飲料訂單。
Uber PWA 在使汽車預訂在低速網絡上可行，引入超輕量級的 Web 應用程序中，當 Uber 用戶在於低網速狀況下。依舊能在 2G 網絡加載，大多數 PWA 都可在沒有網絡連接的情況下瀏覽之前加載的頁面。
- Starbucks
- Housing.com
- Digikala
- Flipboard
- Soundslice
- 2048 Game
- MakeMyTrip
- Uber
- Padpiper
- Pinterest
- Yummly
- Spotify
/政府網站營運交流平台授權轉載/
原文作者：亞宸
原文出處：【 UI/UX 】RWD / AWD / PWA 網站最佳選擇?