現在幾乎每一個建站平台、每一套佈景主題都會標示自己是「響應式」，但這幾個字只代表版面會隨螢幕寬度調整，不代表手機上好不好用。真正的差距，往往要等到換上自己的標誌、自己的選單、自己的產品表格之後才會浮現。rwd網站架設要少走冤枉路，關鍵在於挑選平台與主題的階段就先驗出行動版的品質，上線後再用工具與實機持續盯著。這篇聚焦在這三個階段：挑選時怎麼判斷、客製時怎麼不把它弄壞、上線後怎麼監控；至於斷點與排版的技術細節、驗收清單與舊站改版決策，站上已有其他文章說明。
先弄清楚：行動版是誰在控制
不同的建站方式，手機版的主導權在不同的人手上。租用型的建站平台，行動版的呈現大多由平台決定，你能調整的是平台開放的選項；有些平台允許另外編輯手機版的版面，看起來很方便，實際上等於同時維護兩份版面，改了桌機版還得記得回頭改手機版。開源內容管理系統搭配佈景主題時，行動版的品質主要取決於主題本身；如果再加上頁面建構工具，往往又多了一層「逐一元件設定手機、平板、桌機」的選項。
所以評估時要問的，不只是「有沒有響應式」，而是「手機版的調整是全站一致的規則，還是要逐頁、逐個元件設定」。逐項設定的自由度越高，短期越能調出想要的樣子，長期卻越容易失控：頁面一多，每一頁的手機版都有自己的例外，日後改版時很難全部照顧到。對內部沒有專職人員維護的中小企業來說，規則一致通常比自由度高來得重要。
別只看示範站，要用「你的內容」測
示範站是精心布置過的：標題短、照片比例完美、選單只有五六項、沒有任何一張大表格。拿示範站在手機上看，幾乎每一套都很漂亮，這也是為什麼很多人買了主題之後才覺得「怎麼跟看到的不一樣」。比較可靠的做法，是在測試環境或平台的試用期內，用自己最難處理的內容做一個試用頁。
- 最長的公司名稱與實際的標誌檔，看頁首在窄螢幕上擠不擠得下
- 實際的選單項目數量與層級，而不是示範站那幾個
- 最長的產品或服務名稱、最長的一句標題
- 一張真實的規格表或產品比較表
- 直式與橫式混在一起的照片，以及一段比較長的說明文字
把這個試用頁放到手機上從頭滑到尾，問題會比看十個示範頁更快浮現。中文標題斷在奇怪的位置、表格把頁面往右撐開、標誌被壓得很小，這些都是示範站不會讓你看到的狀況。
行動版選單與表單：手機上最常出事的兩個地方
選單要測的不只是能不能收合。多層選單在觸控裝置上有一個常見的陷阱：父層項目本身是一個連結，同時又要負責展開子選單，手指點下去到底是進入頁面還是展開下一層，不同主題的處理方式差很多，有些甚至讓子選單永遠點不到。另外也要看目前所在的頁面有沒有標示、選單打開後能不能輕鬆關閉、項目很多時能不能在選單內捲動，而不是整個畫面一起動。
表單則是轉換發生的地方，值得逐欄測試。電話欄位點下去，手機是否叫出數字鍵盤；電子郵件欄位是否出現方便輸入的鍵盤；瀏覽器的自動填入能不能用；填錯時，錯誤提示是出現在欄位旁邊，還是被跳出來的鍵盤擋住；驗證機制在小螢幕上是否操作得了；送出按鈕會不會被固定在畫面底部的浮動列蓋住。頁面上的電話號碼，也要確認點一下就能撥號。
圖片有沒有依裝置載入適當尺寸，業主也查得出來
有些主題在手機上把圖片顯示得小小的，背後下載的卻是原始的大檔案，畫面看起來沒問題，手機使用者卻在默默等待。這件事不需要會寫程式也能初步檢查：在電腦的瀏覽器開啟開發人員工具，切換成手機的模擬尺寸，打開網路請求的面板並只顯示圖片，重新整理後看看每張圖片的檔案大小是否合理。另一個簡單的方法，是在手機上把某張圖片用新分頁開啟，看它的實際尺寸是不是遠大於螢幕需要。
也可以查閱主題或平台的說明文件，確認上傳圖片時是否會自動產生多種尺寸，並依螢幕寬度提供合適的版本。特別要留意兩類元件：由主題設定的背景圖，常常沒有依裝置切換尺寸；首頁的輪播，則可能一次把所有圖片都下載完。這兩者是行動版變慢的常見來源。
行動版速度：實驗數據與真實數據都要看
Google提供的網頁速度檢測工具可以選擇行動裝置模式，對示範頁與自己的試用頁各測幾次，比較結果。要知道工具上會出現兩種數據：一種是在模擬環境下測出來的實驗數據，每次都測得到，但會有波動；另一種是真實使用者累積的數據，只有在網站有足夠流量時才會出現，新網站或試用頁通常看不到。挑選階段主要依靠前者，所以要多測幾次、看趨勢，而不是被單一分數左右。
分數之外，更實在的是自己拿手機，關掉無線網路改用行動網路，打開試用頁，看要多久才能讀到第一屏的內容、點得到按鈕；字型或圖片載入時版面會不會跳動。主題如果內建大量動畫與特效模組，先把用不到的關掉再測一次，差距通常很明顯，這也能看出主題是否允許你只載入需要的部分。
購買主題或簽約前的檢查清單
把前面幾段濃縮成一份清單，在rwd網站架設正式動工之前逐項確認，比事後補救省事得多。
- 用自己的內容做過試用頁，並在手邊不同尺寸的手機上實際滑過
- 多層選單在觸控操作下能正常展開、收合與關閉
- 表單欄位會叫出對應的鍵盤，錯誤提示看得到
- 圖片會依螢幕寬度載入較小的檔案，輪播與背景圖也確認過
- 行動版速度測過不只一次，關掉不用的模組後也測過
- 手機版的調整方式是全站規則，而不是只能逐頁設定
- 主題或平台近期仍有更新紀錄，說明文件寫得清楚
客製之後，怎麼避免把響應式弄壞
很多網站在rwd網站架設之初手機版沒問題，是在客製過程中一點一點被弄壞的。常見的原因有：自訂樣式裡寫了固定的像素寬度；直接貼上外部服務的嵌入碼，而那段碼寫死了尺寸；在頁面建構工具裡為了修一個小地方，逐一覆蓋各裝置的設定，久了沒人記得哪裡改過；安裝好幾個會在畫面上浮出按鈕或視窗的外掛，全部擠在手機畫面的底部；調高頁首的高度，讓手機第一屏只剩一半能看內容。
防範的原則並不複雜：能用主題設定或全站樣式解決的，就不要逐頁覆蓋；每做一項客製，就在窄、中、寬三種寬度各看一次；手機畫面上的浮動元素限制在一兩個以內；把客製的項目與位置記在一份紀錄裡，主題更新後照著紀錄逐項檢查。這份紀錄也會讓日後接手的人少花很多時間。
上線之後，用工具與實機定期監控行動版
rwd網站架設完成、正式上線以後，行動版的表現要開始用真實數據來看。Google Search Console的網站使用體驗核心指標報告，會把行動裝置與電腦分開呈現，並把狀況相近的網址歸成一組；當某一組出現問題，通常代表是同一個版型造成的，修一個版型就能改善一整批頁面。流量較小的網站在這份報告裡可能暫時看不到資料，這時更要靠定期的實機巡檢補足。流量分析工具則可以依裝置比較停留、互動與詢問的狀況，如果手機使用者的詢問明顯偏少，表單往往是第一個要檢查的地方。
工具之外，實機巡檢也要排成固定的習慣：每月用手機走一次首頁、主要服務頁與詢價流程，並實際送出一次表單；每次更新主題、外掛或平台設定之後，再照同樣的路徑檢查一遍。新的裝置尺寸會持續出現，這種定期巡檢比一次性的完美測試更能維持長期品質。
常見問題
標示「響應式」的佈景主題，手機版就一定沒問題嗎？不一定。響應式只代表版面會隨寬度調整，選單在觸控下好不好用、圖片有沒有依裝置載入、行動版速度快不快，都要用自己的內容實際測過才知道。
建站平台可以另外編輯手機版版面，這樣比較好嗎？短期調整很方便，但等於同時維護兩份版面。內容經常更新、又沒有專人維護的網站，比較適合選擇手機版規則全站一致的做法，只在少數關鍵頁面做例外調整。
網站上線後，多久要檢查一次行動版？建議至少每月用手機走一次主要頁面與表單，另外在每次更新主題、外掛或新增版型之後立即檢查，並定期查看搜尋引擎工具裡的網站使用體驗報告。
行動版速度分數很低，一定要換主題嗎？不一定。先檢查圖片尺寸、輪播、用不到的功能模組與外掛數量，這些往往是主因；調整之後仍然明顯偏慢，再評估主題本身是否過重。
如果你正在挑選建站平台或佈景主題，或是網站已經上線、卻不確定手機版表現如何，可以先讓專人幫你看一次現況。創昇SEO提供免費網站健檢，會檢視行動版的版面、速度與基礎設定，指出比較需要優先處理的地方。
我們也提供全台免費到府解說，用實際的手機畫面把檢視結果講清楚，讓你在決定要調整主題設定、減少外掛，還是另選平台之前，手上有足夠的資訊可以判斷。