實作邏輯分頁順序是為使用者提供流暢的鍵盤瀏覽體驗的重要一環。螢幕閱讀器和其他輔助技術依照 DOM 順序瀏覽頁面。 資訊流應合理。
如何手動測試
如要確認應用程式的分頁順序是否合理,請嘗試瀏覽頁面。一般來說,焦點應按照閱讀順序從左到右從頁面底部移至底部。
評估分頁順序時,請謹記以下兩個重點:
- DOM 中的元素是否以邏輯順序排列?
- 是否在導覽中正確隱藏畫面外內容?
注意瀏覽過程中的任何跳轉看似令人驚訝。另外請注意,任何畫面外的跳轉動作 會利用 Tab 鍵跳到不該出現的內容
詳情請參閱鍵盤存取基礎知識。
如何修正
如果焦點順序有誤,您應該在 DOM 中重新排列元素,讓分頁順序更加自然。
如果您使用 CSS 將元素重新定位,輔助技術使用者就不會有意義的導覽動作。除了使用 CSS,請將元素移至 DOM 中的較早位置。
如果鍵盤控制項仍可存取螢幕外內容,請考慮使用 tabindex="-1"
移除。
詳情請參閱「使用 Tabindex 控制焦點」一文。