手機畫面空間有限，使用環境亦更不穩定。用戶可能單手操作、正在移動、受到通知打斷，或只想在短時間內完成一件事。因此 Mobile UI 需要更清楚的優先次序。
由核心任務決定內容
把 Desktop 版所有內容縮小放入手機，通常會形成過長頁面、擁擠控制和難以理解的層次。設計時應先找出手機用戶最常完成的任務，再決定哪些內容直接顯示、哪些可以逐步展開。
主要資訊應在不需要大量捲動或點擊的情況下被看見。次要細節可以透過 accordion、detail page 或 progressive disclosure 提供，但不應把關鍵內容藏在不明顯的互動後面。
為手指而不是滑鼠設計
觸控沒有 hover 狀態，也較難精準點擊。按鈕和互動區域需要足夠大小和距離，重要操作亦應避免放在難以觸及或容易誤觸的位置。
- 確保整個可見按鈕範圍都可以點擊。
- 避免把多個細小 icon 緊密排列。
- 不要依賴 hover 才顯示必要資訊。
- 長列表應提供清楚分組、搜尋或篩選。
中文字體需要更細緻處理
中文字符資訊密度較高，過大的標題在窄畫面上容易每行只剩數個字，破壞閱讀節奏。應按語言和 viewport 調整字級、行高及最大寬度，而不是直接沿用英文 Desktop 比例。
內文亦要避免太細或行距太密。設計時可在真實手機寬度檢查長標題、數字、英文混排和不同系統字體，確保沒有出界或突然斷行。
考慮固定元素佔用的空間
Sticky header、bottom navigation、cookie banner 和瀏覽器介面都會縮小可見範圍。固定元素應保持精簡，並避免遮擋內容或操作。使用鍵盤輸入時，亦要確認目前欄位和主要按鈕仍然可見。
好的 Mobile UI 不會讓人感覺內容被縮小，而是讓每一步都剛好適合當下的畫面和操作方式。
一定要在真實裝置測試
Browser responsive mode 適合初步檢查，但無法完全模擬 Safari 或 Chrome 的 viewport、safe area、鍵盤、字體渲染和觸控感受。上線前應至少在不同尺寸的 iPhone 和 Android 裝置完成主要流程，並測試慢速網絡和旋轉畫面。
