Befogadó tervezés, azaz miért a webes akadálymentesítés (a11y) a sikeres UX kulcsa?

Hogyan tegyük a webet mindenki számára hozzáférhetővé — és miért kulcsfontosságú ez a felhasználói élmény szempontjából?

Előszó

A webes akadálymentesítésről régóta tudok, viszont 2020-ban kerültem hozzá projekt szinten közelebb, akkor szerencsére eléggé el kellett mélyülnöm, főleg a technikai alapjaiba és azóta egy nagyot csavart a tervezési gondolkodás-módomon.

Ha sok UX vagy design szakmai cikket olvasol, akkor nap-mint-nap szembe találkozol az akadálymenteségről szóló témákkal. A témáról remek, ámbár kezdők számára “száraz” weboldalak léteznek, ilyen a WebAIM.org vagy a sokkal technikaibb W3C-WAI, de itt a medium.com-on is rengeteg angol (vagy más) nyelvű cikk született már.

Szögezzük le: nem vagyok akadálymentes szakértő, erre ott van pl. Szántai Károly vagy Edelényi Zsolt, de a MEOSZ is szívesen segít a téma mélyebb megismerésében. E terület elsajátítása nagyon sok tapasztalatot igényel; a nagy cégek nem hiába állnak partnerségben web-akadálymentesítési szakértőkkel, vagy a még nagyobbak rendelkeznek házon belül ilyen kompetenciával, tehát a tervezési folyamat részét képzi az akadálymentesítés.

Ezt a cikket viszont azért írtam meg, mert 2025. júliusában hatályba lép az Európai Akadálymentességi Direktíva így a fenti téma nem csak technikai, hanem tervezési szempontból is fontossá vált.

Igyekeztem a neten elérhető népszerű, valamint a kevésbé ismert információkat a teljesség igénye nélkül összefoglalni, megfűszereztem a saját tapasztalataimmal, de a legfőbb célom, hogy kezdőlökést adjak az olvasóknak, hogy minél többen segítsük egymást ezzel a gondolkodásmóddal nem csak a webes és digitális térben, hanem az élet többi területén is.

Akadálymentesítésről röviden

Az “akadálymentesség” vagy “akadálymentesítés” kifejezés a fizikai és szellemi fogyatékossággal élők számára készült termékek, eszközök, szolgáltatások vagy környezetek tervezésére utal. Az iparban röviden A11Y-nek hívják és azért 11, mert az angol aCCESSIBILITy szóban az A és Y karakterek között, pont 11 betű található. Angolul szokás ally-nak is mondani, amit a magyarban is hallottam már visszaköszönni.

Az akadálymentesítés arról szól, hogy a dolgokat mindenki számára hozzáférhetővé tegyük, függetlenül attól, hogy nyilvánvaló fogyatékossággal rendelkezik-e vagy sem. Apropó, a népesség 15%-a küzd valamilyen könnyebb vagy súlyos, ideiglenes vagy tartós fogyatékossággal, ami durván 1 -1,3 milliárd főt jelent. Hasonló az idős korúak száma a világban, és kb. még 10% azok azon embereknek az aránya, akik ugyan nem élnek fogyatékossággal, de akadályoztatva vannak a mindennapok során.

Az akadálymentesítés jogi és üzleti oldala

A 2025-ben életbe lépő Európai Akadálymentességi Törvény (EAA) célja, hogy biztosítsa az egyenlő hozzáférést a termékekhez és szolgáltatásokhoz mindenki számára, beleértve a fogyatékkal élőket is. Az EAA nemcsak a digitális, hanem a fizikai termékek és szolgáltatások akadálymentességét is megköveteli, különösen az olyan területeken, mint az e-kereskedelem, közlekedés, pénzügyi szolgáltatások és média.

