Accessibility

Usa ka mubo nga pagtan-aw sa mga bahin ug mga limitasyon sa Bootstrap alang sa paghimo sa ma-access nga sulud.

Niini nga panid

Naghatag ang Bootstrap og usa ka dali gamiton nga balangkas sa andam na nga mga istilo, mga tool sa layout, ug mga interactive nga sangkap, nga gitugotan ang mga developer nga maghimo mga website ug aplikasyon nga makapadani sa panan-aw, dato nga magamit, ug ma-access sa gawas sa kahon.

Overview ug mga limitasyon

Ang kinatibuk-ang accessibility sa bisan unsang proyekto nga gitukod gamit ang Bootstrap nagdepende sa dakong bahin sa markup sa tagsulat, dugang nga estilo, ug scripting nga ilang gilakip. Bisan pa, kung kini gipatuman sa husto, kinahanglan nga hingpit nga posible ang paghimo sa mga website ug aplikasyon nga adunay Bootstrap nga nagtuman sa WCAG 2.1 (A/AA/AAA), Seksyon 508 , ug parehas nga mga sumbanan ug kinahanglanon sa pagka-access.

Structural markup

Ang estilo ug layout sa Bootstrap mahimong magamit sa usa ka halapad nga mga istruktura sa markup. Kini nga dokumentasyon nagtumong sa paghatag sa mga developers sa pinakamaayong praktis nga mga panig-ingnan sa pagpakita sa paggamit sa Bootstrap mismo ug pag-ilustrar sa tukma nga semantic markup, lakip na ang mga paagi diin ang posibleng mga problema sa accessibility mahimong matubag.

Interactive nga mga sangkap

Ang mga interactive nga sangkap sa Bootstrap—sama sa modal dialogs, dropdown menus, ug custom tooltips—gidesinyo aron magamit sa mga tiggamit sa paghikap, mouse, ug keyboard. Pinaagi sa paggamit sa mga may kalabutan nga WAI - ARIA nga mga tahas ug mga hiyas, kini nga mga sangkap kinahanglan usab nga masabtan ug magamit gamit ang mga teknolohiya nga makatabang (sama sa mga magbabasa sa screen).

Tungod kay ang mga sangkap sa Bootstrap gituyo nga gidesinyo aron mahimong medyo generic, ang mga tagsulat mahimo’g kinahanglan nga maglakip sa dugang nga mga tahas ug mga hiyas sa ARIA , ingon man ang pamatasan sa JavaScript, aron mas tukma nga ipahayag ang tukma nga kinaiyahan ug gamit sa ilang sangkap. Kasagaran kini makita sa dokumentasyon.

Ang kalainan sa kolor

Ang pipila ka mga kombinasyon sa mga kolor nga sa pagkakaron naglangkob sa default palette sa Bootstrap—gigamit sa tibuok framework para sa mga butang sama sa mga variation sa butones, mga variation sa alerto, mga indikasyon sa pag-validate sa porma—mahimong mosangpot sa dili igo nga kalainan sa kolor (ubos sa girekomendar nga WCAG 2.1 nga text color contrast ratio nga 4.5:1 ug ang WCAG 2.1 non-text color contrast ratio nga 3:1 ), ilabina kon gamiton batok sa kahayag nga background. Giawhag ang mga tagsulat nga sulayan ang ilang piho nga paggamit sa kolor ug, kung gikinahanglan, mano-mano nga usbon / palawigon kini nga mga default nga mga kolor aron masiguro ang igo nga mga ratio sa kalainan sa kolor.

Ang sulud nga kinahanglan nga makita nga gitago, apan magpabilin nga magamit sa mga makatabang nga teknolohiya sama sa mga magbabasa sa screen, mahimong i-istilo gamit ang .visually-hiddenklase. Mahimong mapuslanon kini sa mga sitwasyon diin ang dugang nga biswal nga impormasyon o mga pahibalo (sama sa kahulogan nga gipaila pinaagi sa paggamit sa kolor) kinahanglan usab nga ipaabot ngadto sa dili biswal nga tiggamit.

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

Para sa visually hidden interactive controls, sama sa tradisyonal nga “skip” links, gamita ang .visually-hidden-focusableklase. Kini makasiguro nga ang kontrol mahimong makita sa higayon nga naka-focus (alang sa makita nga mga tiggamit sa keyboard). Pagbantay, kung itandi sa katumbas .sr-onlyug .sr-only-focusablemga klase sa nangaging mga bersyon, ang Bootstrap 5's .visually-hidden-focusableusa ka standalone nga klase, ug kinahanglan dili gamiton sa kombinasyon sa .visually-hiddenklase.

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

Pagkunhod sa paglihok

Ang Bootstrap naglakip sa suporta alang sa prefers-reduced-motionbahin sa media . Sa browsers/environments nga nagtugot sa user sa pagtino sa ilang gusto alang sa pagkunhod sa motion, kadaghanan sa CSS transition effects sa Bootstrap (pananglitan, kung ang modal dialog giablihan o gisirado, o ang sliding animation sa carousels) ma-disable, ug makahuluganon nga mga animation ( sama sa mga spinner) mohinay.

Sa mga browser nga nagsuporta prefers-reduced-motion, ug kung diin ang user wala klaro nga nagsenyas nga gusto nila ang pagkunhod sa paglihok (pananglitan kung asa prefers-reduced-motion: no-preference), ang Bootstrap makahimo sa hapsay nga pag-scroll gamit ang scroll-behaviorkabtangan.