Valaki éppen most nyitja meg az oldaladat. Nem úgy, ahogy te szoktad megnézni, nem a nagy monitoron, nyugodt délelőtt, tökéletes fényben, hanem egy buszmegállóban, tűző napon, félig lemerült telefonon, egyetlen kézzel, mert a másikban ott a táska.
Egy másik látogatód a váróteremben ül. Elindítja a videódat, aztán azonnal le is némítja, mert nem akar zajongani. Ha nincs felirat, onnantól csak nézi a képeket, és nem tudja meg, miről beszélsz.
Egy harmadik ember a nagymamád korában van. Nagyobbra állította a telefonján a betűméretet, mert így kényelmesebb. Az oldalad vagy elbírja ezt, vagy szétcsúszik tőle.
Ezek nem szélsőséges esetek. Ez a hétköznap, és ez az akadálymentesítés valódi tárgya.
Ebben a cikkben végigveszem, mit jelent az akadálymentes weboldal a gyakorlatban, kinek segít valójában, miért éri meg foglalkozni vele akkor is, ha semmilyen szabály nem kötelezne rá, és hogyan tudsz nekiállni akkor is, ha egyedül dolgozol, és nincs mögötted fejlesztőcsapat.
Miért került most szóba ez a téma
A weboldal akadálymentesítés az utóbbi időben sokkal többet szerepel a hírlevelekben és a vállalkozói csoportokban, mint korábban. Ennek egyszerű oka van: európai szabályozás született a témában, és a szabályozás körül elindult egy elég hangos, sokszor ijesztgető kommunikáció.
Én nem vagyok jogász, és nem is akarok jogi kérdésekben állást foglalni. Ezért ez a cikk nem arról szól, kire mi vonatkozik jogilag, és mi a teendő ezen a téren.
Ez a cikk tájékoztató jellegű, nem jogi tanácsadás. Ha a saját vállalkozásod jogi helyzetére vagy kíváncsi, azt érdemes szakemberrel átnézetned.
Innentől tehát nem a kötelezettségről lesz szó, hanem magáról a dologról. Arról, hogy mit jelent használhatóvá tenni egy oldalt, és miért jó ez neked meg annak is, aki hozzád érkezik.
Mit jelent valójában az akadálymentesítés
Kezdjük azzal, mi nem.
Nem egy külön „akadálymentes verzió”, amit a látogató valahol elrejtve megtalál, és átkapcsol rá. Nem egy bővítmény, amit feltelepítesz, és onnantól kipipálva érzed. És nem is „a látássérültek külön oldala”, mintha lenne egy sima fő oldal, meg egy másik a többieknek.
Az akadálymentes weboldal egyszerűen annyit jelent, hogy az oldalad akkor is használható marad, ha a látogató nem ideális körülmények között, nem ideális eszközzel és nem ideális képességekkel érkezik.
Ez ennyi. A többi már csak részletkérdés.
Van egy kép, ami sokat segít megérteni. Egy épületnél az akadálymentesítés nem azt jelenti, hogy építesz egy második, csúnyább bejáratot hátul. Azt jelenti, hogy a főbejárathoz vezet egy rámpa is, a kilincs olyan magasan van, ahol elérik, és a felirat elég nagy ahhoz, hogy szemüveg nélkül is el lehessen olvasni. Ugyanaz a bejárat, csak több ember fér be rajta.
A weben ugyanez történik. Ugyanaz az oldal, ugyanaz a dizájn, ugyanaz a hangulat, csak több emberhez ér el.
Nyisd meg a saját oldaladat a telefonodon, kint, napfényben, és görgesd végig úgy, ahogy egy idegen tenné. Ez az első ötperces valóságellenőrzés.
Kinek segít valójában
Ez a cikk szíve, mert itt szokott kiderülni, hogy a téma sokkal szélesebb, mint amire elsőre gondolnánk.
Tartós helyzetek
Az Egészségügyi Világszervezet becslése szerint világszerte nagyjából 1,3 milliárd ember, a népesség 16 százaléka él jelentős fogyatékossággal. Ez minden hatodik ember.
Magyarországon a KSH 2022-es népszámlálási adatai szerint 273 558 fő vallotta magát fogyatékosnak. Ugyanez a felmérés viszont mást is mért: a válaszadók 27 százaléka, körülbelül 1,8 millió ember számolt be mérsékelt korlátozottságról, több mint 9 százalék, nagyjából 640 ezer ember pedig súlyosról.
A két szám nem ugyanazt méri, és ezt fontos érteni, különben félrevezető. A fogyatékosság önbevalláson alapul: az mondja magát fogyatékosnak, aki így tekint magára. A korlátozottság ezzel szemben azt nézi, hogy egy legalább fél éve fennálló egészségi állapot akadályozza-e az embert a mindennapi tevékenységekben. Sokan, akik nem neveznék magukat fogyatékosnak, mégis nehezebben olvasnak, nehezebben kattintanak, nehezebben hallanak.
A látás, a hallás, a mozgás és a megértés eltérései mind számítanak itt. Van, aki képernyőolvasóval használja a telefont. Van, aki csak billentyűzettel navigál, mert az egeret nem tudja pontosan mozgatni. Van, akinek a hosszú, sűrű szövegblokk egyszerűen olvashatatlanok.
Átmeneti és helyzeti korlátozottság
Itt válik igazán érthetővé, hogy ez nem egy szűk kisebbség ügye.
Gondolj a eltört karodra, amivel hat hétig egy kézzel gépelsz. A szemműtét utáni hétre, amikor mindent nagyítva nézel. A csecsemőre a másik karodon, miközben a hüvelykujjaddal próbálsz időpontot foglalni. A tűző napfényre a kijelzőn, ami a halványszürke szöveget teljesen eltünteti. A váróteremre, ahol nem kapcsolhatod be a hangot. A rossz mobilnetre a vonaton, ahol a nehéz, képekkel teli oldal egyszerűen nem töltődik be.
Ezek közül legalább az egyik megtörtént már veled is. Az akadálymentesítés nem egy másik embercsoportról szól, hanem rólad is, rosszabb napokon.
És ott van az öregedés
A látás és a finommozgás mindenkinél változik az idővel. A negyvenes éveink közepétől a legtöbben nehezebben fókuszálunk közelre, a kontrasztérzékenység csökken, a kis felületek eltalálása pedig lassabbá és bizonytalanabbá válik.
Ha a szolgáltatásod ügyfelei között vannak ötven felettiek, és a legtöbb szolgáltató esetében bőven vannak, akkor ez nem elméleti kérdés. Ők azok, akik nem fognak írni neked, hogy „nem tudom elolvasni az áraidat”. Csak visszamennek a keresőbe.
Kérdezz meg egy ismerőst, aki nálad legalább húsz évvel idősebb, hogy nyissa meg az oldaladat, és keresse meg rajta az árakat. Nézd végig, hol akad meg.
Miért éri meg akkor is, ha semmi nem kötelez rá
Négy okot látok, és egyik sem jogi.
Több embert szolgálsz ki
Aki nem tudja használni az oldalad, az nem jelez vissza. Nem ír e-mailt, hogy „figyelj, itt valami nem működik”. Egyszerűen elmegy, és keres valaki mást.
Ez a csendes veszteség, és pont azért nehéz észrevenni, mert nyoma sem marad. A statisztikádban csak annyi látszik, hogy valaki megnyitotta az oldalt, aztán bezárta. Az okot soha nem tudod meg.
Ha valaha volt olyan érzésed, hogy sokan nézik az oldaladat, de kevesen írnak, akkor ez az egyik lehetséges magyarázat a sok közül. Nem biztos, hogy ez a te esetedben az ok, de érdemes kizárni.
Ugyanaz javul, ami a használhatóságot is javítja
Ez a rész szokott meglepetés lenni. Az akadálymentesítés nagy része nem valami külön, speciális munka, hanem pontosan ugyanaz, amitől egy oldal jól használhatóvá válik.
Erős kontraszt a szöveg és a háttér között. Olvasható betűméret. Értelmes, követhető címsorok. Gombok, amiket el lehet találni. Űrlapok, amiken látszik, melyik mezőbe mit kell írni.
Ezek mindenkinek jobbak. Annak is, akinek szüksége van rájuk, és annak is, aki csak siet.
Itt jön képbe a dizájn kérdése is. A halványszürke szöveg világos háttéren évek óta divat, mert letisztultnak és elegánsnak hat. Sokszor viszont pont az olvashatóság rovására megy, és ez az egyik pont, ahol egy sablon önmagában nem old meg mindent. Erről bővebben írtam abban a cikkben, hogy miért nem elég egy szép weboldal sablon a honlapodhoz.
Átfedés a keresővel
Amit az akadálymentesítés kedvéért csinálsz, annak jó része a keresőknek is segít, mert ugyanazt a problémát oldja meg: a gép sem lát, ahogy a képernyőolvasó sem.
Az alt szöveg elmondja, mi van a képen. A rendes címsor-hierarchia megmutatja, hogyan épül fel az oldal. A beszédes linkszöveg elárulja, hova vezet a link. A videó felirata és a hanganyag átirata pedig szöveggé teszi azt, ami eddig csak hang volt.
Konkrét számot itt óvatosan érdemes mondani. A W3C akadálymentesítési üzleti érvei között szerepel az NPR esete, ahol a hanganyagokhoz készített átiratok után 6,86 százalékkal nőtt a keresőből érkező forgalom. Ez egyetlen szervezet egyetlen esete, nem általános szabály, és nem ígérhetem, hogy nálad ugyanez történik. Irányként viszont jól mutatja, hogy a szöveggé tett tartalom máshol is dolgozik.
Ha épp azon gondolkodsz, mitől mozdul a forgalmad, arról külön is írtam, miért esik a weboldalad forgalma, ha semmit nem változtattál rajta.
Márkakérdés
Ahogy az oldalad kinéz, és ahogy működik, az egy állítás rólad. Nem csak esztétikai állítás.
Ha valaki nagyítva is el tudja olvasni a szövegedet, ha a videódon van felirat, ha az űrlapod végigjárható billentyűzettel, akkor ez azt üzeni, hogy gondoltál arra is, aki nem az átlagos úton érkezik. Ez ugyanabból a hozzáállásból fakad, mint a gondos szolgáltatás.
A Fae ügyfelei jellemzően olyan vállalkozók, akiknek fontos, hogyan mutatkoznak meg. Ez a fajta figyelem pont beleillik ebbe: nem hangos gesztus, hanem csendes minőségjelzés.
Hogyan állj neki: a könnyű nyolcvan százalék
Jó hír, hogy nem kell mindent egyszerre megérteni. A hibák túlnyomó része néhány típusból jön.
A WebAIM 2026-os felmérése az egymillió leglátogatottabb kezdőoldalt vizsgálta. Az oldalak 95,9 százalékán találtak gépileg felismerhető akadálymentesítési hibát (egy évvel korábban ez 94,8 százalék volt), átlagosan 56,1 hibát oldalanként. A lényeg viszont az, hogy hat hibatípus adja az összes talált hiba 96 százalékát: alacsony kontrasztú szöveg (83,9%), hiányzó alt szöveg (53,1%), hiányzó űrlapcímke (51%), üres link (46,3%), üres gomb (30,6%), hiányzó nyelvi jelölés (13,5%).
Ez azt jelenti, hogy néhány visszatérő dolog rendbetételével nagyon messzire jutsz. Nézzük végig ezeket.
Szöveg és háttér kontrasztja
Ez a leggyakoribb hiba, és pont a legszebbnek szánt oldalakon a legrosszabb. A világosszürke szöveg fehér háttéren jól mutat a tervezőprogramban, aztán napfényben olvashatatlan.
A szakmai minimum a normál méretű szövegnél 4,5:1 kontrasztarány, nagy szövegnél 3:1. Ennek a hátterét a W3C kontrasztról szóló leírása magyarázza el.
Ellenőrizni egyszerű: kimásolod a szöveged és a hátter színkódját, és beírod a WebAIM kontrasztellenőrzőjébe. Néhány perc az egész, és utána tudod, min kell változtatni. A javítás sokszor annyi, hogy a szürkét egy árnyalattal sötétebbre veszed, ami a dizájnon szinte nem is látszik.
Alt szöveg a képeken
Az alt szöveg az, amit a képernyőolvasó felolvas, és ami akkor jelenik meg, ha a kép nem töltődik be.
A jó alt szöveg leírja, mi látszik a képen és miért van ott. Ha a portrédról van szó, akkor nem az, hogy „kép1″, hanem például az, hogy „Nóra a műtermében, laptop előtt dolgozik”. A díszítő elemeknek viszont, a vonalaknak, foltoknak, háttérmintáknak nem kell alt szöveg, sőt jobb, ha üresen marad, mert csak zajt csinál a felolvasásban.
Ha most készülsz fotózásra, érdemes előre végiggondolni, milyen képeket fogsz hova tenni, mert ez a leírásokat is megkönnyíti. Erről szól az a cikk, így készülj brand fotózásra, hogy fel is tudd használni a képeket.
Egy közepes méretű oldalnál a képek végigjárása nagyjából egy óra.
Értelmes címsor-hierarchia
A címsorok nem betűméretek, hanem szerkezet. Aki képernyőolvasót használ, gyakran a címsorok között ugrál, ahogy te átfutod szemmel az oldalt.
A szabály egyszerű: egy H1 legyen az oldalon, alatta logikus H2-k, azok alatt H3-ak. Ne ugorj szintet, és ne tegyél valamit H3-ba csak azért, mert úgy néz ki jól.
Nézd meg a szerkesztőben az egyik aloldaladat, és olvasd el csak a címsorokat egymás után. Ha így is érthető, hogy miről szól az oldal, akkor rendben van.
Beszédes linkszöveg
A „kattints ide” és az „ide” semmit nem mond arról, hova vezet. Aki csak a linkeket futja át, annak ez üres.
Ehelyett írd bele a linkbe, mi lesz a másik oldalon: „nézd meg a szolgáltatásaimat”, „töltsd le a felkészülési listát”. Ez rögtön kettőt segít, mert az embernek is, a keresőnek is elárulja, mire számítson.
Ez egy húszperces átfutás a főbb oldalaidon.
Űrlapmezők rendes címkéi
A kapcsolati űrlapod mezői mellett legyen valódi címke, ne csak halvány szöveg a mezőben. A mezőbe írt segédszöveg eltűnik, amint elkezdesz gépelni, és onnantól nem tudod, melyik mező mi volt. A képernyőolvasó pedig sokszor nem is olvassa fel.
Töltsd ki a saját űrlapodat, mintha idegen lennél. Ha bármelyik mezőnél elbizonytalanodsz, ott hiányzik valami.
Billentyűzetes navigáció és látható fókusz
Van, aki nem használ egeret. Van, aki csak a Tab billentyűvel halad végig az oldalon.
Próbáld ki: nyisd meg a kezdőlapodat, és nyomogasd a Tab billentyűt. Két dolgot figyelj. Először azt, hogy elérsz-e mindent, a menüt, a linkeket, a gombokat, az űrlapot. Másodszor azt, hogy látszik-e, hol jársz éppen. Ha nincs látható keret vagy kiemelés az aktív elemen, akkor a látogató vakon tapogatózik.
Ez öt perc, és nagyon sokat elárul.
Olvasható betűméret és nagyítható szöveg
A törzsszöveg legyen kényelmesen olvasható méretű, elég sortávval, és ne legyen túl széles a sor. A hosszú, teljes képernyő szélességű sorokban könnyű elveszni.
A másik fele az, hogy a szöveg nagyítható maradjon. Nagyítsd fel a böngésződben az oldalt kétszeresére. Ha szétesik a szerkezet, ha egymásra csúsznak az elemek, vagy ha eltűnik a menü, ott dolgod van.
Videók feliratozása és hanganyagok átirata
Ha van videó az oldaladon, legyen rajta felirat. Ha podcastod vagy hangfelvételed van, legyen mellette szöveges átirat.
Ez nemcsak a hallássérülteknek segít, hanem mindenkinek, aki csendben nézi a tartalmat. A videómegosztók automatikus feliratozása jó kiindulás, de olvasd át és javítsd ki, mert a magyar szakszavakat gyakran félreírja.
Ezt nem kell egyszerre megcsinálni. Válaszd ki azt az egyet, amelyik a leggyorsabban javít a legtöbbet, jellemzően a kontraszt, és a többit vedd sorra a következő hónapokban.
Amit ne várj tőle, és a bővítmény kérdése
Őszintén: nincs olyan kapcsoló, bővítmény vagy „akadálymentesítő sáv”, ami egy kattintással megoldja az egészet.
Ezek az eszközök jellemzően egy kis ikont tesznek az oldal szélére, amivel a látogató nagyíthat, kontrasztot válthat, betűtípust cserélhet. Ez önmagában nem baj. Az viszont nem igaz, hogy ettől az oldal használhatóvá válik, ha a képeken nincs alt szöveg, az űrlapon nincs címke, és a navigáció nem járható be billentyűzettel. A réteg, ami rákerül, nem javítja meg az alatta lévő szerkezetet.
Ugyanez igaz az automata ellenőrzőkre. Hasznosak, gyorsak, és sok mindent megtalálnak, de csak azt, ami gépileg felismerhető. Azt meg tudják mondani, hogy egy képnek nincs alt szövege. Azt viszont nem, hogy a beírt alt szöveg értelmes-e. Azt látják, hogy van címsor. Azt nem, hogy logikus-e a sorrend.
Az emberi ítéletet igénylő rész marad emberi. Ha ezt szeretnéd magad végigjárni, a W3C laikusoknak szánt ellenőrzőlistája pont ezt a szintet célozza: oldalcím, alt szöveg, címsorok, kontraszt, szövegnagyítás, billentyűzet és fókusz, űrlapcímkék, mozgó tartalom, multimédia-alternatívák.
Nem ígérek olyat, amit egy eszköz nem tud teljesíteni. Amit viszont te magad meg tudsz csinálni, az meglepően sok.
Gyakori kérdések
Muszáj ezt csinálnom?
Ebben a kérdésben nem foglalok állást, mert nem vagyok jogász, és a jogi helyzet mindenkinél a saját körülményein múlik. Amit el tudok mondani: az itt felsorolt lépések akkor is hasznosak, ha semmi nem kötelez rá, mert az oldalad használhatóságát javítják.
Mennyi idő az egész?
Ha csak a leggyakoribb hibákat nézed, egy átlagos szolgáltatói oldalnál ez néhány óra munka, nem hetek. A kontraszt javítása és a Tab-teszt fejenként öt-tíz perc, a képek alt szövege egy óra körül van, a videófeliratok pedig annyi időt visznek el, ahány videód van.
Elrontja a dizájnt?
Nem, bár néhány döntést újra kell gondolnod. A leggyakoribb változtatás az, hogy a nagyon halvány szürke szöveg egy árnyalattal sötétebb lesz, és a betűméret picit nő. Ez a legtöbb oldalnál alig látszik, viszont sokkal olvashatóbb lesz tőle a szöveg.
Kell hozzá fejlesztő?
A felsorolt lépések nagy részét egy szerkesztőfelületen, saját kézzel meg tudod csinálni. Fejlesztőre akkor lehet szükséged, ha a fókuszjelzés vagy a billentyűzetes navigáció a sablon kódjából hiányzik, mert az már a téma mélyebb rétegében van.
Elég egy bővítmény az akadálymentesítéshez?
Önmagában nem. A bővítmények kényelmi funkciókat adnak a látogatónak, viszont nem javítják meg a hiányzó alt szövegeket, a rossz címsorstruktúrát vagy a címke nélküli űrlapmezőket. Az alap munkát nem váltják ki.
Honnan tudom, hogy jó lett?
Két úton érdemes haladni. Az automata ellenőrzők megmutatják a gépileg felismerhető hibákat, a saját kézi tesztjeid pedig azt, ami emberi ítéletet igényel: a Tab-teszt, a kétszeres nagyítás, az űrlap kitöltése idegen szemmel, és a képek alt szövegeinek felolvasása magadnak.
Mi van, ha csak most kezdem?
Akkor a legjobb helyzetben vagy, mert az új oldalba eleve bele lehet tervezni ezeket. A kontraszt, a betűméret, a címsorstruktúra és a fókuszjelzés a tervezés része, nem utólagos javítás. Így nincs is mit visszabontani később.
Számít ez a keresőben?
Részben átfedésben van vele. Az alt szöveg, a címsor-hierarchia, a beszédes linkszöveg és a szöveges átirat egyszerre segít az embernek és a keresőnek is, mert ugyanazt teszi érthetővé. Konkrét helyezésbeli javulást viszont nem ígérhetek, mert az sok más tényezőn is múlik.
Amit érdemes megjegyezned
Az akadálymentes weboldal nem külön verzió, nem bővítmény és nem egy szűk csoport ügye. Egyszerűen annyi, hogy az oldalad akkor is működik, ha a látogató nem ideális körülmények között érkezik.
Ez pedig sokkal többször fordul elő, mint gondolnánk. Napfény, félig lemerült telefon, egy szabad kéz, néma váróterem, öregedő szem. A tartós és az átmeneti helyzetek együtt nagyon sok embert érintenek.
A munka nagy része néhány visszatérő dologra szűkíthető: kontraszt, alt szöveg, címsorok, linkszöveg, űrlapcímkék, billentyűzetes navigáció, olvasható méret, feliratok. Ezek ugyanazok, amik a használhatóságot is javítják.
Nincs olyan eszköz, ami mindezt egy kattintással elintézi. A jó hír viszont az, hogy a legtöbb lépés nem nehéz, és nem is kell egyszerre megcsinálni. Egy szempont, egy délután, és máris használhatóbb az oldalad, mint tegnap volt.