A törvény értelmében, ha egy vállalkozás nem felel meg az előírásoknak, az súlyos következményekkel járhat, beleértve pénzbírságokat, amelyek akár 60 000 euróig is terjedhetnek. Emellett bizonyos esetekben akár 18 hónapos börtönbüntetést is kiszabhatnak a legsúlyosabb esetekben​.

A törvény célja, hogy minden uniós tagállamnak egységes minimumkövetelményeket állítson fel, bár egyes országok szigorúbb helyi szabályokat is bevezethetnek.

Tervezz “egyre”, érj el sokakat

Nem vagyunk egyformák és mindenkit megillet az egyenlő bánásmód, ezért tervezéskor ezt figyelembe véve nagyban segíthetjük a fogyatékossággal élőket is.

Viszont nem minden akadálymenetes megközelítés szolgál ki csak fogyatékos személyeket, mivel vannak olyan szituációk, amik egy nem fogyatékossággal élő számára is kihívást jelenthetnek. Ilyen a sötétség vagy a nyári vakító napsütés, amikor nem látsz megfelelően dolgokat. Vagy ha szükséged van a mobiltelefonon található információra, de nem tudod a képernyőt nézni pl. vezetés közben. Az is egy kihívás, ha nem beszéled egy idegen ország nyelvét, vagy ha a boltban elromlott a POS terminál és nálad nincsen készpénz. Akadályoztatva vagy és a tervezőknek erre megoldást kell találniuk.

Tehát tervezéskor az egyetemesség elvét alkalmazva, a projekt elejétől úgy kell tervezni a digitális megoldást, hogy az mindenki számára egyenlő eséllyel használható.

Ott vannak a különféle termékek, amiket eredetileg a fogyatékkal élőknek terveztek, de később már a hétköznapjaink része lett. Ilyen például az írógép is, ami eredetileg a látássérült embereknek készült, amikor még mindenki tollal írt. Később népszerűsége megugrott, mert olvashatóbb szöveget lehetett gyorsan begépelni. Később az írógép inspirálta a számítógépek tervezését is.

De ilyen, ún. asszisztív technológiák, még a felolvasó szoftverek vagy a diktáló funkciók, amik szintén a fogyatékkal élők számára készültek eredetileg, de mostanra már “alapfelszereltség” a mobilokban, és akár magyar nyelven is diktálhatunk vagy olvastathatunk fel szöveget vezetés közben A témában egyébként egy remek magyar specifikus cikk is született a Qubiton: Egy látássérült embernek ma az iPhone-ja az egyik legnagyobb segítsége. Aztán ott vannak a shopper marketingesek kedvenc eszközei: a fej- és szemkövető megoldások, amikkel bármilyen egyén viselkedését lehet vizsgálni vásárlás közben. Ezekkel akár webes felhasználói szokásokat is vizsgálhatunk, amivel látjuk, hogy egy látogató képernyő mely részére tekint, aztán végül hova vagy mikor kattint. A felirat a filmeken, videókon pedig nem csak a hallássérülteknek fontos, hanem azoknak is, akiknek nincsen lehetőségük hanggal nézni azokat (pl. lemerült a fülesük a buszon, vagy éppen babát altatnak).

Tehát,

ha akadálymentességet szem előtt tartva tervezünk, sokszor egy sokkal szélesebb közönséget érünk el vele, mint akiknek a problémáját szerettük volna megoldani.

Ezt “curb-cut” jelenségnek vagy a magyarul nem nagyon használatos járdaszegély jelenségnek is nevezik, mivel pl. az Egyesül Államokban a lecsapott végű járdaszegélyek nagyon sok embernek jelentenek segítséget a szabad mozgásban.

