Luncat ka eusi utama Luncat ka navigasi docs
Check
in English

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.

Tinjauan sareng watesan

Aksesibilitas sakabéh proyék naon waé anu diwangun ku Bootstrap sabagian ageung gumantung kana markup pangarang, gaya tambahan, sareng skrip anu aranjeunna kalebet. Tapi, upami ieu parantos dilaksanakeun leres, kedahna mungkin pikeun nyiptakeun situs wéb sareng aplikasi nganggo Bootstrap anu nyumponan WCAG 2.1 (A/AA/AAA), Bagian 508 , sareng standar sareng syarat aksés anu sami.

Markup struktural

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

Komponén interaktif Bootstrap—sapertos dialog modal, ménu lungsur, sareng tooltip 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.

Kontras warna

Sababaraha kombinasi warna anu ayeuna janten palét standar Bootstrap — dianggo sapanjang kerangka pikeun hal-hal sapertos variasi tombol, variasi waspada, indikator validasi formulir-bisa ngakibatkeun kontras warna anu henteu cekap (handapeun rasio kontras warna téks WCAG 2.1 anu disarankeun 4.5: 1. sareng rasio kontras warna non-teks WCAG 2.1 3:1 ), khususna nalika dianggo dina latar anu terang. Panulis didorong pikeun nguji panggunaan warna khususna sareng, upami diperyogikeun, sacara manual ngarobih / manjangkeun warna standar ieu pikeun mastikeun rasio kontras warna anu nyukupan.

Eusi disumputkeun sacara visual

Eusi anu kedah disumputkeun sacara visual, tapi tetep tiasa diaksés ku téknologi anu ngabantosan sapertos pamiarsa layar, tiasa digayakeun nganggo .visually-hiddenkelas. Ieu tiasa mangpaat dina situasi dimana informasi visual tambahan atawa cues (saperti harti dilambangkeun ngaliwatan pamakéan warna) kudu ogé jadi conveyed ka pamaké non-visual.

<p class="text-danger">
  <span class="visually-hidden">Danger: </span>
  This action is not reversible
</p>

Pikeun kadali interaktif visually disumputkeun, kayaning "skip" Tumbu tradisional, make .visually-hidden-focusablekelas. Ieu bakal mastikeun yén kadali janten katingali sakali fokus (pikeun pamaké keyboard sighted). Awas, dibandingkeun sareng sarimbag .sr-onlysareng .sr-only-focusablekelas dina vérsi anu kapungkur, Bootstrap 5 .visually-hidden-focusablemangrupikeun kelas mandiri, sareng henteu kedah dianggo digabungkeun sareng .visually-hiddenkelas.

<a class="visually-hidden-focusable" href="#content">Skip to main content</a>

Ngurangan gerak

Bootstrap kalebet dukungan pikeun prefers-reduced-motionfitur média . Dina browser/lingkungan nu ngidinan pamaké pikeun nangtukeun preferensi maranéhanana pikeun ngurangan gerak, lolobana épék transisi CSS dina Bootstrap (contona, nalika dialog modal dibuka atawa ditutup, atawa animasi ngageser dina carousels) bakal ditumpurkeun, sarta animasi bermakna ( kayaning spinners) bakal kalem handap.

Dina browser anu ngadukung prefers-reduced-motion, sareng dimana pangguna henteu sacara eksplisit nunjukkeun yén aranjeunna langkung milih gerak anu dikurangan (nyaéta dimana prefers-reduced-motion: no-preference), Bootstrap ngamungkinkeun ngagulung lancar nganggo scroll-behaviorharta éta.

sumberdaya tambahan