隨著行動裝置的普遍,幾乎人人都有一台行動裝置。

各品牌的手機、平板、筆電、桌電螢幕等...都有不同的尺寸。

幾年前的網頁設計只做單一寬度的版本,所以在不同裝置上瀏覽會發生不便的地方。

因此,這幾年出現了一種新的網頁設計方式來因應不同裝置的寬度。

Responsive Web Design,簡稱RWD,中文稱為"響應式網頁設計"或"自適應網頁設計"。

 

Responsive Web Design(RWD)這個詞是在2010年由Ethan Marcotte發明的術語。參考網址:Responsive Web Design (RWD)

在2012年後,被推廣為日後網頁設計的趨勢。在網頁中使用CSS,以百分比的方式及彈性的畫面設計去呈現。

在不同的解析度或是不同的行動裝置設備寬度下,自動改變網頁的排版,讓使用者都可以正常瀏覽網頁,提供最好的瀏覽體驗。

基於以上敘述,許多網站也都開始使用RWD去設計網頁。然而這種設計方式比較複雜,需要較多的時間去撰寫與調整。

 

目前網路上有Framework提供給大家去使用,這樣一來就可以省下許多設計的時間。以下介紹較熱門的三種RWD Framework。

1.Bootstrap

由Twitter出品,包含Javascript、CSS等...相關檔案,自由度高。

 

2.Foundation

由ZURB出品,推廣Mobile First的概念,適合以Mobile為優先考量的網站。

 

3.Pure

由Yahoo出品,單純只使用CSS,適合大量客制化的網站。如果需要Javascript Framework需要額外載入。

 

科技始終來自於人性,技術會因應人的需求去進化或改變。

RWD的出現,正是因為科技的進步而衍生出的技術。

讓人可以在不同裝置上瀏覽同一網頁,同時也可以有順暢的瀏覽體驗,這就是RWD的理念。

 

想跟我們談談你的網頁設計構想嗎?

 

 

網頁設計洽詢 >