症狀 → 改版後不確定先查哪些頁面：先按買家購買路徑檢查首頁、商品頁、目標市場預覽與購物車，再記錄問題並安排複測。
最快解法 → 用 Safari Responsive Design Mode 快速查看視口變化；它不能代替真實 macOS Safari 頁面檢查，也不能證明交易已測通。團隊沒有可用的 macOS Safari 環境時，再評估遠端 Mac，不必為每個頁面先購置設備。
這篇指南適合準備改版、上新或調整市場頁面的跨境賣家與 Shopify 獨立站營運人員。
如果你收到 Safari 錯位、商品選項無法操作或流程不順的回報，也能用文中的記錄方式區分頁面、主題與交易設定問題。
SECTION 01Safari 兼容性測試 2026：先按購買路徑安排頁面
不要把每個頁面都當成同等優先。先挑會影響買家找到商品、理解商品和開始購買的頁面；至於低流量內容頁，可等主要流程核對後再抽查。
開始前先建一份頁面清單，寫明頁面網址、目標市場、語言、本次變更內容、檢查人及複核狀態。尤其要標記測的是草稿主題預覽，還是已發布頁面：兩者的主題狀態不同，草稿預覽不能直接代表線上買家當下看到的頁面。Shopify 官方說明了未發布主題的預覽方式。
| 頁面場景 | 優先核對內容 | 何時提高優先級 |
|---|---|---|
| 首頁 | 導覽、搜尋入口、促銷橫幅、主要圖片與關鍵連結 | 改版、首頁活動或導覽調整後 |
| 商品頁 | 圖片切換、規格選項、售罄狀態、加入購物車提示 | 上新、改商品資料或調整商品區塊後 |
| 目標市場頁 | 預覽國家或地區、語言、幣別及頁面狀態 | 新增市場或本地化內容後 |
| 購物車 | 商品、數量、折扣顯示及前往結帳的流程 | 調整購物車功能或促銷規則後 |
Shopify 獨立站怎麼測 Safari 頁面顯示？
在 Shopify 主題預覽中開啟本次要驗收的頁面，再用 Safari 檢查可見內容與操作。不要只看一張截圖：確認導覽能否展開、連結是否可操作，並記下從哪個頁面、哪個入口走到問題位置。
首頁可先測買家進站後最常用的入口，包括導覽、站內搜尋、主視覺連結與促銷橫幅。若出現圖片裁切、文字重疊或按鈕難以點選，記錄網址、主題狀態、瀏覽器環境及重現步驟；只有截圖通常不足以判斷是頁面樣式、素材尺寸還是互動程式造成。
注意：主題預覽、已發布頁面與不同市場條件不是同一測試對象。記錄時把目前狀態寫清楚，否則協作者可能在不同主題或市場下重現，得到不同結果。
SECTION 02商品頁要檢查選項、庫存與購買入口
商品頁測試要用實際商品資料操作，不要只檢查版面是否完整。逐一確認圖片切換、規格選擇、售罄提示、加入購物車後的回應，以及頁面捲動後購買入口是否仍按預期呈現。
商品頁在 Safari 上選不了變體，先查哪些地方？
先確認該商品在目前主題狀態和市場條件下是否有可購買的規格，再重新操作選項並記錄結果。若商品本身售罄、選項沒有對應庫存，或提供規格選擇的應用程式未正常載入，頁面表現可能與 Safari 相容性無關。
排查時按這個順序留證：
- 記錄商品頁網址、主題是預覽版還是已發布版，以及測試市場和語言。
- 記下商品與規格狀態，遮蔽不需要交接的個人或訂單資料。
- 重做選項選擇，觀察是否有售罄提示、畫面更新或加入購物車訊息。
- 以相同商品與市場條件重測，確認異常能否重現。
- 若只有特定商品出問題，先核對商品資料與庫存；若同一主題區塊在多個商品重現，再交由主題維護協作者檢查。
Safari 的 Web Inspector 可用來檢查網頁；若團隊需要查看頁面層級的異常，可參考 Safari Web Inspector 與開發者工具說明。這類檢查有助定位頁面問題，但不能單憑一次顯示異常推斷平台資格、商品狀態或交易結果。
SECTION 03目標市場預覽須核對地區與語言條件
面向不同國家或語言銷售時，要把預覽條件當作測試的一部分。Shopify Markets 用於管理市場設定；開始複核前，先在記錄中寫下本次要檢查的市場和語言，再確認預覽連結及頁面狀態。可對照 Shopify Markets 市場設定說明 與市場本地化設定說明。
怎麼確認主題預覽適用於目標國家和語言？
預覽時核對選定的市場或地區、語言，以及頁面上實際顯示的內容；需要驗證幣別時，也要記下該頁面的幣別顯示。不要只記「已測美國」之類的概括描述，應保存使用的預覽連結及頁面狀態，讓同事能照同一條件重現。
市場預覽只說明你核驗的頁面條件，不能據此推斷所有買家、帳號或網路環境都會看到相同內容。若問題只在特定地區出現，先保留該市場的預覽條件，再與其他市場分開檢查，避免把本地化內容差異誤判成瀏覽器故障。
SECTION 04回應式預覽、Safari 複測與交易測試各有用途
| 檢查方式 | 適合回答的問題 | 不能單獨證明的事 |
|---|---|---|
| Safari Responsive Design Mode | 版面在不同視口下如何變化、元素是否明顯錯位 | 真實設備上的完整呈現與互動 |
| macOS Safari 頁面複測 | 目前 Mac 上的 Safari 是否能重現頁面異常 | 所有買家裝置、市場或網路都會有相同結果 |
| Shopify 主題預覽 | 草稿主題指定頁面的顯示與操作 | 已發布頁面或其他主題狀態的表現 |
| 測試訂單或支付測試模式 | 按適用方式核對結帳測試流程 | 真實付款已完成，或所有支付情境均通過 |
Safari 回應式預覽能代替真實設備測試嗎？
不能。Responsive Design Mode 適合快速觀察不同視口下的頁面變化，但 Apple 說明這類預覽並不完全等同實際設備的呈現與行為；因此應把它當作早期排查工具，而非真機或實際 Safari 環境的完整替代。可參考 Apple Responsive Design Mode 文件。
真實 macOS Safari 複測則是另一個環節：它能確認指定 Mac 和瀏覽器條件下，問題能否重現，但仍不能代表所有買家設備。若檢查涉及付款，頁面能開啟或購物車能顯示，不等於支付已驗證；請依適用方式進行測試訂單，並對照測試訂單處理流程及支付測試模式說明。
Safari Responsive Design Mode、macOS Safari 頁面複測、主題預覽與測試訂單應分開記錄。把它們統稱為「Safari 已測」會讓團隊無法確認究竟檢查了版面、主題狀態，還是交易流程。
SECTION 05購物車與結帳流程要分開驗收
在購物車中核對商品內容、數量調整、折扣呈現，以及前往結帳的頁面流程。每項操作都要記錄預期結果和實際結果，例如數量改變後顯示是否更新、折扣是否出現在預期位置、按鈕是否能進入下一步。
如果任務只要求頁面複核，就不要把支付結果當成驗收結論；如果任務包括交易流程，則使用適用的測試方式，並寫清楚測到哪個流程節點。這樣能把「購物車顯示不符」和「支付測試未完成」分開交接，避免把兩種問題混在同一張缺陷單。
SECTION 06把異常整理成可重現的複核紀錄
收到回報或複測失敗時，先整理證據，再決定要交給主題協作者、平台支援，還是安排真實 macOS Safari 環境核驗。每筆紀錄至少包含以下資料：
| 記錄欄位 | 寫入內容 |
|---|---|
| 頁面與狀態 | 頁面網址、草稿預覽或已發布頁面 |
| 測試條件 | 目標市場、語言、瀏覽器與 macOS 版本 |
| 變更資訊 | 主題版本或狀態、本次修改內容 |
| 問題證據 | 預期結果、實際結果、重現步驟及必要截圖 |
| 初步分流 | 商品資料、主題顯示、應用程式功能或交易設定待查 |
可依下列流程執行並交接：
- 選定本次要驗收的首頁、商品頁、市場頁或購物車，列出改動項目與負責複核的人。
- 固定測試條件：確認主題狀態、預覽連結、目標市場及語言，避免不同人使用不同條件測試。
- 先用 Safari 查看頁面，再用 Responsive Design Mode 觀察視口變化；把兩種檢查結果分開記錄。
- 按頁面場景操作導覽、商品選項、購物車與前往結帳的入口，不以「頁面已載入」代替互動驗收。
- 發現異常時，記錄瀏覽器與 macOS 版本、預期和實際結果、重現步驟及截圖；截圖前遮蔽個人資料。
- 在相同條件下複測一次，並比對草稿主題與已發布頁面是否為同一測試對象。
- 根據證據分流：商品狀態問題先查商品資料；頁面區塊問題交主題協作者；交易流程問題依測試訂單與支付設定另行核對。
如果團隊只有其他瀏覽器或視口模擬工具，無法完成真實 macOS Safari 複測，就先明確標記「尚未以 macOS Safari 驗證」，不要把模擬結果寫成已通過。你也可以先查看 MACNOX 的遠端 Mac 環境資訊，再按測試週期與所需連線方式判斷是否適合使用。
只有在問題確實需要 macOS Safari 才能確認時，遠端 Mac 才能補上實際頁面複測這一環。相較於單靠回應式預覽或臨時借用設備，前者無法確認真實 Safari 的指定頁面表現；後者則可能難以固定瀏覽器與測試條件，重現和交接也較不穩定。不過，遠端 Mac 同樣不能模擬所有買家設備、市場或網路，也不會改變平台資格、帳號狀態或交易結果。若你已確認需要這類複測，可依團隊週期查看 MACNOX 方案資訊，再評估是否需要美國節點的遠端 Mac；若測試需要實體裝置或長期固定負載，則應先評估自有設備是否更合適。