Az akadálymentesség (angolul accessibility, röv. a11y) azt jelenti, hogy a weboldalt látás-, hallás-, mozgás- vagy kognitív akadályokkal élők is használni tudják — képernyőolvasóval, billentyűzettel vagy alternatív input-eszközökkel. Az EU 2025-től kötelezővé teszi a kereskedelmi webszolgáltatásoknak (European Accessibility Act).
Mit jelent a gyakorlatban?
- Alt-szöveg minden képhez — hogy a screen reader fel tudja olvasni.
- Megfelelő kontraszt — WCAG AA: szöveg legalább 4.5:1 a háttérhez képest.
- Billentyűzet-navigáció — minden funkció elérhető Tab-bal, látható focus.
- Szemantikus HTML — <button>, <nav>, <main>, <header> — nem csak <div>-ek.
- Figyelmeztetések szöveggel is — ne csak színnel jelezz hibát.
WCAG sztenderdek és szintek
- WCAG 2.2 AA — az iparági minimum, a legtöbb jogszabály ezt írja elő.
- 4 alapelv (POUR) — Perceivable, Operable, Understandable, Robust.
- 13 főiránymutatás — minden POUR alá tartozik 3–4 irány.
- 78 sikerkritérium — konkrét, mérhető követelmények (pl. „minden kép alt-szöveggel”).
- AAA szint — szigorúbb (7:1 kontraszt), nem minden tartalomhoz reális.
Hogyan ellenőrizd az oldalad akadálymentességét?
- Automatikus tool — axe DevTools, Lighthouse Accessibility audit, WAVE.
- Kézi tesztelés — végigmész billentyűzettel, működik-e mindennek a focus.
- Screen reader teszt — NVDA (Windows ingyenes), VoiceOver (macOS), TalkBack (Android).
- Színkontraszt-ellenőrző — Stark Figma-plugin vagy contrast-ratio.com.
- User-testing fogyatékkal élőkkel — semmi sem helyettesíti a valós használatot.
Ami a screen readernek jó, az SEO-nak is — a Google ugyanazon szemantikai jelekből dolgozik. Ha akadálymentes, WCAG-konform oldalt szeretnél, nézd meg az UI/UX tervezés és az egyedi weboldal-fejlesztés szolgáltatásunkat. Lásd a UX audit, SEO és GDPR cikkeket.
