響應式網頁設計(RWD)是什麼?

為何這會是網站是否吸引人的關鍵?

RWD,意思是響應式網頁設計,全名為Responsive Web Design,又稱自適應頁面設計網站、適應式網頁設計、回應式網頁設計。這項技術於2011年由Ethan Marcotte發明,是目前公認網頁設計開發技術的趨勢。

人手一機的時代,2013年,行動平台佔網站總瀏覽量大約3-4成,2017年,這個數字已經來到超過5成,當手機的瀏覽體驗不夠順暢時,很容易導致用戶流失。 因此,除了電腦版網站外,許多公司、企業、商家也紛紛製作起手機版網站。 由於分屬兩個不同的系統,若是網站有資訊要更新,電腦版與手機版的網站則必須個別更新、無法同步,若是要大改網站,就得耗上更多功夫。

RWD網站跟手機版網站的差別在於,RWD網站使用CSS3、以百分比的概念,打造彈性的畫面排版、設計、尺寸,即便使用不同設備,也能顧及網站美觀與瀏覽速率,提供使用者最佳瀏覽體驗。

電商,網頁設計,墾丁美人魚學校,電子商務
自適應頁面 設計網站 ,符合電腦、平板及手機平台的網站

RWD網頁設計的優點

一是「價格」,開發與維護成本低,一個系統搞定所有瀏覽裝置,讓使用者輕鬆閱讀網頁上的內容,不需要再騰出兩隻手指頭放大、縮小螢幕控制尺寸;二是「方便」,即便網站更新,也能輕鬆搞定,解決電腦版與手機版網站無法同步的問題;三是「對SEO有好處」,降低網頁跳出率(Bounce Rate),提升網頁可用性(Usability),是目前Google最喜歡的網站設計。

是時候不妨檢視,您的網站是否符合現在的設計趨勢?
是否夠貼近消費者的購物行為?
使用Google所推薦的RWD技術,打造最適合您的網頁。

RWD網頁設計範例與參考