Di we aw pɔsin kin ebul fɔ go de

Wan shɔt ɔvaviu fɔ Bootstrap in ficha ɛn limiteshɔn fɔ di krieshɔn fɔ aksesbul kɔntinyu.

Na dis pej

Bootstrap de gi wan izi fɔ yuz fɔm we gɛt stayl dɛn we dɛn dɔn rɛdi, layout tul dɛn, ɛn intaraktiv kɔmpɔnɛnt dɛn, we de alaw divɛlɔpa dɛn fɔ mek wɛbsayt ɛn aplikeshɔn dɛn we fayn fɔ si, we gɛt bɔku tin dɛn fɔ du, ɛn we pɔsin kin ebul fɔ yuz aut ɔf di bɔks.

Ɔvaviu ɛn di tin dɛn we dɛn nɔ ebul fɔ du

Di ɔvala aksesibiliti fɔ ɛni prɔjek we dɛn bil wit Bootstrap dipen bɔku pan di ɔda pɔsin in mak, ɔda stayl, ɛn skript we dɛn dɔn put insay. Bɔt if dɛn dɔn impruv dɛn tin ya kɔrɛkt wan, i fɔ rili pɔsibul fɔ mek wɛbsayt ɛn aplikeshɔn dɛn wit Bootstrap we go fulɔp WCAG 2.1 (A/AA/AAA), Sɛkshɔn 508 , ɛn di sem kayn aksesbiliti standad ɛn tin dɛn we dɛn nid.

Strɔkchɔral mak-ap

Bootstrap in stayl ɛn layout kin aplay to wan big rɛnj ɔf mak strɔkchɔ dɛn. Dis dɔkyumentri aim fɔ gi divɛlɔpa dɛn bɛst prɔsis ɛgzampul dɛn fɔ sho aw dɛn de yuz Bootstrap sɛf ɛn sho di rayt sɛmantik mak, inklud di we dɛn we dɛn kin adrɛs di prɔblɛm dɛn we kin apin we pɔsin kin gɛt akses.

Intaraktiv kɔmpɔnɛnt dɛn

Di intaraktiv kɔmpɔnɛnt dɛn we de insay Bootstrap—lɛk modal dayalɔg dɛn, drɔpdɔwn mɛnyu dɛn, ɛn kɔstɔm tultip dɛn—dɛn mek am fɔ wok fɔ di wan dɛn we de yuz tɔch, maws, ɛn kibɔd. Tru di yus fɔ rilevɛns WAI - ARIA rol ɛn atribyut dɛn, dɛn kɔmpɔnɛnt dɛn ya fɔ ɔndastand ɛn wok bak we dɛn de yuz ɛp tɛnkɔlɔji dɛn (lɛk skrin rida dɛn).

Bikɔs dɛn mek di kɔmpɔnɛnt dɛn na Bootstrap bay wilful fɔ mek dɛn bi fayn jenɛrik, di wan dɛn we rayt di buk kin nid fɔ put ɔda ARIA rol ɛn atribyut dɛn, ɛn bak di we aw dɛn de biev na JavaSkript, fɔ mek dɛn ebul fɔ sho mɔ kɔrɛkt wan di kayn we aw dɛn kɔmpɔnɛnt ɛn di we aw dɛn de wok. Bɔku tɛm, dɛn kin rayt dis na di dɔkyumɛnt dɛn.

Difrɛn frɔm di kɔlɔ dɛn

Sɔm kɔmbaynshɔn dɛn fɔ kɔlɔ dɛn we de mek Bootstrap in difɔlt palet naw—we dɛn de yuz ɔlsay na di freym fɔ tin dɛn lɛk bɔtin chenj, alɛt chenj, fɔm validɛshɔn indikɛtɔ—kin mek yu nɔ gɛt bɛtɛ kɔlɔ kɔntrast (dɔŋ di WCAG 2.1 tɛks kɔlɔ kɔntrast rɛtɛshɔn we dɛn dɔn rɛkɔmɛnd we na 4.5:1 ɛn di WCAG 2.1 nɔ-tɛks kɔlɔ kɔntrast rɛtɛshɔn we na 3:1 ), mɔ we dɛn yuz am agens layt bakgrɔn. Wi de ɛnkɔrej di wan dɛn we rayt fɔ tɛst di patikyula we aw dɛn de yuz kɔlɔ ɛn, usay nid de, dɛn fɔ chenj/ɛkstɛnd dɛn difɔlt kɔlɔ dɛn ya wit dɛn an fɔ mek shɔ se dɛn gɛt di rayt kɔntrast rɛtɛshɔn fɔ di kɔlɔ.

Kɔntinɛnt we fɔ ayd wit yu yay, bɔt stil de aksesbul to ɛtɛknɔlɔji dɛn we de ɛp lɛk skrin rida, dɛn kin stayl am yuz di .visually-hiddenklas. Dis kin yusful insay situeshɔn dɛn usay ɔda infɔmeshɔn ɔ kiyu dɛn we pɔsin kin si (lɛk minin we dɛn sho tru di yus fɔ kɔlɔ) nid fɔ gi bak to pipul dɛn we nɔ de yuz am fɔ si.

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

Fɔ intaraktiv kɔntrol dɛn we yu kin si, lɛk tradishɔnal “skip” link dɛn, yuz di .visually-hidden-focusableklas. Dis go mek shɔ se di kɔntrol go bi tin we pɔsin kin si wans dɛn dɔn fos am (fɔ di wan dɛn we de yuz di kibɔd we de si tin). Wach ɔut, kɔmpia to di ikwal .sr-onlyɛn .sr-only-focusableklas dɛn na di past vɛshɔn dɛn, Bootstrap 5’s .visually-hidden-focusablena wan standalɔn klas, ɛn dɛn nɔ fɔ yuz am togɛda wit di .visually-hiddenklas.

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

Ridyus di muvmɛnt

Bootstrap inklud sɔpɔt fɔ di prefers-reduced-motionmidia ficha . Insay brawza/envayrɔmɛnt dɛn we de alaw di yuza fɔ spɛsifa wetin i lɛk fɔ ridyus muvmɛnt, bɔku pan di CSS transishɔn ifɛkt dɛn na Bootstrap (fɔ ɛgzampul, we dɛn opin ɔ lɔk wan modal dayalɔg, ɔ di animashɔn we de slayv na karusel) go disable, ɛn animashɔn dɛn we gɛt minin ( lɛk spina dɛn) go slo.

Na brawza dɛn we de sɔpɔt prefers-reduced-motion, ɛn usay di pɔsin we de yuz am nɔ dɔn sho klia wan se dɛn go lɛk fɔ ridyus muvmɛnt (dat na usay prefers-reduced-motion: no-preference), Bootstrap de mek yu ebul fɔ skrol fayn fayn wan we yu de yuz di scroll-behaviorprɔpati.