Որ CSS հատկությունը կօգտագործեիք հասանելիությունը ապահովելու համար?
sobes.tech AI
Պատասխան AI-ից
aria-hidden: Թաքցնում է տարրն օգնական տեխնոլոգիաներից (էկրանային ընթերցողներից), եթե նրա ներկայությունը տեսողական է, բայց սիմանտիկապես ավելորդ կամ վնասակար է բովանդակության ըմբռնման համար:
tabindex: Կառավարում է ինտերակտիվ տարրերի ֆոկուսի հերթականությունը ստեղնաշարի միջոցով նավիգացիայի ժամանակ: -1 դուրս է բերում տարրն ստանդարտ հերթականությունից, 0 ներառում է այն, իսկ դրական արժեքները հստակ հերթականություն սահմանում են (ոչ խորհուրդ է տրվում մեծ մասի դեպքերում):
outline: Սահմանում է շրջանակ տարրին, երբ այն կենտրոնացված է: Կարևոր է պահել կամ ձևափոխել այն, որպեսզի ստեղնաշարի օգտվողները տեսնեն ակտիվ տարրը:
visually-hidden: Տեսողականորեն թաքցնում է տարրն, բայց պահում է նրա հասանելիությունը էկրանային ընթերցողների համար: Սովորաբար օգտագործվում է ձևի նշագծերը (label) թաքցնելու համար, երբ ինքնըստինքյան կառավարման տարրը տեսանելի է (օրինակ, պատկերակով կոճակ):
.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: Դադարեցնում է մկնիկի միջոցով տարրին փոխազդեցությունը, բայց չի ազդում ստեղնաշարի և էկրանային ընթերցողների հասանելիության վրա: Կարող է օգտագործվել դեկորատիվ տարրերի համար, որոնք գտնվում են ակտիվ տարածքների վրա:
cursor: pointer: Փոխում է կուրսորի տեսքը, երբ այն անցնում է ինտերակտիվ տարրերի վրայով, ցույց տալով, որ դրանք սեղմելի են:
color և background-color: Կարևոր են բավարար կոնտրաստ ապահովելու համար տեքստի և ֆոնի միջև, ինչը կարևոր է տեսողական խանգարումներ ունեցող օգտվողների համար: Խորհուրդ է տրվում օգտագործել կոնտրաստի ստուգման գործիքներ՝ համապատասխան WCAG ստանդարտներին։