1 html中,button元素中的aria-describedby="tooltip-r1k"屬性,主要用來做什么?
在 HTML 中,button
元素中的 aria-describedby="tooltip-r1k"
屬性主要用于提升網頁的可訪問性(Accessibility),特別是幫助使用輔助技術(如屏幕閱讀器)的用戶理解頁面內容。
ARIA (Accessible Rich Internet Applications
) 簡介
ARIA 是一組特殊的屬性,可以添加到 HTML 元素中,以增強其對于使用輔助技術用戶的可訪問性。通過 ARIA,開發者能夠定義如何這些元素應被暴露給輔助技術,從而提供更多的上下文信息或操作指南。
aria-describedby
?屬性的作用
aria-describedby
屬性用于標識當前元素由另一個元素描述。它接受一個或多個 ID 的引用,這些 ID 指向提供額外描述信息的元素。例如:
<button aria-describedby="tooltip-r1k">提交</button>
<span id="tooltip-r1k" style="display:none;">點擊此按鈕將提交表單。</span>
在這個例子中,aria-describedby="tooltip-r1k"
告訴輔助技術(比如屏幕閱讀器),這個按鈕有一個額外的描述信息位于 ID 為 tooltip-r1k
的元素內。這樣,當用戶聚焦于這個按鈕時,屏幕閱讀器不僅會讀出按鈕上的文本(即“提交”),還會讀出與之關聯的描述(即“點擊此按鈕將提交表單。”)。
使用場景
- 工具提示(Tooltips):當需要為控件提供額外的說明或指導時。
- 錯誤消息:當表單輸入無效時,可以用來指向顯示錯誤信息的元素。
- 狀態指示:如開關、復選框等的狀態說明。
通過這種方式,即使這些描述性的文本在視覺上可能不可見或者不易被發現,它們仍然可以通過輔助技術傳達給有需要的用戶,從而提高網站的整體可訪問性和用戶體驗。
2?