Akadálymentes weboldal: nem csak etikai döntés, hanem okos online elérési stratégia
Ebben a cikkben
Az akadálymentes weboldal sokáig úgy élt a köztudatban, mint egy külön projekt, amit majd „egyszer, ha lesz rá idő és pénz” elvégez a cég. A valóság ennél praktikusabb. Ugyanazok a technikai és tartalmi lépések, amelyek egy oldalt használhatóvá tesznek egy látássérült vagy billentyűzettel navigáló látogató számára, a keresőmotorok dolgát is megkönnyítik. Aki akadálymentesít, az szinte mellékesen SEO-t is csinál. A kettő nem egymás mellett fut, hanem ugyanaz az út két különböző utazója felé.
Ebben a cikkben azt nézzük meg, pontosan hol találkozik a két terület, és milyen konkrét lépésekkel lehet egy oldalt egyszerre hozzáférhetőbbé és jobban rangsorolhatóvá tenni.
Tiszta szerkezet: amit a felhasználó és a kereső is megért
Egy akadálymentes weboldal alapja a logikus, következetes felépítés. A címsoroknak valódi hierarchiát kell alkotniuk: egyetlen H1 az oldal fő témájával, alatta H2 szintű szakaszcímek, azokon belül szükség esetén H3. Ez nem formai kérdés. A képernyőolvasót használó látogatók gyakran címsorról címsorra ugorva tájékozódnak egy oldalon, tehát a helyes címsor-sorrend számukra maga a navigáció.
Pontosan ezt a szerkezetet olvassa ki a keresőmotor is. Amikor a kereső feldolgozza az oldalt, a címsorok hierarchiája segít neki eldönteni, mi a főtéma és mik az alárendelt részek. Ha a címsorokat pusztán a betűméret miatt osztogatjuk, a hierarchia szétesik, és mindkét fél elveszíti a fogódzót. A megoldás egyszerű: a címsor jelentsen valódi szerkezeti szintet, a látvány pedig maradjon a stíluslap dolga.
Ehhez tartozik a szemantikus HTML használata is. A menü legyen valódi navigációs elem, a fő tartalom a fő tartalmi blokkban, a lábléc a láblécben. A gépi feldolgozás, legyen szó segédeszközről vagy keresőrobotról, ezekből a jelentéssel bíró elemekből tájékozódik, nem a látványból. Aki emellett tájékozódást segítő elemeket is beépít, például egy „ugrás a tartalomhoz” hivatkozást a lap tetején vagy egy jól strukturált morzsamenüt, az mindkét közönségnek segít: a billentyűzetes látogatónak és a keresőnek is, amely a morzsamenüből az oldal helyét is megérti a struktúrában.
Alternatív szöveg: a kép, amit mindenki „lát”
A képekhez tartozó alternatív szöveg, az alt szöveg, az akadálymentesítés egyik legismertebb eleme, és nem véletlenül. A képernyőolvasó ezt a szöveget mondja fel a látássérült látogatónak, tehát ez az egyetlen módja annak, hogy a kép tartalma eljusson hozzá. Ugyanez a szöveg jelenik meg akkor is, ha a kép valamiért nem töltődik be, például lassú mobilkapcsolaton.
A keresőmotor a képek tartalmát szintén az alt szövegből érti meg, hiszen a pixeleket önmagukban nem tudja értelmezni annyira megbízhatóan. Egy jól megírt alt szöveg tehát a képkeresésben is előrébb hozhatja az oldalt. A jó alt szöveg tömör, leíró, és a kép valódi tartalmát mondja el. Egy termékfotónál elég annyi, hogy „szürke pamut férfi póló elölnézetből”. Kerülni kell a kulcsszavak halmozását és az üres töltelékleírást, mert az sem a felhasználónak, sem a keresőnek nem segít. Tisztán dekoratív képnél pedig a helyes megoldás az üres alt attribútum, hogy a képernyőolvasó egyszerűen átugorja.
Kontraszt, szín és olvashatóság
A szöveg és a háttér közötti kontraszt méréssel eldönthető, nem ízlés kérdése. A nemzetközi akadálymentesítési ajánlás, a WCAG, normál méretű szövegnél legalább 4,5:1 arányú kontrasztot kér, nagyobb méretű szövegnél 3:1 arányt is elfogadhatónak tart. A halványszürke szöveg fehér háttéren esztétikus lehet, de a látogatók jelentős része, köztük az idősebbek és a gyengénlátók, egyszerűen nem tudja elolvasni.
Fontos az is, hogy az információt soha ne csak szín hordozza. Ha egy űrlapon a hibás mező csak pirosra vált, a színtévesztő látogató nem érzékeli a hibát. A megoldás a szín mellé tett szöveges jelzés vagy ikon. Ezek a lépések a felhasználói élményt is javítják, a hosszabb átlagos oldalon töltött idő és az alacsonyabb visszafordulási arány pedig olyan viselkedési jelek, amelyeket a keresők is figyelnek.
Billentyűzet, fókusz és a kattintható felület
Nem mindenki egérrel használ egy oldalt. Vannak, akik kizárólag billentyűzettel navigálnak, mások speciális segédeszközzel. Egy akadálymentes weboldalon minden funkció elérhető kell legyen billentyűzetről is: a menük, a legördülő elemek, az űrlapok és a gombok. Ehhez tartozik a látható fókuszjelölés, vagyis hogy mindig egyértelmű legyen, épp melyik elemen áll a kurzor. A fókuszkeret eltüntetése látványos, de használhatatlanná teszi az oldalt a billentyűzetes látogató számára.
A kattintható felületek mérete is számít. A túl kicsi gombok és a túl közel helyezett hivatkozások megnehezítik a pontos célzást, ez pedig nemcsak a mozgáskorlátozottaknak gond, hanem bárkinek, aki mobilon, mozgó járművön próbál rendelni. Az elég nagy, jól elkülönített érintőfelület minden eszközön kényelmesebb, és a mobil használhatóság ma már közvetlen rangsorolási tényező.
Videó és hang: felirat és szöveges alternatíva
A mozgóképes tartalom külön figyelmet érdemel, mert itt szoktak a legtöbben megfeledkezni az akadálymentességről. Az előre rögzített videókhoz felirat kell, hogy a siket és nagyothalló látogatók is követni tudják a tartalmat, hangos hanganyaghoz pedig szöveges átirat. Ez nem csak kötelező jó gyakorlat, hanem a felhasználók jóval szélesebb körének segít: annak, aki hang nélkül, csendes környezetben nézi a videót a telefonján, és annak is, aki inkább elolvasná a lényeget, mint hogy végignézzen egy több perces felvételt.
A keresőoptimalizálás szempontjából ez ismét kettős haszon. A felirat és az átirat szöveges tartalmat ad a keresőnek arról, ami egyébként csak a videóban hangzik el, tehát a mozgóképhez kapcsolódó kulcsszavak is megjelennek az oldalon, indexelhető formában. Ami a nézőnek kényelem, az a keresőnek plusz kontextus.
Sebesség és mobil: ahol a két terület teljesen egybeér
Az akadálymentesség és a SEO talán sehol sem fedi át annyira egymást, mint a teljesítménynél. A gyorsan betöltő, könnyű oldal annak segít a legtöbbet, akinek gyenge a kapcsolata vagy régebbi a készüléke, és éppen ők azok, akiket egy nehézkes felület elsőként veszít el. Ugyanakkor az oldalbetöltési sebesség és a mobilon mért használhatóság a keresők egyik figyelt rangsorolási jelzése is.
A tömörített képek, a felesleges szkriptek elhagyása és a stabil, nem ugráló elrendezés tehát egyszerre javítja a hozzáférhetőséget és a rangsorolási esélyt. A reszponzív, mobilra szabott felület pedig nemcsak azért fontos, mert a látogatók többsége telefonon érkezik, hanem azért is, mert a kereső elsősorban a mobil változat alapján ítéli meg az oldalt.
Hogyan ellenőrizd, hol tart most az oldalad
Az akadálymentesség állapotát nem kell megérzésre bízni, néhány egyszerű próbával magad is sok mindent kiszűrsz. Tedd le az egeret, és próbáld végigjárni az oldalt kizárólag billentyűzettel: a Tab billentyűvel eljutsz minden hivatkozáshoz és gombhoz, látod, hol áll épp a fókusz, és el tudod érni a legfontosabb funkciókat? Ha valahol elakadsz vagy elveszíted a szem elől a fókuszt, ott a billentyűzetes látogató is elakad.
Hasznos a kontraszt megmérése egy ingyenes kontrasztellenőrzővel, a képek próbája úgy, hogy ideiglenesen kikapcsolod a betöltésüket, és megnézed, az alt szövegekből érthető marad-e az oldal, valamint a szöveg nagyítása a böngészőben, mert jól megépített oldal 200 százalékos nagításnál sem esik szét. Aki mélyebbre menne, kipróbálhat egy képernyőolvasót is, de már ez a néhány laikus próba is megmutatja a legkiáltóbb hiányokat. A pontos, rangsorolt képet ezután egy szakszerű felmérés adja meg, amely a technikai hibák mellett a keresőoptimalizálási teendőket is számba veszi.
Amikor az akadálymentesség már nem választás
A hozzáférhetőség egyre kevésbé jószándék kérdése. Az Európai Unió akadálymentesítési irányelve, az European Accessibility Act, a magánszféra számos digitális szolgáltatására, köztük az online kereskedelemre is kötelezettségeket ír elő, és 2025. június 28-tól alkalmazandó. A nagyon kicsi, mikrovállalkozásnak minősülő szolgáltatók bizonyos esetekben mentesülnek, de az irány egyértelmű: a szabályozás szigorodik, nem lazul.
Ez azt jelenti, hogy az akadálymentesítés ma már nem az a feladat, amit a végtelenségig halogatni lehet. Aki most rendezi a szerkezetet, a kontrasztokat, az alt szövegeket és az űrlapokat, az egyszerre tesz eleget a formálódó elvárásoknak és épít fel egy erősebb SEO-alapot. Aki halogat, az később ugyanezt a munkát végzi el, csak határidő és kényszer alatt.
A jó hír az, hogy nem kell választani a két cél között. Egy tiszta szerkezetű, jó kontrasztú, billentyűzetről is használható, gondosan címkézett oldal egyszerre kényelmesebb minden látogatónak és érthetőbb minden keresőnek. Ha bizonytalan vagy, hol áll most az oldalad, egy szakszerű felmérés megmutatja a legfontosabb hiányokat, és sorrendbe teszi, mit érdemes elsőként megjavítani. Ehhez érdemes olyan akadálymentesítési szolgáltatás igénybe venni, amely az akadálymentesítést és a keresőoptimalizálást együtt kezeli, mert a kettő úgyis ugyanazt az utat járja.