De nézzünk egy általánosabb példát: ha figyelembe vesszük egy végtag nélkül élő felhasználó igényeit, máris megoldást szállítasz az olyanoknak, akik a zötykölődő buszon kapaszkodva nyomkodják a mobiljukat vagy azoknak, akik éppen kisbabájukat próbálják régóta nyugtatni és közben a te appodat bújják. Igaz, ez fordítva gondolkodva is helytálló, viszont az a tapasztalatom, hogy sokszor egyszerűbb a fogyatékossággal élők szemszögét figyelembe venni, mint az Edge case-eket, tehát a ritkán bekövetkező eseteket kutatni. Nem mellesleg, segíti a tervezést is, hiszen várhatóan a leggyorsabb bejárható utat találjuk meg, amivel sok felhasználó is nyer, nem csak a fogyatékkal élők.

Más példán keresztül szemléltetve ez egy olyan felfogás, mint az űrkutatás: “minek kutatni az űrt, hiszen olyan nagy és a Földön is bőven van még mit tenni?” — tesszük fel a kérdést. Viszont a kutatások hozadékát nézve, már nem is olyan felesleges az egész, hiszen már most rengeteg olyan technológia jött létre, ami a földi életet tudja segíteni és valószínűleg csak a Földön kutatva nem is találtuk volna meg.

Nem utolsó sorban a Google és más keresőszolgáltatások robotjaira is úgy gondolj, mint egy akadályoztatott felhasználóra, aki a saját módszereivel fogja feltérképezi a weboldaladat. Ha ez könnyen történik, tehát technikailag felkészítetted a weboldaladat (erről lejjebb részletesen írok), akkor ezt a keresőrobot is jutalmazni fogja, amivel az organikus keresőtalálatokban is előrébb fogsz kerülni.

Akadálymentes felületek

Mára az akadálymentesen megtervezett digitális megoldások észrevehetetlenek, beleolvadnak az adott megoldás funkcionalitásába. Pl. korábban magyar kormányzati portálokon vagy pénzügyi intézetek felületén lehetett látni a látássérülteket célzó sárga alapon 3 pöttyös ikont (aminek a története elég érdekes), ami azóta fokozatosan tűnik el. A célja az volt, hogy egy akadálymentes felületre navigálja a látogatót, ahol csak a tervező által feltételezett legfontosabb funkciók és információk voltak elérhetők egy kontrasztos felületen.

Miért halt ki a sárga-fekete pöttyös megoldás?

Egyfelől nem tudhatjuk, hogy egy fogyatékkal élő látogató milyen információszerzés vagy ügyintézés céljából látogatja meg az oldalt és sok esetben ezek az egyszerűsített oldalak nem tartalmazzák ezeket az információkat. Másfelől ezek a különleges felhasználók beépülő böngésző modulokat fognak használni a szörföléseik során, amivel a saját kívánalmaikra szabhatják a böngészett tartalmak stílusát.

Az Android és iOS eszközökön appokon belül még nem ennyire egyszerű a helyzet, de szerencsére pl. a képernyőkön a sötét mód egyre népszerűvé válik, amit nem csak a gyengénlátók, de a fogyaték nélkül élők is előszeretettel használnak, hiszen nem fárasztja annyira a szemet.

Ha valaki viszont teljesen elveszítette a látását, ezek a megoldások nem elegendők: ők speciális szoftvereket fognak használni, amik segítik őket a gépelésben vagy felolvassák a szövegeket és azonosítják a mások által látható elemeket, esetleg külön eszközzel tapinthatóvá teszik azokat.

Az érintőképernyős eszközöket, mint az okostelefon vagy a tablet olyanok is használják, akik nem tudják az ujjukat használni. Van aki a lábát, vagy az orrát használja, de vannak olyanok akik külső perifériákat csatlakoztatnak ezekre az eszközökre. Nagyon jó példa az eszközök szemléltetésére Christopher Hills videói, aki remekül szemlélteti a mindennapok digitális kihívásait — ő legfőképpen switch eszközt használ.

Tehát a fogyatékkal élőknek már megvannak a bevált megoldásuk, szokásuk, a tervezőknek és fejlesztőknek erre kell ráépülniük.

