RWD響應式網站好做嗎?細節大解析

RWD響應式網站好做嗎?細節大解析

RWD 網頁是什麼?為什麼大家都要做?他的成本高嗎?一起來看看。
RWD響應式網站好做嗎?細節大解析
rwd

文章索引

RWD是什麼?工序複雜嗎?

由於螢幕總類越來越多,美國設計師 Ethan Marcotte於2011年提出因應「多螢幕」的網站改善辦法,以流體移動排版方式來適應螢幕尺寸調整網頁內容、縮放、重新編排或隱藏部分內容,RWD如今已經成為網頁設計師製作網站時必備的開發趨勢與技術概念,這樣的概念也可以稱為響應式網頁設計(Responsive web design 簡稱 RWD)又稱響應式、回應式、對應式、多螢幕網頁設計,其設計概念都是一樣的。

延伸閱讀:三分鐘帶你掌握 html5 網站設計基礎知識

大約在2010年之前,網頁設計師所製作的網站,都是依照固定尺寸來設計,例如寬1024px、高768px,類似海報、報紙、書本設計等等,尺寸都是固定的,但是如今有數十種不同螢幕尺寸規格,如智慧型手機、平板、筆電、PC電腦多種螢幕尺寸,因此網頁設計師常常因為螢幕尺寸不同而困擾。

rwd1
rwd2
rwd3

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

網頁 設計

過於複雜的內容不利於RWD製作

接著我們來了解製作難度,由於RWD會隨著螢幕尺寸變更排版,因此太複雜的內容不利於RWD製作。此外RWD網頁構建方式是用目前最新的HTML5 + CSS3技術來編輯網頁,因此版本太舊的瀏覽器並非完全支援這些技術,因此瀏覽可能會有破格或是無法點擊頁面的情形發生,不過隨著時間的進步,市場上舊版的瀏覽器勢必會漸漸消失,到全部取代成為新版。

RWD開發時間較傳統網頁長

因為需要對應到各種解析度來調整,因此需要逐一檢查是否切到重要的內容,隨著市售裝置越來越多,需要調整的版面種類也會增加,勢必會影響到製作時長。

簽名檔

相關文章