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медиумската функција . Во прелистувачите/околините што му дозволуваат на корисникот да ја одреди својата претпочитање за намалено движење, повеќето ефекти на транзиција на CSS во Bootstrap (на пример, кога се отвора или затвора модален дијалог) ќе бидат оневозможени. Во моментов, поддршката е ограничена на Safari на macOS и iOS.

Дополнителни ресурси