Másfelől a mobileszközök jelenthetnek egyre nagyobb segítséget. Évről-évre az Apple és a Google azon dolgozik, hogy a mobileszközeiken minél könnyebben használhatók legyenek a VoiceOver és a Talckback funkciók sima érintőképernyőn is, amiket nem csak a fogyatékkal élők tudnak kihasználni, hanem olyan felhasználó is, akinek nincsen lehetősége a képernyőt figyelni, mert például vezet.

Ha már látás, akkor még ott vannak a színtévesztők, akikből a leggyakoribb a piros és a zöld színeket tévesztők. Képzeld el, hogy nekik mennyire nehéz a weboldalak böngészése és mennyire fontos a megfelelő kontraszt és színek használata (erről is picit később).

A legtöbb oldal tartalmaz különböző animációkat a figyelem megragadására (pl. egy hibaüzenet megjelenítésére) vagy akár a parallax effekttel is el tudjuk szeparálni a hátteret a tartalomtól, ami így (ideális esetben) könnyebb olvashatóságot eredményez, hiszen nem olvad annyira bele. Menő dolgok, szép lesz az oldal, DE! Ha tériszonyos vagy, esetleg utazás közben szoktál rosszul lenni vagy csak fáj a fejed ha sokáig nézed a képernyőt, akkor gondolj bele, hogy egyesek az ilyen animációk miatt érzik ezt a szédülést, hányingert vagy akár fájdalmat is. Lehet, hogy még nem hallottál róla, de ezeket a hatásokat lazán csoportosítják az úgynevezett vestibuláris rendellenességek közé. Ők nap mint nap tapasztalják ezeket a dolgokat, gyakran akkor, amikor váratlan, nagyszabású animációkkal találkoznak. Ez az akadálymentesítésnek egy olyan területe, amelyet még csak most kezdünk megismerni, de pl. az iOS-ben már van olyan funkció, amivel ezek az animációk csökkenthetők.

Gondoljunk a spektrumzavarral küszködőkre, akik a nem konzisztens vagy lineáris megoldásoktól zavarodnak meg. Számukra különösen fontos a megszokott, visszatérő elemek használata, de szintén fontos az is, hogy egy hibaüzenet mindig a problémás területen jelenjen meg jól látható helyen, mindaddig, amíg a hiba elhárításra nem került.

Gyakorlati tanácsok az akadálymentesítő UX tervezéshez

1. Kutatás

1.1. Alakíts perszónákat

Nagyon fontos megismerni a felhasználóidat és a UX kutatás során a perszónák kialakításakor érdemes az interjúzás fázisában keresni fogyatékkal élőket, akár az ismeretségi körökből, akár különböző Facebook csoportokban. Tedd fel mindenkinek ugyanazokat a kérdéseket és próbáld megfigyelni őket a mindennapokban vagy a munkájukban, mert rengeteg olyan dologra nem is gondolunk, ami nekik mindennapos használati eszköz.

Ha nincs interjúk készítésére lehetőség, akkor ajánlom egy másik bejegyzésemet, ami kiindulópontot adhat a11y perszónákhoz: “Az akadálymentesítési problémák ábécéje — avagy kis segítség a11y perszónák kialakításához”

1.2. Mérj

Általában véve az akadályoztatott felhasználókat nehéz (inkább lehetetlen) hatékonyan kiszűrni pl. egy Analytics riportból, tehát itt inkább a klasszikus fájdalompontok megtalálása lesz a cél, amivel a legtöbb felhasználó találkozik.

Esetleg érdemes lehet mérni azt, hogy a felhasználók milyen alacsony felbontásban vagy milyen mélységben nagyítanak bele az oldalba. Ez utóbbihoz szükséged lesz GTM (Google Tag Manager) kódra is. A billentyűzet események figyelése is érdekes lehet, de ezeket nagyon körültekintően kell beállítani, lehetőleg ne zavarjanak be más mérőszámokba. Ezzel akár azt is vizsgálhatod, hogy mennyire hatékony a keresőd úgy, hogy a CTRL+F (a böngésző oldalon belüli keresője) hol, hányszor lett behívva.

