無障礙網頁 HTML屬性


Posted by mijouhsieh on 2023-03-21

無障礙網頁MDN
aria-label
Web Accessibility
Web Content Accessibility Guidelines (WCAG)
tabindex

瀏覽網頁內容的特殊工具(assistive technologies、AT)螢幕閱讀器會說明元件是什麼

提升web accessibility的HTML屬性:
aria-*

<nav aria-label="Page navigation">

<div class="modal fade" id="movie-modal"  
aria-labelledby="exampleModalLabel"
aria-hidden="true">

<button class="navbar-toggler" type="button"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation">

visually-hidden 是 screen reader only 的意思,是 Bootstrap 為了提升網頁可用性打造的屬性。

<label class="visually-hidden" for="search-input">
  Search Keyword 
</label>

tabindex


#aria-* #Bootstrap-visually-hidden







Related Posts

[Day 01] 強化學習?

[Day 01] 強化學習?

JS 展開  (Spread Operator) 以及反向展開 (Rest Parameters)

JS 展開 (Spread Operator) 以及反向展開 (Rest Parameters)

Web開發學習筆記12 — 如何用JavaScript設置CSS樣式?、document.style與window.getComputedStyle()的差異

Web開發學習筆記12 — 如何用JavaScript設置CSS樣式?、document.style與window.getComputedStyle()的差異


Comments