在還沒講解什麼是響應式網頁之前,我們可以先來測試看看你的網頁是否響應了嗎?我們可以透過google給的一套工具 (https://www.google.com/webmasters/tools/mobile-friendly/),這套工具就可以幫助你知道你 的網站是否符合響應式網站了。
什麼是響應式 網頁設計 ？維基百科將其定義為“一種方法，網頁設計，旨在各具特色的站點，從而提供一個最佳的視覺體驗，方便閱讀和導航用最少的縮放，平移和滾動，在廣泛的設備 （從電腦顯示器到手機）。“RWD的主要優點是，它允許一個URL和單個內容源。一個RWD網站可以為任何設備或螢幕大小，這樣你就不會需要設計手機，平 板電腦和桌面設備不同的網站。
其實Google經常提供一些建議給網頁設計師和開發人員，使他們能夠優化他們的網站為搜索引擎的算法和搜索引擎優化的目的。
GOOGLE建議“網站管理員遵循使用的網頁設計，即服務於相同的HTML的所有設備，使用媒體查詢來決定每個渲染設備上的行業最佳實踐。”為了把這個成更基本的語言，GOOGLE建議使用媒體查詢，形成RWD的骨幹部分。媒體查詢允許網站，以適應任何螢幕尺寸。
以下這三種基本配置是GOOGLE極力推薦你去做響應式網頁的方法。
1.使用響應式網頁設計的網站，服務於所有的設備在同一組URL，每個URL服務於相同的HTML到所有設備和使用CSS只是改變頁面如何在設備上呈現的即點。這是谷歌的推薦配置。
2.站點動態提供的所有設備在同一個組URL，但每個URL提供不同的HTML（和CSS），這取決於用戶代理是否是台式機或移動設備。
3.有一個獨立的移動和桌面網站站點。
其實google有一個響應式網站,倒是可以幫助你達到以上這3種方法,請參考以下GOOGLE的說法
https://developers.google.com/webmasters/mobile-sites/
接下來最重要的是響應式網頁最好之後記得要裝上中繼標記喔!請把以下的碼裝在你的網頁上
<meta name="viewport" content="width=device-width, initial-scale=1.0″>
為什麼要加上中繼標記以下是google的說法
中 繼檢視點標記能指示瀏覽器如何配合裝置的寬度調整網頁大小和縮放比例。如未提供中繼檢視點元素，行動瀏覽器的預設是以電腦版螢幕的寬度來轉譯網頁 (雖然因裝置而異，但一般約為 980px)。行動瀏覽器隨後會嘗試加大字體，並且選擇將內容縮放至符合螢幕的大小，或者僅顯示與螢幕大小相符的部分內容，藉此讓內容更容易閱讀。
對使用者而言，這代表字體大小可能不一致，且使用者可能需要輕按兩下或使用雙指撥動縮放，才能查看及使用內容。對 Google 而言，由於網頁要求在行動裝置上進行這類互動，我們可能無法判斷網頁是否適合行動裝置使用。
參考資料：
1石恩綸（2000）。女性網路使用者的網站印象與網路使用行為。
2周家瑜（2003）。網站體驗對使用者信任、情感與行為意圖影響之研究。
3悠立科技(民98)。SEO 搜尋引擎最佳化 與PPC 點擊付費的比較分析。
資料來源：alltradelead
請先 登入 以發表留言。