2. Tervezés

Ha rövid szeretnék lenni, akkor a W3C WAI-WCAG 2.1 Level AA sztenderdnek megfelelően tervezzünk. Viszont tapasztalataim szerint az ajánlás annyira tömény és annyira sok (főleg fejlesztőknek szóló) technikai megoldásokat fogalmaz meg, hogy inkább összegyűjtöm a felhasználói élmény tervezéséhez szükséges fontosabb információkat. A lenti tervezési javaslatok a klasszikus UX tervezéssel kapcsolatos javaslatokat nem feltétlen tartalmazzák csak azokat, amik különösen fontosak a webes akadálymentesítés világában.

További segítséget adhat az Informatika a Látássérültekért Alapítván Infoalap.hu/egyetemes weboldala is akik a Vodafone Magyarország Alapítvány karöltve készítettek egy oldalt, ami magyarul foglalja össze a lényeges információkat és bemutatja a jó megoldásokat is.

2.1. Gondold át

Egy “látványcsomag” több elemből épül fel: részben dekoratív, részben informatív és részben funkcionális. Mielőtt belecsapnál, először kérdezd meg magadtól, hogy:

• Mi a terved általános célja?
• Mi a legjobb módja ennek közvetítésére?
• A látvány mely részei dekoratívak, informatívak vagy funkcionálisak?

Ha ezeket meg tudtad válaszolni, akkor könnyebb lesz belecsapni.

2.2. Kontrasztarány és színek

Tervezés során ügyelj a megfelelő kontrasztarányok és elemnagyságok betartására. Erre pl. a WebAIM.org kontraszt-ellenőrzője is már elegendő, de vannak már komplexebb, tervezőeszközökbe ágyazható megoldások is (pl. Figmába pluginek), amik ha nem is mindig, de nagy részben hasznosak tudnak lenni.

Fentebb említettem, hogy a színtévesztők esetében a piros és zöld a kerülendő. Erre az egyszerű javaslatom az, hogy:

• ne csak színekkel operálj, ahol fontos egy visszajelzés (pl. beviteli mezőkön, űrlapokon), hanem használj ikonokat;
• egyértelműen jelezd megfelelően pozícionálva, hogy két vagy több CTA gomb közül melyik a legmagasabb prioritású (pl. helyezd a többihez képest jobb oldalra a gombot, ha tovább visz a folyamatban vagy felülre, ha beküldés);
• illetve igyekezz kerülni a zöld és a piros színt a vizuálban vagy legalábbis ne egy kontextuson belül használd őket (pl. diagramm).

Érdemes a terveket tesztelni különféle színtévesztő-ellenőrző megoldásokkal is folyamatosan.

Érdekesség, hogy a szürke drótvázak azért is remek megoldások, mert lényegében a komolyabb színtévesztők szemszögéből mutatják meg az eredményt. Míg a színek megfelelő használatával remekül el lehet különíteni a grafikai elemeket, addig a fekete fehér elrendezés megmutatja, hogy mik azok az elemek, amikre nem elég csak a színek szerinti megkülönböztetés.

2.3. Tartalom és információ

Ami sok cégnél kimarad a tervezési folyamatból, az a szövegírás, hiszen az A11Y esetén nagyon fontos a minőségi szöveges tartalom. Erre jó lehet akár egy UX szövegíró / UX copywriter is, ahogy egy korábbi cikkemben már említettem.

