Source

Մատչելիություն

Bootstrap-ի առանձնահատկությունների և մատչելի բովանդակության ստեղծման սահմանափակումների համառոտ ակնարկ:

Bootstrap-ն ապահովում է պատրաստի ոճերի, դասավորության գործիքների և ինտերակտիվ բաղադրիչների հեշտ օգտագործման շրջանակ, որը թույլ է տալիս ծրագրավորողներին ստեղծել տեսողականորեն գրավիչ, ֆունկցիոնալ առումով հարուստ և հասանելի վեբ կայքեր և հավելվածներ:

Ընդհանուր ակնարկ և սահմանափակումներ

Bootstrap-ով կառուցված ցանկացած նախագծի ընդհանուր հասանելիությունը մեծապես կախված է հեղինակի նշագրումից, լրացուցիչ ոճավորումից և նրանց կողմից ներառված սցենարներից: Այնուամենայնիվ, պայմանով, որ դրանք ճիշտ են իրականացվել, պետք է լիովին հնարավոր լինի ստեղծել վեբկայքեր և հավելվածներ Bootstrap-ով, որոնք համապատասխանում են WCAG 2.0 (A/AA/AAA), Բաժին 508 -ին և հասանելիության նմանատիպ չափանիշներին և պահանջներին:

Կառուցվածքային նշում

Bootstrap-ի ոճավորումը և դասավորությունը կարող են կիրառվել նշագծման կառույցների լայն շրջանակի համար: Այս փաստաթուղթը նպատակ ունի ծրագրավորողներին տրամադրել լավագույն փորձի օրինակներ՝ ցույց տալու համար Bootstrap-ի օգտագործումը և ցույց տալու համապատասխան իմաստային նշագրումը, ներառյալ այն ուղիները, որոնցով հնարավոր է մատչելիության հետ կապված խնդիրները լուծել:

Ինտերակտիվ բաղադրիչներ

Bootstrap-ի ինտերակտիվ բաղադրիչները, ինչպիսիք են մոդալ երկխոսությունները, բացվող ընտրացանկերը և հատուկ գործիքների հուշումները, նախագծված են աշխատելու հպման, մկնիկի և ստեղնաշարի օգտագործողների համար: Համապատասխան WAI - ARIA դերերի և ատրիբուտների օգտագործման միջոցով այս բաղադրիչները պետք է նաև հասկանալի և գործունակ լինեն՝ օգտագործելով օժանդակ տեխնոլոգիաներ (օրինակ՝ էկրանի ընթերցիչներ):

Քանի որ Bootstrap-ի բաղադրիչները միտումնավոր նախագծված են բավականին ընդհանուր լինելու համար, հնարավոր է, որ հեղինակներին անհրաժեշտ լինի ներառել ARIA- ի հետագա դերերն ու ատրիբուտները, ինչպես նաև JavaScript-ի վարքագիծը, որպեսզի ավելի ճշգրիտ կերպով փոխանցեն իրենց բաղադրիչի ճշգրիտ բնույթն ու ֆունկցիոնալությունը: Սա սովորաբար նշվում է փաստաթղթերում:

Գույնի հակադրություն

Գույների մեծ մասը, որոնք ներկայումս կազմում են Bootstrap-ի լռելյայն գունապնակը, որն օգտագործվում է շրջանակում այնպիսի բաների համար, ինչպիսիք են կոճակների տատանումները, ազդանշանային տատանումները, ձևի վավերացման ցուցիչները, հանգեցնում են գունային անբավարար կոնտրաստի (առաջարկվող WCAG 2.0 գունային հակադրության հարաբերակցությունից ցածր՝ 4,5:1 ), երբ օգտագործվում են դեմ : թեթև ֆոն. Հեղինակները պետք է ձեռքով փոփոխեն/ընդլայնեն այս լռելյայն գույները՝ գունային հակադրության համապատասխան հարաբերակցություններ ապահովելու համար:

Տեսողականորեն թաքնված բովանդակություն

Բովանդակությունը, որը պետք է տեսողականորեն թաքցվի, բայց հասանելի մնա օժանդակ տեխնոլոգիաների համար, ինչպիսիք են էկրանի ընթերցողները, կարող են ոճավորվել .sr-onlyդասի միջոցով: Սա կարող է օգտակար լինել այն իրավիճակներում, երբ լրացուցիչ տեսողական տեղեկատվությունը կամ ազդանշանները (օրինակ՝ գույնի օգտագործմամբ նշանակված նշանակությունը) պետք է փոխանցվեն նաև ոչ տեսողական օգտատերերին:

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

Տեսողականորեն թաքնված ինտերակտիվ կառավարման համար, ինչպիսիք են ավանդական «բաց թողնել» հղումները, .sr-onlyկարող են համակցվել .sr-only-focusableդասի հետ: Սա կապահովի, որ կառավարումը տեսանելի դառնա կենտրոնանալուց հետո (տեսողությամբ ստեղնաշար օգտագործողների համար):

<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>

Նվազեցված շարժում

Bootstrap-ը ներառում է prefers-reduced-motionմեդիա ֆունկցիայի աջակցություն : Բրաուզերներում/միջավայրերում, որոնք թույլ են տալիս օգտվողին նշել իրենց նախապատվությունը կրճատված շարժման համար, Bootstrap-ում CSS-ի անցումային էֆեկտների մեծ մասը (օրինակ, երբ մոդալ երկխոսությունը բացվում կամ փակվում է, կամ սահող անիմացիաները կարուսելներում) կանջատվեն:

Լրացուցիչ ռեսուրսներ