你的網站響應式設計了沒?

響應式網頁設計-responsivedesign

你的網站響應式設計了沒?

在國內,響應式網頁設計已漸漸成為網頁設計的標準配備,沒有這項服務的網頁設計公司,我們可能都要給他一個不甚專業的評價了。

為什麼?因為一個再顯而易見不過的事實:低頭族不僅越來越多,而且低頭時間還越來越長。他們將原本花在桌上電腦前的時間,分給了行動裝置,重度者根本就是手機平板整天拿在手上滑。各位若有興趣,Google 這一份針對台灣行動上網消費者行為的研究報告證明這一切:51%的人擁有智慧型手機,87%的使用者會在手機上研究產品或服務,且37%的人曾使用手機購物!(這還是2013年的數據)

當越來越多人使用行動裝置,品牌基本該做的,就是提供一個能在行動裝置上瀏覽無礙的網站。而響應式網頁設計,就是目前最好的解決方案

當我們在探詢客戶需求時,即使客戶沒有提出這樣的需求,我們也會主動告知,響應式網站是我們網頁設計服務的基本配備,而你應該擁有一個響應式網頁設計的網站。很多客戶會接著問:

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

簡單來說,響應式設計的網站,能夠在不同裝置取得最適合的版面配置。即使你把手機橫過來轉過去,一個經過良好設計的響應式網站,也能隨著動作自動取得最佳的版面配置,不會有適應上的問題,也就是網站能自己適應不同的裝置營幕。這也是有人將 Responsive Design 翻譯為「自適應網頁設計」的原因。

重點是,這個技術是在「同一個網站」達成,它不需要另外再設計一個手機專用網站、還是另一個平板電腦專用網站… 這也是它為什麼會被翻譯成「自」適應網頁設計的另一個原因。

一次性開發,符合不同營幕需要

「同一個網站」意味著這項技術可以達到製作成本的降低,設計師不用再多花功夫「重新」設計另一個不同尺寸的網站,它只需要設計一次,不同的裝置平台都能共用:

一組網頁內容
一組HTML架構
一個網址URL

一次性的開發,就能符合多種營幕尺寸的需要。

響應式網頁設計的好處是?

除了製作成本的降低之外,因為所有版本網站都是同一個,你也不必另外再維護手機版網站,同一組網站內容將可以全體適用,你可以省下大量的維護時間成本。

從訪客的角度來看,響應式網站幫助你從更多不同裝置導入網站流量,你可以因此接觸到更多潛在訪客,並且重要的是讓他們擁有一次好的閱讀經驗,你不會希望手機訪客進來只因為瀏覽困難,馬上就閃退你的網站,這有害於你的搜尋引擎優化,也傷害了訪客對品牌的觀感,也因為網址唯一,搜尋引擎優化(SEO)的效果也會更集中,效果更好。

所以,你的網站只要一次性的開發,就可以:

  • 製作成本降低
  • 維護成本降低
  • 接觸到更多的潛在訪客
  • 讓他們擁有一次好的閱讀經驗
  • 降低跨裝置訪客的退出率
  • 搜尋引擎優化(SEO)效果更好

有響應式網頁設計的範例嗎?

當然有,本站就是。隨便舉一個平常沒事就在逛的WWE,也是響應式網站的好例子。看不過癮?不久前推薦給網頁設計師的15個靈感來源網站中,有更多的範例。例如, 這裡有得獎的響應式設計網站

當然,你不必非得用一台手機、一塊平板來看這些響應式網站的效果,由於你必須開啟瀏覽器才能觀看網頁,因此網站適應的是你開啟的瀏覽器尺寸,只要動手拉瀏覽器的兩側,改變寬度,你會看到版面隨著拖拉尺寸的同時,跟著改變配置,響應式網頁設計的驚奇就在此時發生。

你需要響應式網頁設計

在台灣,「跨裝置殘障」的網站相當多,其中不乏那些常用的服務或知名的大型網站,在此我們不需要特別點名,只要你們回想自己逛過的網站經驗就好,那些不堪使用卻在緊急需要時還得忍受那難堪的設計,你可能也有同樣的經驗,這說明響應式網頁設計在台灣還有相當大的空間。

因此,為什麼不為你的的品牌製作一個懂得回應訪客的聰明網站?而且只要一次性的設計,就好。

開始為你的品牌網站添加響應式網頁設計

響應式設計哲學:不只是介面設計

讓我們直白一點來看 Responsive Design 的翻譯,就是「回應設計」,回應也需要設計?又或者說設計本身就是在回應著誰?你究竟在為誰「設計」?拋開網頁設計這件事,響應式設計的哲學,不正是在告訴你,試著站在對方的立場給于適當、優雅的回應,而這不就是「設計」兩個字的本質?不論你是作家、講師、演藝人員、網頁設計師、還是品牌,你所做的一切總是在回應著你的觀眾,是不?

每每深入探討一個概念時,總會有萬流歸宗的感覺。

品牌的本質是一種情感的交流,尤其在動態環境下,品牌越來越像一個內容出版商,不斷提高推出內容的「頻率」時,品牌應該以什麼樣的「形式」、「姿態」回應你的觀眾?要怎樣因應不同情境變化而不偏離你的品牌本質?

站在你的觀眾立場(或員工、或社會),為每一個與品牌有關聯的角色,創造一個有回應力(Responsiveness)的組織文化,像個隨著瀏覽器縮放改變版面形式的響應式設計網站一樣,優雅、柔軟而有彈性的回應你的觀眾,而內在始終如一。

這是我們從響應式網頁設計得到的啟發。

喜歡我們的觀點?分享給你的朋友