Az csak hab a tortán, hogy egy átgondolt tartalmi architektúra és pontos szövegezés nem csak a látogatókat, hanem a keresőrobotok és a böngésző alapú AI botok munkáját is segíti. Az oldal SEO-ja minőségibb lesz, az organikus SERP rangsorolásban is előkelőbb helyre kerül az oldalunk, arról nem is beszélve, hogy akár ingyen reklámot is kaphatsz az OpenAI ChatGPT, a Google Gemini, az Anthropic Claude és a többi mesterséges intelligencia alapú szolgáltatásokban, mert azok hivatkozni tudnak a Te tartalmaidra, hiszen azt ők minőséginek értékelik.

Tehát tervezéskor ügyeljünk a megfelelő, jól átgondolt információs és tartalmi architektúrára, amely során igyekezzünk csökkenteni az információ megszerzésével járó vagy a feladat elvégzéséhez szükséges utat. Javaslom, hogy egy aloldal vagy információ ne csak egyféleképpen legyen megközelíthető, hanem a tartalom-zsúfoltság határán belül több irányból is elérhető maradjon.

Itt fontos még megjegyezni a konzisztens és egyértelmű megfogalmazást és grafikai elemek használatát az egyes interakciót igénylő eseményekre vagy akár csak az információ átadásra. A célunk az, hogy a felhasználók minél hamarabb megtanulják az oldal használatát, ezért vagy a jól bevált webes gyakorlatokat (best practice) alkalmazzuk, vagy az oldalt úgy építsük fel, hogy az könnyen megtanulható legyen. A fentiekre a legjobb megoldás ha UI kitet építesz vagy Design Systemben gondolkodsz, azon belül is javasolt az Atomic Design irányelveket követni, hogy a felhasználók mindig konzekvens elemekkel találkoznak, tehát tudják pl. az akciógombok ugyanazt a stílust használják minden felületen és jól elkülöníthető legyen az elsődleges és a másodlagos gombok is.

A legjobb megoldás erre pl. a Bootstrap vagy az olyan nagyvállalatok dizájn rendszerének akadálymentes részének megismerése, mint az IBM Carbon, a Microsoft Fluent, a Google Material, vagy az Apple akadálymentes iránymutatásainak megismerése és a benne foglaltak használata.

A honlapunk biztosítsunk lehetőséget a felhasználó rendszerszíneihez való igazításra (pl. világos / sötét mód), ami főleg a hírportáloknál és applikációknál nagyon népszerű.

A fókuszrend, azaz a TAB (és Shift+TAB) billentyűvel bejárható információk kialakítása is része az akadálymentesítésnek, mert ezáltal elkerülhető, hogy a csak billentyűvel operáló felhasználók, túl hosszú utat járjanak be a megfelelő tartalom eléréséhez. Például, ha egy “kártyára” érünk a TAB-os navigációval, akkor ne menjen végig külön-külön az egyes elemeken (pl. cím, kép, lead szöveg, akció gomb), hanem a kártyát egy egészként értelmezze. Szintén fontos meghatározni, hogy a főmenüt egyszerűen át lehessen ugrani, illetve a nyilak, sortörés és a szóköz billentyűk funkcióit is meghatározhatjuk, bár ezeket a böngészők a legtöbbször maguktól szépen lekezelik, jellemzően a helytelen JavaScript kódolás szokta elrontani.

A picit sem egyértelmű beviteli mezőkhöz adj súgó szöveget vagy tooltipet, biztosíts a jelszó mezőkhöz megtekintési funkciót, illetve, ha a folyamatban könnyen el lehet akadni, adj segítő útvonalat (pl. “Nem tudok bejelentkezni”).

Gondoljunk a vestibuláris rendellenességgel élőkre (így vele együtt másokra is) és minimalizáljuk az ismétlődő, a nagy, a villogó és automatikusan induló animációkat a felületeken. Egy komplexebb weboldalon az is megoldás lehet, ha erre biztosítunk pl. a felhasználói profilon belül egy kapcsolót, amivel ki is lehet iktatni ezeket az animációkat.

