RWD 手機版練習
不是把桌面版縮小,而是重新安排窄螢幕上的閱讀順序、操作大小與內容密度。
- 練習目標
- 360px 也能舒服閱讀
- 使用技術
- Media Query、語意 HTML
- 目前成果
- 首頁與文章頁皆支援
我想練習什麼
桌面版改成單欄只是第一步。手機上的標題不能太大、按鈕不能太小,文章摘要與分類也要維持清楚層級。
檢查項目
- 360px 寬度沒有橫向溢位。
- 主要按鈕與連結保留足夠操作高度。
- 導覽改為行動版選單。
- 文章正文縮短行寬並調整引用文字。
這次學到的事
響應式設計是在不同空間重新決定優先順序。每增加一個區塊,都需要同時思考桌面與手機上的用途。