Design News

網頁設計新知

什麼是 Responsive web design (RWD)響應式網頁

Jul 05, 2021

Responsive web design (RWD)響應式網頁

因為螢幕總類越來越多,在 2011年美國設計師 Ethan Marcotte 提出因應「多螢幕時代」的網站改善方案,以流體移動方式來適應螢幕大小調整網頁內容、縮放、重新編排或隱藏部分內容,RWD如今已經成為網頁設計中製作網站時不可逆的開發趨勢與技術概念,這樣的製作概念可以稱為響應式網頁設計(Responsive web design 簡稱 RWD。

大約在2010年之前,網頁設計製作的網站,都是依照固定的尺寸來設計,比如 寬1920px,高920px 類似海報、報紙、書本設計...等,尺寸是無法變動的,但是現在有數十種不同螢幕尺寸規格,如智慧型手機、平板、PC電腦多種螢幕尺寸,都會造成網頁設計中常常因為螢幕尺寸不同而困擾。

RWDD響應式網頁設計成為新的趨勢是必然的,這種新的架構並不是因為更時尚,也不是為了提倡新的美學,主要用來解決目前多種螢幕尺寸來瀏覽網頁的解決方式,以不同螢幕尺寸與解析度,讓網頁設計中有更多的方式去思考,如何將RWD(響應式)的網頁設計方式應用上。

RWD響應式網頁設計與製作方式以CSS3技術製作,以百分比的概念與液態彈性的編排設計,網頁本身會隨著螢幕的大小去滑動、隱藏、縮放變化,即時產生相對應的改變,好讓瀏覽者可以舒適的瀏覽網站。

在RWD響應式網頁尚未成熟與普及以前,手機板網站也曾經流行一小段時間,做為傳統網站與RWD網站的臨時解決方案,由於手機版網站使用上還是有不少缺點無法改善,例如需要二個後台管理...等,如今RWD響應式網頁是用一個網站取代多種版本的網站方式,在製作上與管理上相對單純許多,所以手機版網站已經漸漸被取代。

資料來源: 新視野網頁設計