Fontos, hogy tablet nézetre is optimalizáljunk, mivel ezzel nem csak a tabletről böngésző felhasználókat szolgáljuk ki, hanem azokat is, akik belenagyítanak a weboldalunkba akár egy HD (vagy nagyobb felbontású) képernyőn vagy csak átállítják a monitor felbontását nagyon alacsonyra vagy a böngészőt a látok számára lehetetlen nagyságúra zsugorítják össze, hiszen a képernyőfelolvasónak nem kell nagyobb méret. Klasszikus megoldás még, ha a layoutot letervezzük 200%-os nagyításra is.

Tervezz alternatív megoldást az összetett interakciós folyamatokra. A legjobb példa erre a digitális térképek, ahol a kétujjas nagyítás sok embernek könnyebbséget jelenthet a gyors pozícionálásban, de nem minden esetben tud megfelelően működni, ezért a sokkal egyszerűbb “+” és “-” gombokat is jelenítsük meg, mint nagyítási lehetőség és megfontolandó a nyilak bevezetése is, ha az összhatást nem lényegesen befolyásolja.

Törekedj arra, hogy a feltöltésre kerülő médiatartalom tartalmazzon feliratkozást és szöveges kivonatot is. Egy kivonat ráadásul a SEO-t is rendkívül segíti, mert sokszor a keresőrobotok technikailag nem mindig tudnak belemászni egy kevésbé ismert webes-médialejátszó feliratkezelőjébe, és ez a legbiztosabb módszer. A legjobb talán, ha a Youtube-ra töltjük fel az anyagokat, feliratot csatolunk hozzá, így több forrásból is megtalálható lesz a tartalom és a robotok is szeretni fogják.

Ugyan nem közvetlenül akadálymentesítés, de ha a weboldalon ügyelünk a bővített kivonat vagy strukturált adat ( avagy Structured Data, de ismert még Rich Snippet / Google Rich Result / Schema.org néven is) beépítésére és helyes használatára, akkor a Google Search vagy a Magyarországon is egyre erősödő Microsoft Bing is több információt társít a találathoz, ami így végeredményben a látogatót döntési helyzetét és az oldalad keresőben való rangsorolását is segíti.

2.4. Hibakezelés

Ahogy már fentebb említettem, az akadálymentesítés alapköve a hagyományos UX gondolkodás, ahonnan fontos kiemelnem a hibakezelést. A folyamat során a felhasználók (a mi szemszögünkből) gyakran “hibáznak” erre két megoldás létezik:

• a folyamatban jelentkező hibát tervezéssel elhárítjuk, így a látogató nem fut hiba ágra;
• ha a folyamatban nem tudunk változtatni (pl. keresés), akkor a várható hibát megelőzzük egy funkcióval, mint pl. automatikus kiegészítő (auto-correct) vagy beviteli mező fókuszvesztése során lefutó ellenőrző funkcióval;
• ha a kiegészítő funkciók bevezetése sem lehetséges, akkor az eset bekövetkeztekor adjunk segítséget pl. egy automatikus helyesírás funkció lefutásával (auto-correct, “Így gondolta?”) vagy egy ajánló rendszer megjelenítésével.

Apropó, ahogy a UX tervezési alapelvek is kimondják: hibákat mindig a hiba helyénél jelenítsük meg, használjunk egyszerű nyelvezetet és törekedjünk arra, hogy felnagyított képernyőn is könnyen megtalálható legyen.

3. Teszteld

Ha teheted mindig célközönséggel tesztelj. Próbálkozz ismerősi körökben, facebook csoportokban, de azzal is cél érhetsz el, ha az utcán találsz olyat, aki szívesen segít neked a tesztelésben, hiszen a célod az életük megkönnyítése.

Ha erre nincs lehetőséged, akkor tesztelj magad különféle eszközökkel, böngészős bővítményekkel (pl. WebAim.org WAVE), illetve a teszt során ügyelj két fontos területre:

