Millist CSS omadust kasutaksite juurdepääsetavuse tagamiseks?
sobes.tech AI
Vastus AI-lt
aria-hidden: Peidab elemendi abivahenditehnoloogiatest (skrinnirid), kui see on visuaalselt olemas, kuid semantiliselt liig või võib sisu mõistmist häirida.
tabindex: Kontrollib interaktiivsete elementide fookusjärjestust klaviatuuriga navigeerimisel. -1 välistab elemendi tavapärasest järjekorrast, 0 lisab selle järjekorda, positiivsed väärtused määravad selge järjekorra (mitte soovitatav enamikul juhtudel).
outline: Määrab elemendi ümber raami, kui see on fookuses. Oluline on säilitada või stiilida see, et klaviatuurikasutajad näeksid aktiivset elementi.
visually-hidden: Visuaalselt peidab elemendi, kuid säilitab selle kättesaadavuse skrinnirididele. Sageli kasutatakse vormimärgi (label) peitmiseks, kui kontroll ise on nähtav (näiteks nupuvõti ikoonina).
.visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
pointer-events: none: Keelab elemendiga suhtlemise hiirega, kuid ei mõjuta juurdepääsu klaviatuuri ega skrinniridide jaoks. Kasutatakse sageli dekoratiivsete elementide jaoks aktiivsete alade peal.
cursor: pointer: Muudab kursorit, kui see on interaktiivsete elementide kohal, näidates nende klikkitavust.
color ja background-color: Olulised piisava kontrasti tagamiseks teksti ja tausta vahel, mis on kriitiline nägemispuudega kasutajate jaoks. Soovitatav on kasutada kontrasti kontrollimise tööriistu vastavalt WCAG standarditele.