Hygyrchedd
Trosolwg byr o nodweddion a chyfyngiadau Bootstrap ar gyfer creu cynnwys hygyrch.
Mae Bootstrap yn darparu fframwaith hawdd ei ddefnyddio o arddulliau parod, offer gosodiad, a chydrannau rhyngweithiol, gan ganiatáu i ddatblygwyr greu gwefannau a chymwysiadau sy'n ddeniadol yn weledol, yn gyfoethog yn swyddogaethol, ac yn hygyrch allan o'r bocs.
Trosolwg a chyfyngiadau
Mae hygyrchedd cyffredinol unrhyw brosiect a adeiladwyd gyda Bootstrap yn dibynnu i raddau helaeth ar farcio'r awdur, yr arddull ychwanegol, a'r sgriptio y maent wedi'u cynnwys. Fodd bynnag, ar yr amod bod y rhain wedi’u gweithredu’n gywir, dylai fod yn gwbl bosibl creu gwefannau a rhaglenni gyda Bootstrap sy’n bodloni WCAG 2.1 (A/AA/AAA), Adran 508 , a safonau a gofynion hygyrchedd tebyg.
Marcio strwythurol
Gellir cymhwyso arddull a chynllun Bootstrap i ystod eang o strwythurau marcio. Nod y ddogfennaeth hon yw rhoi enghreifftiau o arfer gorau i ddatblygwyr i ddangos y defnydd o Bootstrap ei hun a dangos marcio semantig priodol, gan gynnwys ffyrdd y gellir mynd i'r afael â phryderon hygyrchedd posibl.
Cydrannau rhyngweithiol
Mae cydrannau rhyngweithiol Bootstrap - megis deialogau moddol, cwymplenni, a chynghorion offer personol - wedi'u cynllunio i weithio ar gyfer defnyddwyr cyffwrdd, llygoden a bysellfwrdd. Trwy ddefnyddio rolau a phriodoleddau WAI - ARIA perthnasol , dylai'r cydrannau hyn hefyd fod yn ddealladwy ac yn ymarferol gan ddefnyddio technolegau cynorthwyol (fel darllenwyr sgrin).
Oherwydd bod cydrannau Bootstrap wedi'u cynllunio'n bwrpasol i fod yn weddol generig, efallai y bydd angen i awduron gynnwys rolau a phriodoleddau ARIA pellach , yn ogystal ag ymddygiad JavaScript, i gyfleu union natur ac ymarferoldeb eu cydran yn fwy cywir. Mae hyn fel arfer yn cael ei nodi yn y ddogfennaeth.
Cyferbyniad lliw
Gall rhai cyfuniadau o liwiau sy'n ffurfio palet rhagosodedig Bootstrap ar hyn o bryd - a ddefnyddir trwy'r fframwaith ar gyfer pethau fel amrywiadau botwm, amrywiadau rhybuddion, dangosyddion dilysu ffurflenni - arwain at ddiffyg cyferbyniad lliw (islaw cymhareb cyferbyniad lliw testun WCAG 2.1 o 4.5:1 a argymhellir a chymhareb cyferbyniad lliw di-destun WCAG 2.1 o 3:1 ), yn enwedig pan gaiff ei ddefnyddio yn erbyn cefndir golau. Anogir awduron i brofi eu defnydd penodol o liw a, lle bo angen, addasu/estyn y lliwiau rhagosodedig hyn â llaw i sicrhau cymarebau cyferbyniad lliw digonol.
Cynnwys wedi'i guddio'n weledol
Gellir arddullio cynnwys a ddylai fod yn gudd yn weledol, ond sy'n parhau i fod yn hygyrch i dechnolegau cynorthwyol megis darllenwyr sgrin, gan ddefnyddio'r .visually-hidden
dosbarth. Gall hyn fod yn ddefnyddiol mewn sefyllfaoedd lle mae angen cyfleu gwybodaeth weledol ychwanegol neu giwiau (fel ystyr a ddynodir trwy ddefnyddio lliw) i ddefnyddwyr anweledol hefyd.
<p class="text-danger">
<span class="visually-hidden">Danger: </span>
This action is not reversible
</p>
Ar gyfer rheolyddion rhyngweithiol sydd wedi'u cuddio'n weledol, fel dolenni “sgipio” traddodiadol, defnyddiwch y .visually-hidden-focusable
dosbarth. Bydd hyn yn sicrhau bod y rheolydd yn dod yn weladwy unwaith y bydd yn canolbwyntio (ar gyfer defnyddwyr bysellfwrdd sy'n gweld). Gwyliwch, o'i gymharu â'r dosbarthiadau cyfatebol .sr-only
a'r .sr-only-focusable
dosbarthiadau mewn fersiynau blaenorol, mae Bootstrap 5's .visually-hidden-focusable
yn ddosbarth arunig, ac ni ddylid ei ddefnyddio ar y cyd â'r .visually-hidden
dosbarth.
<a class="visually-hidden-focusable" href="#content">Skip to main content</a>
Cynnig llai
Mae Bootstrap yn cynnwys cefnogaeth i'r prefers-reduced-motion
nodwedd cyfryngau . Mewn porwyr/amgylcheddau sy'n caniatáu i'r defnyddiwr nodi ei ddewis ar gyfer mudiant llai, bydd y rhan fwyaf o effeithiau trawsnewid CSS yn Bootstrap (er enghraifft, pan fydd deialog moddol yn cael ei agor neu ei gau, neu'r animeiddiad llithro mewn carwseli) yn cael eu hanalluogi, ac animeiddiadau ystyrlon ( megis troellwyr) yn cael ei arafu.
Ar borwyr sy'n cefnogi prefers-reduced-motion
, a lle nad yw'r defnyddiwr wedi nodi'n benodol y byddai'n well ganddo symud llai (hy lle prefers-reduced-motion: no-preference
), mae Bootstrap yn galluogi sgrolio llyfn gan ddefnyddio'r scroll-behavior
priodwedd.