先建立測試矩陣
從真實流量、產品受眾及業務重要性選擇裝置,不必追逐每一款手機。每個測試組合至少記錄 viewport、方向、作業系統設定檔、瀏覽器及裝置像素比。
優先覆蓋首頁、導覽、表單、登入、付款或主要轉換頁,再加入內容最長、圖片最多及元件最複雜的頁面。
- 小型手機:375px 左右
- 標準/大型手機:390–430px
- 平板:768–1024px
- 手提與桌面:1280、1440、1920px
逐層檢查,不要只看外觀
先檢查結構,再檢查互動和內容。版面正確不代表可用:鍵盤焦點、觸控目標、錯誤訊息、虛擬鍵盤及旋轉後狀態都可能出問題。
- 沒有橫向捲動或被裁切內容
- 導覽、對話框及下拉選單可操作
- 表單標籤、驗證及送出狀態清楚
- 圖片不失真,文字縮放後仍可閱讀
- 核心操作在慢速網絡下仍有回應
以風險決定真機測試
Viewport 預覽適合快速找出版面問題,但不能完全取代 Safari、Chrome 或 Samsung Internet 的真實引擎。涉及相機、檔案上載、付款、登入、定位或軟鍵盤時,必須使用真機或受控雲端裝置再測一次。
留下可交付的問題記錄
每個問題應包括網址、尺寸、方向、瀏覽器、重現步驟、預期結果、實際結果及嚴重程度。修正後在原組合重測,並加一個相鄰尺寸避免只修好單一斷點。