Gihîştina

Awirek kurt a taybetmendî û tixûbên Bootstrap ji bo afirandina naveroka gihîştî.

Li ser vê rûpelê

Bootstrap çarçoveyek hêsan-karanîna şêwazên amade, amûrên sêwiranê, û hêmanên înteraktîf peyda dike, ku rê dide pêşdebiran ku malper û serîlêdanên ku ji hêla dîtbarî ve balkêş in, ji hêla fonksiyonel ve dewlemend in, û ji qutiyê ve têne gihîştin biafirînin.

Çavdêrî û sînorkirinên

Gihîştina giştî ya her projeyek ku bi Bootstrap-ê hatî çêkirin bi piranî bi nîşankirina nivîskar, şêwaza zêde, û nivîsandina ku wan vekiriye ve girêdayî ye. Lêbelê, bi şertê ku ev bi rêkûpêk hatine bicîh kirin, pêdivî ye ku meriv bi Bootstrap re malper û serîlêdanên ku WCAG 2.1 (A/AA/AAA), Beşa 508 , û standard û hewcedariyên gihîştinê yên mîna wan bicîh tîne, bi tevahî gengaz be .

Nîşana strukturel

Şêwe û sêwirana Bootstrap dikare li cûrbecûr strukturên nîşankirinê were sepandin. Armanca vê belgekirinê ew e ku ji pêşdebiran re nimûneyên pratîka çêtirîn peyda bike da ku karanîna Bootstrap bixwe destnîşan bike û nîşankirina semantîkî ya guncan destnîşan bike, tevî awayên ku fikarên gihîştina potansiyel dikarin werin çareser kirin.

pêkhateyên înteraktîf

Parçeyên înteraktîf ên Bootstrap - wek diyalogên modal, pêşekên dakêşan, û serişteyên amûran ên xwerû - ji bo ku ji bo bikarhênerên touch, mişk û klavyeyê bixebitin hatine sêwirandin. Bi karanîna rol û taybetmendiyên WAI - ARIA têkildar , divê ev pêkhate jî bi karanîna teknolojiyên arîkar (wek xwendevanên ekranê) têne fêm kirin û xebitandin.

Ji ber ku hêmanên Bootstrap bi mebest hatine sêwirandin ku bi gelemperî gelemperî bin, dibe ku nivîskar hewce bike ku rol û taybetmendiyên ARIA -yê yên din , û her weha behreya JavaScript-ê jî bi nav bikin, da ku bi rengek rasttir cewher û fonksiyona pêkhateya xwe ragihînin. Ev bi gelemperî di belgeyê de tê destnîşan kirin.

Berevajî rengîn

Hin berhevokên rengan ên ku niha paleta xwerû ya Bootstrap pêk tînin - li seranserê çarçoweyê ji bo tiştên wekî guhertoyên bişkojkê, guheztinên hişyariyê, nîşaneyên pejirandina formê têne bikar anîn - dibe ku bibe sedema berevajîkirina rengê têra xwe (li jêr rêjeya berevajiya rengê nivîsê ya pêşniyarkirî ya WCAG 2.1 4,5:1 û WCAG 2.1 rêjeya berevajiya rengê ne-nivîsarê ya 3:1 ), nemaze dema ku li dijî paşxaneyek sivik tê bikar anîn. Nivîskar têne teşwîq kirin ku karanîna xweyên taybetî yên rengan biceribînin û, li cîhê ku hewce be, bi destan van rengên xwerû biguhezînin / dirêj bikin da ku rêjeyên berevajiya rengîn ên têr peyda bikin.

Naveroka ku divê bi dîtbarî were veşartin, lê ji teknolojiyên arîkar ên wekî xwendevanên ekranê re bigihîje, dikare bi karanîna .visually-hiddenpolê were şêwaz kirin. Ev dikare di rewşên ku pêdivî ye ku agahdariya dîtbarî an îşaretên zêde (wek wateya ku bi karanîna rengan ve hatî destnîşan kirin) bikêr be jî ji bikarhênerên ne-dîtbar re were ragihandin.

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

Ji bo kontrolên înteraktîf ên bi dîtbarî yên veşartî, mîna girêdanên kevneşopî yên "derbazkirinê", .visually-hidden-focusablepolê bikar bînin. Ev ê piştrast bike ku kontrol piştî balkişandinê xuya bibe (ji bo bikarhênerên klavyeyê yên dîtbar). Hişyar bikin, li gorî hevwate .sr-onlyû .sr-only-focusableçînên di guhertoyên berê de, Bootstrap 5 .visually-hidden-focusableçînek serbixwe ye, û pêdivî ye ku bi polê re bi hev re neyê bikar anîn .visually-hidden.

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

Tevgerê kêm kirin

Bootstrap ji bo prefers-reduced-motiontaybetmendiya medyayê piştgirî dike . Di gerok/dordorên ku destûrê didin bikarhêner ku tercîha xwe ji bo tevgera kêmkirî diyar bike, piraniya bandorên veguheztina CSS-ê di Bootstrap de (mînak, dema ku diyalogek modal tê vekirin an girtî, an jî anîmasyonek xêzkirî ya di carouselan de) dê neçalak bibin, û anîmasyonên watedar ( wek spinners) dê hêdî bibin.

Li ser gerokên ku piştgirî dikin prefers-reduced-motion, û li cihê ku bikarhêner bi eşkere îşaret nekiriye ku ew ê tevgera kêmkirî tercîh bikin (ango li ku derê prefers-reduced-motion: no-preference), Bootstrap bi karanîna scroll-behaviortaybetmendiyê gerokek xweş dike.