有品牌商拿他們的商品頁給我看，是在筆電上開的，版面漂亮、大圖精緻、資訊排得很有條理，他很得意。我請他掏出手機、用 4G 網路連自己的網站看看，他滑了兩下臉就綠了——首圖跑掉、字要放大才看得清、加入購物車的按鈕被一個訂閱電子報的彈窗蓋住，載入還轉了老半天。問題是，他們家大約有八成的訂單來自手機，換句話說，這個他從來沒認真在手機上看過的版本，才是真正在做生意的那一個。
這幾年做電商代營運，我最常提醒品牌的一句話是：不要用你上班時的螢幕，去想像客人買東西的樣子。台灣的行動流量佔比通常落在七到八成之間，某些品類（美妝、服飾、食品）甚至更高，客人多半是躺在沙發上、通勤路上、或是睡前滑手機時看到你的商品。可是很多網站的設計決策，是在一台 27 吋的桌機螢幕前拍板的，設計師和老闆看到的是一個滑鼠精準點擊、網路飛快、視野開闊的世界，跟客人真實的處境差了十萬八千里。這篇文章想把行動電商優化這件事講透：不是把桌機版縮小塞進手機，而是從手機的使用情境重新想一遍。
桌機思維為什麼會漏單
先講清楚一個觀念：手機不是桌機的縮小版，它是完全不同的使用情境。桌機前的人通常坐著、專注、雙手能用、網路穩定、螢幕大；滑手機的人多半是單手操作、注意力被切成碎片、隨時可能被 LINE 訊息打斷、網路品質時好時壞、螢幕就那麼一小塊。你用桌機的邏輯去設計，等於預設了一個根本不存在的客人。
漏單通常漏在幾個地方。第一是資訊密度。桌機一個畫面能塞下的東西，硬搬到手機上就變成要滑十幾次才看得完，客人還沒滑到「加入購物車」就先累了。第二是操作精度。滑鼠游標可以精準點到幾像素大的連結，手指不行，一根拇指的接觸面積大約是七到十毫米，太小太密的按鈕不是點不到就是點錯。第三是耐心。桌機使用者願意等，手機使用者不願意，載入慢個兩三秒，人就滑走了。
我看過最典型的案例，是一個把桌機版「響應式」直接壓縮到手機的網站。技術上它確實能在手機開，圖文都在，但每個環節都差一點：字小一點、按鈕擠一點、載入慢一點、彈窗煩一點，單看每一項都不算致命，加起來就是轉換率只有同業的一半。行動優化的重點，往往不是修好一個大 bug，而是把這種「每個環節都差一點」的累積傷害一項一項補起來。這跟我在電商轉換率優化那篇談的漏斗思維是一樣的：每一層漏一點，乘起來就很可觀。
行動版最常見的四個體驗殺手
我幫品牌做行動版健檢時，有一份固定的清單，最常抓到的問題就這四個。
第一，字太小。很多網站的內文字級在手機上只有 12 或 13 像素，看起來「精緻」，但客人得瞇著眼或用手指放大才讀得動。行動版的內文字級我通常建議至少 16 像素起跳，行距拉開到 1.5 倍以上，重要資訊（價格、優惠、規格）該大就大，不要為了排版好看犧牲可讀性。手機螢幕小，留白和字級是你少數能幫客人減輕負擔的工具。
第二，按鈕難點。這是行動版最容易被忽略的細節。按鈕的可點擊區域我會要求至少 44×44 像素（這也是 Apple 和 Google 的官方建議值），按鈕跟按鈕之間要留夠間距，不然客人的拇指很容易誤觸。最要命的是把「加入購物車」「立即購買」這種關鍵按鈕做得又小又不明顯，或是放在要滑很久才到得了的位置。這些主要行動按鈕，在手機上應該是整個畫面最顯眼、最好點的元素。
第三，彈窗擋畫面。桌機的彈窗還有個叉叉好按，手機的彈窗常常是那個關閉的小叉叉小到點不到，或是客人一進站、商品都還沒看到，就被一個「訂閱享 9 折」的全螢幕彈窗擋住去路。Google 早就明講過，在行動版用侵入式的插頁廣告（intrusive interstitial）擋住主要內容，是會影響搜尋排名的。彈窗不是不能用，但時機、大小、關閉的難易度都要為手機重新設計，別讓一個想收 email 的彈窗，趕走一個想買東西的客人。
第四，載入慢。這一項我後面會單獨展開，但先點出來：手機的網路和運算能力都比桌機弱，你在桌機上覺得「還好」的載入速度，到了客人的中階手機加上不穩的行動網路，體感可能是兩三倍慢。速度這件事我一向看得很重，細節可以參考網站速度與 Core Web Vitals那篇。
拇指可及區與單手操作
這是一個很少被認真對待、但影響很大的概念。你觀察一下自己怎麼用手機——絕大多數時候是單手，拇指在螢幕上滑動。手機螢幕越做越大，但拇指能輕鬆搆到的範圍就那麼大，大致是螢幕下半部、偏向持機那一側的一塊弧形區域。螢幕的左上角、右上角這些地方，單手根本搆不到，得換手或用另一隻手。
這對設計的意涵很直接：客人最常按、最重要的操作，應該放在拇指最容易搆到的地方，也就是畫面的中下段。這也是為什麼現在很多購物網站的「加入購物車」「結帳」按鈕會做成固定在螢幕底部的懸浮列（sticky bar），客人不管滑到哪，那顆按鈕永遠在拇指下方等著。反過來說，把關鍵按鈕塞在右上角，等於是刻意增加客人購買的物理成本。
單手操作還有一個延伸：減少客人需要「打字」的機會。手機打字慢又容易錯，每一個需要手動輸入的欄位，都是一道流失的關卡。這一點在結帳流程上尤其關鍵，下一段細講。行動版的電商網站 UX 設計，本質上就是不斷問自己：這個動作，客人用一根拇指做得順嗎？
行動版結帳的簡化
結帳是行動版最痛的地方，也是最值得投資的地方。桌機上填一長串表單還能忍，手機上每多一個欄位、每多一個步驟，流失就往上跳。我做過的案子裡，光是把行動版結帳流程簡化，購物車放棄率就能明顯下降。
幾個我一定會檢查的重點。第一是自動填入。善用瀏覽器和作業系統的 autofill，姓名、地址、信用卡都讓系統自動帶，欄位要正確標註 autocomplete 屬性，客人才不用一個字一個字打。輸入電話、郵遞區號這類純數字欄位時，記得把鍵盤類型設成數字鍵盤，別讓客人還要自己切換。
第二是行動支付。這是行動版的巨大優勢，一定要用好。Apple Pay、Google Pay、LINE Pay、街口這些，客人一鍵就能用已存的付款資訊完成付款，不用掏卡輸號碼。把這些行動支付放在結帳流程最顯眼的位置，很多時候客人根本不會走到填卡號那一步。付款環節的設計細節，我在電商結帳流程優化裡談得更完整。
第三是免註冊結帳（guest checkout）。強迫客人先註冊會員才能買，是行動版的頭號流失來源之一。手機上要客人想帳號、設密碼、收驗證，這一串下來走掉一半人很正常。正確的做法是讓客人先用訪客身分把東西買完，付完款之後再問「要不要順手把這次的 email 設成會員」，這時候他已經是你的客人了，願意留下資料的機率反而高得多。
第四是進度感。行動版螢幕小，客人看不到全貌容易焦慮，結帳流程最好給清楚的步驟指示（第 1 步、第 2 步、共幾步），讓他知道還要多久結束。每一頁只問必要的資訊，能合併的步驟就合併，能省的欄位就省。整體邏輯跟商品頁 CRO是一貫的：降低每一步的認知和操作負擔。
圖片與影片在行動版的取捨
視覺是電商的命脈，但在行動版，圖片和影片是速度的頭號敵人，這裡要做取捨。
圖片方面，第一件事是格式和尺寸。用 WebP 或 AVIF 這類新一代格式，檔案能比 JPEG 小很多而品質不減。更重要的是別把一張桌機用的 2000 像素大圖，原封不動丟給手機——客人的螢幕根本用不到那麼多像素，卻要為此下載一大包資料。正確做法是用響應式圖片（srcset），依裝置提供合適尺寸。首圖以外的圖片用懶載入（lazy loading），客人滑到才載，不要一進站就把整頁的圖全部塞下去。
影片要更小心。自動播放的背景影片在桌機上很有氣勢，在手機上卻可能吃掉客人的行動數據、拖慢載入、還耗電。我的建議是行動版預設不自動播放大影片，改用一張輕量的封面圖加播放鍵，客人想看再點。真的要放影片，也要壓好碼率、別讓它擋在關鍵資訊前面。記住手機客人的核心需求是「快速看到商品、快速下單」，任何拖慢這件事的華麗元素，都要重新評估值不值得。
取捨的原則其實很簡單：手機客人買的是商品，不是你的網頁工藝。清晰的商品圖、看得懂的規格、明確的價格和按鈕，比任何炫技的動畫都重要。
App 還是行動網頁？
品牌常問我要不要開發自己的 App。我的答案幾乎都是：先別急。
開發和維護一個 App 的成本很高，iOS 和 Android 兩套要各自維護，還得說服客人特地去下載、佔他手機空間。對大多數中小品牌來說，把有限的資源砸在 App 上，投報率通常不如把行動網頁做到極致。行動網頁的好處是：客人點連結就能用、不用下載、SEO 找得到、社群分享一點就開，導流的摩擦力最低。
那什麼時候該考慮 App？我的判斷標準是「回購頻率」。如果你的品類是客人會高頻回購、重度使用的（例如生鮮外送、訂閱制、會員經營很深的品牌），App 帶來的推播通知、更順的重複購買體驗，才划算得起來。這跟訂閱制與經常性收入的經營邏輯是相通的：有高黏著度的關係，才撐得起 App 的投入。如果你只是一年被想起幾次的品類，把 PWA（漸進式網頁應用）或行動網頁做好，效益遠比 App 實在。
行動版的速度優化重點
速度在行動版是生死線。前面提過，手機的網路和硬體條件都比桌機差，同樣的網頁，行動端的載入體感通常更慢。而每慢一秒，跳出率就往上竄。
幾個施力點。首先是控制首屏載入，也就是客人一進站、還沒滑動時看到的那個畫面要最快出現，把首圖、標題、主要按鈕優先載入，其他的往後排。第二是壓縮和精簡，圖片壓好、程式碼（JS、CSS）該刪的刪、第三方套件（各種追蹤碼、聊天外掛、廣告像素）別亂加，每一個外掛都是一份速度稅。第三是善用快取和 CDN，讓靜態資源就近供應，別讓每個客人都從遠端伺服器重新拉一次。
我會盯的具體指標是 Google 的 Core Web Vitals，特別是 LCP（最大內容繪製，反映主要內容多快出現）、INP（互動延遲，反映按下去多快有反應）、CLS（版面位移，反映畫面會不會跳來跳去害人點錯）。這三個指標都直接對應手機客人的真實體感，也影響搜尋排名。完整的做法我寫在網站速度與 Core Web Vitals那篇，這裡就不重複。你也可以用我們整理的電商計算機工具先粗估一下速度對轉換的影響有多大。
社群導流進來的落地頁該怎麼設計
台灣的行動流量很大一塊來自社群——Instagram、Facebook、LINE、以及各種 KOL 的貼文限動。這種流量有個共同特徵：客人是「被一個特定的東西吸引」點進來的，可能是一支開箱影片、一張穿搭照、一個限時優惠。如果你把這些流量全導到首頁，等於要他自己再找一次剛剛看到的商品，八成的人懶得找就走了。
社群落地頁的第一原則是「連貫」。客人在貼文看到什麼，落地頁一進去就要看到同一個東西——同一張主視覺、同一個商品、同一個優惠訊息。這種視覺和訊息的連貫，能大幅降低客人「咦，我是不是點錯了」的疑慮。針對特定活動、特定 KOL 合作，我通常會建議做專屬的落地頁，而不是共用商品頁。
第二原則是「快而輕」。社群客人是滑手機時順手點進來的，注意力極短、耐心極低，落地頁要更快、更聚焦。首屏就要把商品、賣點、行動按鈕交代清楚，別讓他滑很久才知道你要賣什麼。彈窗這種東西在社群落地頁尤其要克制，人家好不容易點進來，你第一秒就用彈窗擋他，等於把 KOL 幫你買來的流量往外推。這一整套從社群流量到轉換的接法，跟電商轉換率優化是同一套思路：流量進來之後的每一步，都要為手機客人的處境著想。
一個匿名實務案例
分享一個我印象很深的案子。那是一個某保健食品品牌的官網，商品好、客單價也不低，桌機版轉換率其實不差，但整體業績一直卡著上不去。老闆很納悶，因為廣告數據看起來流量都有進來。
我們拉數據一看，問題很清楚：超過八成的流量來自手機，但手機版的轉換率只有桌機版的四成不到。等於是廣告費大部分花在手機客人身上，錢卻在手機版這一關漏光了。我們實際用中階手機、行動網路走一遍完整的購買流程，前面講的體驗殺手幾乎全中——首圖是一張沒為手機優化的大圖，載入要三四秒；商品規格的字小到要放大才看得清；加入購物車的按鈕做在頁面中段一個不顯眼的位置；結帳要先註冊會員，還沒接任何行動支付，得手動輸入一長串卡號。
我們沒有大改版，就是把這些一項一項修：首圖換成響應式的輕量版本、內文字級全部拉大、把「加入購物車」和「結帳」做成固定在螢幕底部的懸浮按鈕、開放免註冊結帳、接上 Apple Pay 和 LINE Pay、把那個一進站就跳的訂閱彈窗延後到客人滑到一定深度才出現。前後大約一個多月，手機版的轉換率從桌機的四成拉到約八成，因為手機是流量大宗，整體營收的成長相當明顯，而且完全沒多花一毛廣告費。老闆最後那句話我記到現在：「原來我一直在修一台我從來沒坐上去開過的車。」如果你也想從一次完整的行動版健檢開始，可以參考我們的品牌代營運服務。
常見問題 FAQ
Q：我的網站是響應式設計（RWD），這樣就等於做好行動優化了嗎？
不完全等於。響應式設計只是讓網頁能「在手機上正常顯示」，這是及格線，不是滿分。RWD 解決的是版面自適應，但字級夠不夠大、按鈕好不好點、結帳流程順不順、載入快不快、彈窗擋不擋畫面，這些都是 RWD 本身不會自動幫你處理的。我看過太多技術上是響應式、但體驗上一塌糊塗的網站。行動優化是要真的拿手機走過每一個環節，而不是看它能不能在手機開。
Q：行動版和桌機版，我的資源該怎麼分配？
看你的流量結構。台灣多數電商的行動流量佔七到八成，如果你也是這個比例，那你的優化資源就該有七八成放在手機上。很多品牌的分配剛好相反——花大把時間雕桌機版，手機版隨便交差，這就是拿次要戰場的心力去打主戰場。我的建議是「行動優先」（mobile first）：設計和測試都從手機版開始，先把手機做到位，桌機反而好處理。
Q：一定要開發 App 嗎？沒有 App 是不是很吃虧？
多數中小品牌不需要急著開 App。App 的開發和維護成本高，還要說服客人下載，投報率通常不如把行動網頁做到極致。真正適合開 App 的，是回購頻率高、客人重度使用、會員經營很深的品類，這時候推播和順暢的重複購買才划算。如果你的品類客人一年只想起幾次，把行動網頁或 PWA 做好，效益比 App 實在得多。先問自己「客人多久回來一次」，再決定要不要投入 App。
Q：行動版載入速度大概要多快才算及格？
我通常盯 Google 的 Core Web Vitals，特別是 LCP（主要內容多快出現）最好在 2.5 秒內、INP（互動反應）在 200 毫秒內、CLS（版面位移）越小越好。但更實際的做法是：用一台中階手機、開行動網路（不是你辦公室的 Wi-Fi），實際連自己的網站走一遍。如果你自己都覺得等得不耐煩，客人一定早就走了。速度沒有絕對的及格線，但「比同業慢」就是在漏單。
Q：彈窗到底能不能用？我想收 email 和推優惠。
能用，但要為手機重新設計。問題不在彈窗本身，而在時機和方式。不要客人一進站、商品都還沒看到就跳全螢幕彈窗擋路，這不只趕客人，還會被 Google 判定為侵入式插頁而影響排名。比較好的做法是等客人瀏覽到一定深度、或準備離開時才出現，彈窗尺寸別佔滿全螢幕，關閉的叉叉要夠大好點。收 email 這件事很重要，但別為了收名單，趕走一個本來要下單的客人。
Q：社群導流進來的客人，落地頁該用商品頁還是首頁？
不要用首頁。社群客人是被某個特定商品或優惠吸引點進來的，導到首頁等於要他自己再找一次，八成的人會直接離開。針對重要的社群活動或 KOL 合作，我會建議做專屬落地頁，讓客人一進來就看到貼文裡那個一模一樣的商品、視覺和優惠訊息，維持連貫。落地頁還要更快、更聚焦，首屏就把賣點和行動按鈕交代清楚，別讓社群買來的流量在你網站門口流失。
結論
行動電商優化說到底，是一次視角的切換：你要停止用桌機、Wi-Fi、大螢幕、雙手空閒的自己，去想像客人買東西的樣子，改成用單手、碎片時間、不穩網路、小螢幕的真實客人來重新檢視每一個環節。台灣七八成的訂單在手機上發生，這就是主戰場，而主戰場的規則跟桌機完全不同。
好消息是，行動優化很少需要打掉重練，多半是把「每個環節都差一點」的累積傷害一項一項補起來——字放大、按鈕好點、彈窗收斂、結帳簡化、速度拉快、社群落地頁做連貫。這些改動單看都不起眼，乘起來卻能讓你在完全不多花廣告費的情況下，把已經買進門的流量真正變成訂單。下次要拍板任何設計決策前，先掏出手機、連上 4G，用一根拇指走一遍你的購買流程——那個版本，才是你真正在做生意的網站。想進一步了解，也歡迎看看我們的免費工具箱。
林克威長期協助國際品牌與台灣品牌進行電商代營運、品牌代理與通路拓展，累積超過十年實務經驗，服務涵蓋 Momo、PChome、蝦皮、LINE 禮物、品牌官網及實體零售通路。若您希望了解品牌進入台灣市場或電商成長策略，歡迎與我們聯繫。
