Akadálymentes weboldal (WCAG)

Akadálymentes weboldal: mindenkinek, aki az ügyfeled lehet

Egy weboldal akkor jó, ha mindenki használni tudja – az is, aki képernyőolvasóval böngészik, aki csak billentyűzetet használ, aki gyengénlátó, színtévesztő, remeg a keze, vagy épp tűző napon, egy kézzel próbál ajánlatot kérni a telefonján. Az akadálymentes fejlesztés pontosan erről szól: a WCAG 2.2 nemzetközi szabvány szerint úgy építjük vagy alakítjuk át az oldalad, hogy senki ne akadjon el rajta.

Ez az oldal, amit most olvasol, maga is így készült: az automatizált WCAG 2.2 tesztek az általunk vizsgált oldalakon hibát nem találtak, a szövegek kontrasztja pedig a legszigorúbb (AAA) szintet is eléri.

Miért kell? Az emberi oldal

Sokkal több embert érint, mint gondolnád

Az Egészségügyi Világszervezet (WHO) becslése szerint a világ népességének mintegy 16%-a – nagyjából minden hatodik ember – él jelentős fogyatékossággal. Ehhez jön az idősödő társadalom: a romló látás, a lassuló reflexek és a remegő kéz a 60 feletti korosztályban mindennapos.

Ideiglenes és helyzetből fakadó akadályok

Egy eltört kar, egy szemműtét utáni lábadozás, egy zajos villamos, ahol nem lehet hangot bekapcsolni, vagy egy erős napfényben használt telefon – ilyenkor bárki „akadályozott felhasználó”. Az akadálymentes oldal nekik is működik.

Méltóság és önállóság

Egy vak felhasználó számára a jól megírt webshop azt jelenti, hogy segítség nélkül, önállóan vásárolhat. Egy idős ügyfélnek azt, hogy egyedül is foglalhat időpontot. Ez nem extra szolgáltatás, hanem alapvető emberi igény.

Miért éri meg? A pénzügyi oldal

Szélesebb ügyfélkör – kiaknázatlan piac

Ha a versenytársaid oldalát nem tudja használni egy látássérült vagy idős vásárló, de a tiédet igen, nálad fog vásárolni. Az akadálymentesség közvetlenül bővíti a megszólítható ügyfelek körét – és ezek az ügyfelek jellemzően hűségesek ahhoz, aki kiszolgálja őket.

Több konverzió mindenkinél

A jobb kontraszt, a világos űrlapok, az érthető hibaüzenetek és a nagyobb gombok minden látogatónak segítenek. Kevesebb elakadás a pénztárban, kevesebb félbehagyott ajánlatkérés – ez minden felhasználónál érezhető.

Jobb Google-helyezés

A keresőrobot „vak felhasználó”: ő is a szöveges tartalmat, a címsor-szerkezetet, a képek alt szövegét és a linkek szövegét érti. Ami a képernyőolvasónak jó, az a keresőoptimalizálásnak is.

Kisebb jogi és üzleti kockázat

Az európai akadálymentességi irányelv (European Accessibility Act, 2019/882/EU) 2025. június 28. óta számos digitális szolgáltatásra – többek között az e-kereskedelemre – akadálymentességi követelményeket ír elő. A közszféra honlapjaira Magyarországon a 2018. évi LXXV. törvény vonatkozik. A követelmények a vállalkozás méretétől és tevékenységétől függnek (a szolgáltatást nyújtó mikrovállalkozásokra például kivétel vonatkozhat), de a szabályozás iránya egyértelmű: az akadálymentesség elvárássá válik.

Olcsóbb most, mint később

Egy új oldalnál az akadálymentesség a tervezés része, minimális többletköltséggel. Egy kész oldal utólagos átalakítása mindig drágább – egy jogi vagy ügyfélpanasz miatti sürgős javítás pedig a legdrágább.

