無障礙網頁 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

【 JavaScript 學習筆記 】Hoisting  變數提升及 暫時性死區(TDZ)

【 JavaScript 學習筆記 】Hoisting 變數提升及 暫時性死區(TDZ)

Spring boot系列(五)Controller-Parameter

Spring boot系列(五)Controller-Parameter

Vue 元件 : Props in & Emit out

Vue 元件 : Props in & Emit out


Comments