• a billentyűzettel való lineáris bejárhatóságra (oda-vissza), mind a tartalmi és különösen az űrlap részeken, hogy ne akadj be a látogató folyamatokba, lehetősége legyen a bevitt adatok ellenőrzésére és a hibák megtalálására;
• a felolvasó szoftverek (pl. JAWS for Windows, NVDA, Talckback (Android), Voiceover (iOS)) megfelelően olvassák-e fel az általuk olvasható információt és a hibaüzenetekre is reagálnak.

Végszó

Bízom benne, hogy sikerült egy átfogó képet adnom az akadálymentesítés világáról és jó kiindulópontnak tartod az itt leírtakat.

Az akadálymentesítés lényege, hogy az esélyegyenlőség megteremtése amivel embertársaidnak segíthetsz, viszont a legtöbb olyan szolgáltatás (pl. Google, Apple, Microsoft), ami a forgalmadra jelentős hatást tud gyakorolni, szintén ebben a szellemiségben él és díjazza, ha más is hasonló értékrendet követ.

Akadálymentesítés, befogadó tervezés vagy inclusive design témában nagyon sok cikk és videó született, de a https://www.a11yproject.com/, a https://www.a11y-collective.com/ vagy a LinkedinLearning minőségi tartalmaival hamar extra tudásra tudsz szert tenni, ha mélyebben is érdekel a téma.

A lead kép AI Generált.

Források:

• How designing for inclusion can help develop better products for all: https://uxdesign.cc/how-designing-for-disability-can-help-to-develop-better-products-for-all-c703b489194e
• TEDxLSSC: Jeff Paradee — Disability technology: https://youtu.be/eFkhFxJZvho
• Christopher Hills videói a külső eszközökről: https://www.youtube.com/user/icdhills
• Inclusive Design: 12 Ways to Design for Everyone: https://www.shopify.com/partners/blog/inclusive-design
• The Curb Cut Effect: How Making Public Spaces Accessible to People With Disabilities Helps Everyone: https://medium.com/@mosaicofminds/the-curb-cut-effect-how-making-public-spaces-accessible-to-people-with-disabilities-helps-everyone-d69f24c58785
• An Alphabet of Accessibility Issues: https://the-pastry-box-project.net/anne-gibson/2014-july-31
• A Colourblind Designer To The World: Please Stop Using Red And Green Together: https://baselinehq.com/blog/colourblindness-information-ui-design-red-green-problems-tips-tricks.html
• Visual Disabilities / Color blindness: https://webaim.org/articles/visual/colorblind
• Web Accessibility for Vestibular Disabilities: https://uxplanet.org/web-accessibility-for-vestibular-disabilities-919a78d7b0b1
• Brad Frost: Atomic Design: https://bradfrost.com/blog/post/atomic-web-design/
• How designing for inclusion can help develop better products for all: https://uxdesign.cc/how-designing-for-disability-can-help-to-develop-better-products-for-all-c703b489194e
• Android accessibility overview: https://support.google.com/accessibility/android/answer/6006564?hl=en
• Accessibility on iOS: https://developer.apple.com/accessibility/ios/
• https://www.a11yproject.com/
• Egy látássérült embernek ma az iPhone-ja az egyik legnagyobb segítsége: https://qubit.hu/2023/12/04/egy-latasserult-embernek-ma-az-iphone-ja-az-egyik-legnagyobb-segitsege
• 10 Ways you can make your web design more accessible: https://deerdesigner.com/blog/10-ways-you-can-make-your-web-design-more-accessible/
• Digitális akadálymentesség szabályozás: Sok vállalatnak fog fájni! on Vimeo
• https://infoalap.hu/egyetemes/
• The European Accessibility Act 2025: Key Insights for Publishers: https://www.yudu.com/blog/the-european-accessibility-act-2025-key-insights-for-publishers
• European Accessibility Act (EAA) 2025 [Ultimate Guide]: https://www.getsubly.com/post/european-accessibility-act-eaa-2025-ultimate-guide