- 易於觸控：對人類的手指而言，建議的最小觸擊目標大小為 48 dp (密度獨立像素)，而且目標之間至少應間隔 8 dp。觸擊目標過小容易導致點擊錯誤，帶給行動使用者負面觀感。
- 選用合適字體：字體大小必須至少有 12 像素，比這更小的文字閱讀起來很吃力。另外，請務必選擇清晰易讀的字型，並且盡可能避免使用圖形文字。
- 設定合適寬度：網路使用者大多習慣上下捲動網頁；網頁設計成左右捲動的話，操作起來可能不太順暢，對小螢幕裝置的使用者而言很不方便。
- 避免使用滑鼠懸停功能：在電腦螢幕上，滑鼠懸停功能是讓使用者發現隱藏內容的絕佳方式，但這個功能需要滑鼠才能奏效。在平板電腦或智慧型手機等觸控螢幕上，使用者的手指並不能像滑鼠一樣懸停在內容上，因此請避免使用滑鼠懸停功能，並改用按鈕，讓使用者只要輕點按鈕就能顯示深層選單。
- 不要使用彈出式視窗：不論是在電腦版網站或行動網站上，彈出式視窗都會造成使用者反感。與其使用插頁廣告來提高應用程式下載量，不如直接將提示內容嵌入網站內。
- 使用附有清楚說明的按鈕：不要讓使用者搞不清楚按下按鈕後會連到哪個網頁。按鈕一定要標示清楚，並使用導航標記和清楚的類別名稱 (例如「步驟 2：付款」)，讓使用者順利瀏覽網頁。
- 不要塞給使用者過多內容：對行動網站而言，內容過多不一定是好事。請把內容簡化，不要一字不漏地在行動版網頁上塞進電腦版網頁的內容。
- 在自訂內容的同時保持內容完整：從行動裝置和平板電腦使用者的立場出發，他們一定會期望行動網頁能夠提供與電腦網頁相同的核心功能 (例如看影片或購買文具用品)，因此請務必保留核心內容，並根據行動裝置螢幕的特性加以調整，讓內容流暢地在這類螢幕上顯示。
- 清楚顯示主要功能：請務必確保使用者都能輕鬆使用網站中所有的主要功能。以零售商為例，產品搜尋和購物車 (以及「店家搜尋器」之類行動裝置適用的工具) 等功能，應該要放置在網頁中央的顯眼位置。另外，您也應該提供完整版網站的連結，方便行動使用者切換瀏覽。
- 仔細檢查媒體檔案：舉例來說，許多行動裝置都無法播放 Flash 影片，因此，請務必確認跨螢幕網站上提供的媒體檔案都能在相對應的螢幕上播放。
- 簡化結帳過程：在行動裝置上進行繁雜的步驟 (例如填寫冗長的表格，以及用手指輸入地址等資料) 是十分困難的事。為了提升轉換率，您必須盡量簡化付款程序。您可以使用 Google Wallet Instant Buy 之類的服務，在雲端自動產生所有的付款和運送詳情，方便客戶快速完成結帳程序。
-
這裡的重點只有一個，那就是加快速度！加快網站速度是確保使用者滿意度的不二法門，尤其是在行動裝置上：使用者隨時隨地都會瀏覽網站，而數據網路的傳輸速度可能會很慢。提高速度通常可以提升訪客的參與度、增加訪客在您網站上停留的時間，進而帶來更多轉換。提高速度不但有助於提升網站在 Google 搜尋上的排名，許多公司行號在投注心力改善網頁執行速度後，收益也跟著連帶成長。
以下是您該避免的常見錯誤：
- HTTP 請求數量過多：雖然行動使用者上網想做的事和電腦使用者一樣，但行動裝置的處理能力畢竟有限，網路頻寬可能也不穩定。為了加快行動網頁的執行速度，請務必刪減網頁中會增加 HTTP 請求的元素。
- 圖片超載：隨著智慧型手機的顯示效能日益強大，您或許會想使用尺寸最大的圖片，讓智慧型手機自動依照螢幕縮小尺寸，但這並不是最好的做法。為了避免浪費時間和耗損處理能力，我們建議您為不同的裝置分別提供合適的圖片大小。
- 檔案超載：請想想 JavaScript 程式碼片段和 CSS 樣式是否對行動使用者有幫助，因為 JavaScript 程式碼或 CSS 樣式過多可能會拖慢網頁執行速度。建議您盡量壓縮程式碼、全面重新編排 CSS，並確保瀏覽器能夠快取素材資源，避免系統在訪客每一次載入網頁時重新擷取。
立即聯絡
加入好友