Röviden: az akadálymentes weboldal több embert ér el, többet ad el, jobban rangsorol, és kisebb kockázatot hordoz. Nem jótékonyság – jó üzlet.

Mit csinálunk pontosan?

1. Akadálymentességi átvilágítás

A meglévő oldalad legfontosabb oldalait és folyamatait (főoldal, szolgáltatások, kapcsolati űrlap, kosár, pénztár) a WCAG 2.2 A és AA szintje szerint vizsgáljuk:

• automatizált teszteléssel (iparági szabvány tesztmotorral),
• kézi ellenőrzéssel: billentyűzetes bejárás, fókusz láthatósága, 320 px-es újratördelés, megnövelt szövegköz,
• képernyőolvasós próbával,
• színkontraszt-méréssel minden szöveg- és felületelemen.

Az eredmény egy közérthető, rangsorolt jelentés: mi a probléma, kit érint, mennyire súlyos, és hogyan javítható.

2. Javítás – a dizájn megtartásával

A legtöbb hiba úgy javítható, hogy az oldal ránézésre szinte semmit nem változik: árnyalatnyi színhangolás, láthatóbb fókuszkeret, jobb címkék, helyes szerkezet. Nem „akadálymentes verziót” csinálunk, hanem egyetlen, mindenkinek jól működő oldalt.

3. Akadálymentes fejlesztés az alapoktól

Új weboldalt, webshopot vagy webalkalmazást eleve a WCAG 2.2 szerint tervezünk és fejlesztünk – így nincs utólagos javítási költség.

4. Akadálymentességi nyilatkozat

Elkészítjük az oldalad akadálymentességi nyilatkozatát a valós vizsgálati eredmények alapján, visszajelzési lehetőséggel.

5. Szerkesztői oktatás és felügyelet

Az akadálymentesség nem egyszeri állapot: minden új tartalomnál figyelni kell rá. Megmutatjuk a szerkesztőknek, hogyan írjanak jó alt szöveget, címsort és linkszöveget, a karbantartás keretében pedig rendszeresen újramérjük az oldalt.

Mire figyelünk? (A legfontosabb WCAG-elvek a gyakorlatban)

• Kontraszt: minden szöveg jól olvasható a háttéren – nálunk ahol lehet, a szigorúbb AAA szinten.
• Billentyűzet: minden menü, gomb, űrlap és felugró ablak egér nélkül is kezelhető, logikus sorrendben.
• Látható fókusz: mindig egyértelmű, hol jár a billentyűzettel navigáló felhasználó.
• Képek és ikonok: értelmes alt szöveg vagy – díszítőelemnél – rejtés a képernyőolvasó elől.
• Szerkezet: helyes címsorok, tájékozódási pontok, „ugrás a tartalomra” link.
• Űrlapok: címkék, kötelező mezők jelölése, érthető, a mezőhöz kötött hibaüzenetek.
• Mozgás: az animációk tiszteletben tartják a csökkentett mozgás beállítást, a mozgó tartalom megállítható.
• Újratördelés és nagyítás: az oldal 320 px szélességen és 200%-os nagításnál is használható, vízszintes görgetés nélkül.
• Érintési célok: a gombok és linkek elég nagyok ahhoz, hogy remegő kézzel vagy kesztyűben is el lehessen találni őket.

Hogyan dolgozunk?

1. Ingyenes előzetes felmérés: megnézzük az oldalad, és őszintén megmondjuk, mekkora munkáról van szó. 2. Részletes átvilágítás és jelentés, fix áras ajánlattal a javításra. 3. Javítás tesztkörnyezetben, az élő oldal zavarása nélkül. 4. Újramérés és átadás – automatizált és kézi teszttel igazolva. 5. Akadálymentességi nyilatkozat és szerkesztői útmutató.

Ha szeretnéd tudni, hol tart ma a te oldalad, kérj ingyenes előzetes felmérést – vagy olvasd el korábbi cikkünket az akadálymentes weboldal alapjairól.