Aksesibilitas
Tinjauan ringkes fitur Bootstrap sareng watesan pikeun nyiptakeun kontén anu tiasa diaksés.
Bootstrap nyayogikeun kerangka gaya anu siap-siap, alat perenah, sareng komponén interaktif anu gampang dianggo, ngamungkinkeun para pamekar nyiptakeun situs wéb sareng aplikasi anu pikaresepeun sacara visual, beunghar sacara fungsional, sareng tiasa diaksés kaluar tina kotak.
Aksesibilitas sakabéh proyék naon waé anu diwangun ku Bootstrap sabagian ageung gumantung kana markup pangarang, gaya tambahan, sareng skrip anu aranjeunna kalebet. Nanging, upami ieu parantos dilaksanakeun leres, kedah sampurna pikeun nyiptakeun situs wéb sareng aplikasi nganggo Bootstrap anu nyumponan WCAG 2.0 (A / AA / AAA), Bagian 508 sareng standar sareng syarat aksés anu sami.
Gaya sareng perenah Bootstrap tiasa diterapkeun kana rupa-rupa struktur markup. Dokuméntasi ieu boga tujuan pikeun nyadiakeun pamekar jeung conto prakték pangalusna pikeun demonstrate pamakéan Bootstrap sorangan tur ngagambarkeun markup semantik luyu, kaasup cara nu masalah aksés aksés poténsial bisa kajawab.
Komponén interaktif Bootstrap—sapertos dialog modal, ménu lungsur sareng tip alat khusus—dirancang pikeun dianggo pikeun pangguna touch, mouse sareng keyboard. Ngaliwatan panggunaan peran sareng atribut WAI - ARIA anu relevan , komponén-komponén ieu ogé kedah kaharti sareng tiasa dianggo nganggo téknologi anu ngabantosan (sapertos pamiarsa layar).
Kusabab komponén Bootstrap ngahaja dirancang janten cukup umum, pangarang panginten kedah ngalebetkeun peran sareng atribut ARIA salajengna , ogé paripolah JavaScript, pikeun langkung akurat nepikeun sifat sareng fungsionalitas komponénna. Ieu biasana dicatet dina dokuméntasi.
Most colors that currently make up Bootstrap’s default palette—used throughout the framework for things such as button variations, alert variations, form validation indicators—lead to insufficient color contrast (below the recommended WCAG 2.0 color contrast ratio of 4.5:1) when used against a light background. Authors will need to manually modify/extend these default colors to ensure adequate color contrast ratios.
Content which should be visually hidden, but remain accessible to assistive technologies such as screen readers, can be styled using the .sr-only class. This can be useful in situations where additional visual information or cues (such as meaning denoted through the use of color) need to also be conveyed to non-visual users.
<p class="text-danger">
<span class="sr-only">Danger: </span>
This action is not reversible
</p>For visually hidden interactive controls, such as traditional “skip” links, .sr-only can be combined with the .sr-only-focusable class. This will ensure that the control becomes visible once focused (for sighted keyboard users).
<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>Bootstrap includes support for the prefers-reduced-motion media feature. In browsers/environments that allow the user to specify their preference for reduced motion, most CSS transition effects in Bootstrap (for instance, when a modal dialog is opened or closed) will be disabled. Currently, support is limited to Safari on macOS and iOS.