This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Barrierefreiheit
Miért ne lehetne egy fókuszált elemet elrejteni?
Bárki, aki átmegy egy oldalon a billentyűzet kell látni, hogy hol a fókusz. A tartalomra ragasztható fejlécek, cookie-bannerek és chat ablakok; A fókusz alatta landol és láthatatlan. Az AA szint (2.4.11, új a WCAG 2.2-ben) megköveteli, hogy a fókuszált elem legalább részben látható maradjon. Az AAA szint 2.4.12. kritériuma előírja: teljesen látható, pixel nem takarható el.
Mit igényel a kritérium
Amikor egy elem kap billentyűzet fókusz, nincs része mögött más tartalom a szerző létrehozott: nincs ragadós fejléc vagy lábfej, nincs cookie banner, nincs chat gomb, nincs referencia ablak. A fókuszálás megváltoztatásakor a böngésző csak addig görgethet, amíg az elem a látható területre jut; Semmit sem tud azokról, akik felette állnak. Az oldalnak tehát magának kell biztosítania, hogy a tapadó csík alatt lévő terület a görgetés során tisztán maradjon.
Végrehajtás
A CSS tulajdoni görgetőpárnázat a tekercstartályon olyan nagy helyet foglal el, mint a ragasztószalagok; a böngésző ezután fókuszált elemeket gördít a sáv alá. Az oldalon fekvő ablakok rögzítik a fókuszt (a fókusz az ablakban marad) vagy bezárják, amikor a fókusz az oldalra kerül. Egy chat gomb a sarokban marad kicsi vagy mozog félre, ha egy elem alább.
Így kell ezt kezelni
A mérés áthalad az oldalon a fülkulcs, méri a látható részt minden fókuszált elem és hasonlítja össze ragasztóelemek; Részben látható az AA szintnél, teljesen látható az AAA-nál. Ugyanaz a mérés mindkét értéket megadja. A kritérium a tudás AAA kategóriájába tartozik; a jelentés referenciapontonként tartalmazza a rejtett részesedést.
Példák
Fókuszált mező fele a chat gomb alatt
.chat { position: fixed; right: 0; bottom: 0; width: 320px; height: 120px; }
/* das letzte Formularfeld liegt zur Hälfte darunter */.chat { position: fixed; right: 16px; bottom: 16px; width: 56px; height: 56px; }
html { scroll-padding-bottom: 88px; }Az AA szinten a fókuszált elem egy részét el kell takarni, és nincs pixel az AAA-n.
- Állítsa be a görgős párnázást a tetején és alján a magassága a ragasztó ágyék.
- Lehetővé kell tenni, hogy a cookie-bannerek és a referencia-ablakok a bezárásig összpontosítsanak.
- Átmegy minden sablonon a lap billentyűvel, és megfigyeli a fókuszkeretet; Nem tűnhet el sehol.
- Tartsa lebegő gombok (chat, fel) kicsi és a távolság a szélén.
