早期的網頁大多以一般家用電腦或筆記型電腦的瀏覽者為主，在製作網頁時會以準確規格來設定網頁頁面的大小，比如1024x768；然而現今，有數十種不同螢幕尺寸規格，像是智慧型手機、平板、筆電和桌電…等等多種螢幕尺寸，網頁設計師常因為螢幕尺寸與比例太多，在網站的規劃與設計上產生很多不必要的困擾。

為了解決這樣的窘境，「RWD (Responsive Web Design) 」又稱響應式網頁設計、適應性網頁、自適應網頁設計、回應式網頁設計等多項名稱，自然成為新的網站設計趨勢，它用來解決目前多種螢幕尺寸，在瀏覽網頁所衍生出來的問題以並建置網站，讓網頁設計師有更多的方式去思考，如何將響應式網頁設計(RWD)應用在網頁上。

在「RWD響應式網頁設計」尚未普及化前，手機板網站也曾流行一小段時間，做為傳統網站與RWD網站的臨時解決方案，由於手機版網站使用上還是有不少缺點無法改善，現今使用「RWD」就可以用一個網站取代多種版本的網站方式，在製作上與網站的管理與維護上相對簡單許多，加上對於企業者來說可以省下不少的成本經費，，所以手機版網站已經漸漸被「RWD」取代。

「RWD響應式網頁設計」是以HTML 呈現的制作方法、針對PC、平版電腦、智慧型手機…等多種螢幕尺寸來呈現網頁最適化。不是針對設備製作専用的頁面，而是以瀏覽器的螢幕尺寸為基準，使用CSS3技術製作與調整，來應付各種螢幕尺寸的網頁製作方式，好讓使用者可以在舒適的狀態下瀏覽網頁。
簡單來說，透過CSS設定，網頁會適應裝置解析度的大小，自動變化網頁的寬度及頁面配置排版，讓使用者以最適合閱讀的方式呈現，並且也能縮短開發不同螢幕裝置的時間與成本問題。

傳統網頁VS響應式網頁

早期網頁對於行動裝置瀏覽的解決方法，除了製作電腦版網站外，還要另外設計手機版或平板專用的網站，但會產生網站內容要維護更新時，需同時維護多個網站；還有會有不同網址卻相同內容的狀況，可能造成網頁權重分散及重複內容問題，對於搜尋排名較為不利。

響應式網站(RWD)會根據不同的螢幕尺寸調整顯示效果，但仍使用相同的網址和網站內容。

為什麼必需要建置RWD網頁?

現今，使用行動裝置上網已經逐漸成為趨勢，以往傳統網頁設計中，無法滿足現有的行動瀏覽裝置，造成使用者在使用手機、平板上瀏覽困難，有可能放棄消費或者直接關閉網頁，因此，更需要建置RWD網頁。

一、使用者瀏覽方便
目前手機市場品牌林立，平板與筆電使用率也逐漸上升，各大商家都推出自己的螢幕尺寸，導致螢幕尺寸沒有統一規範，因此，傳統網頁設計模式無法因應多螢幕尺寸的需求；使用「RWD響應式網頁設計」方式，可以讓網頁內容隨著螢幕大小，伸縮、變化、隱藏、移動；讓螢幕較小的手機，隨著螢幕尺寸，將網站自動改變網站排版變成下拉式模式，隱藏較為不重要的內容，讓使用者在上網、搜尋、瀏覽的同時更加輕鬆方便。

二、成本與時間減少
許多商家會使用APP來作為行動裝置的曝光方式，但是APP製作成本較高、難度不如網頁來的簡單、加上曝光方式有限；相較於「RWD響應式網頁設計」，在製作方面比APP來快速，價格上也便宜許多，而且開發一個網站，就可以跨平台使用，解決多種在裝置瀏覽上的問題；也相對減少網站管理的時間，因此，節省下許多時間與金錢的成本。

三、有利於網路行銷
所有的網路行銷都需要網站作為連結對象，如關鍵字廣告、部落客分享文、FaceBook、Line、App訊息推播等，有了響應式網站就是增加行動用戶訂單的機會。

四、提升關鍵字搜尋排名
GOOGLE極力推廣網頁以「RWD響應式網頁設計」方式製作，提升行動優化的網站在搜尋引擎上的排名，而未提供行動版的網站，排名將逐漸下滑。

看完這些，是不是對RWD的網站有初步的理解與認識了呢? 如果您的企業需要一個高品質的網站來推展您的產品，增加企業形象，歡迎看看我們的成功案例，我們可以提供更專業的諮詢，協助您們用最適合、最划算的方式來達成目標。

可瑞特設計案例參考