Akadálymentes kapcsolatfelvételi űrlapok és az európai akadálymentesítési irányelv
2025. június 28. óta az európai akadálymentesítési irányelv számos fogyasztóknak szóló digitális szolgáltatásra állapít meg szabályokat. Mit jelent ez a kapcsolatfelvételi űrlapjára nézve – és egy gyakorlati WCAG 2.2 ellenőrzőlista.
A kapcsolatfelvételi űrlap gyakran az egyetlen ajtó a látogató és az Ön vállalkozása között. Ha ez az ajtó csak egérrel, jó látással és egy elmosódott képes feladvány megoldásához szükséges türelemmel nyitható ki, néhányan egyszerűen kint maradnak. 2025 közepe óta ez már nem csupán használhatósági kérdés: sok, az EU-ban fogyasztóknak értékesítő vállalkozás számára jogi kérdéssé vált.
Mire terjed ki az európai akadálymentesítési irányelv
Az európai akadálymentesítési irányelv ((EU) 2019/882 irányelv) 2025. június 28. óta alkalmazandó. Akadálymentességi követelményeket határoz meg bizonyos, fogyasztóknak kínált termékekre és szolgáltatásokra – köztük az elektronikus kereskedelemre, a fogyasztói banki szolgáltatásokra, az e-könyvekre, az elektronikus hírközlésre és a személyszállítás egyes részeire. Egy weboldal esetében ez a webshopot vagy a banki szolgáltatást mint egészet jelenti, beleértve azokat az űrlapokat is, amelyeken az ügyfelek kapcsolatba lépnek Önnel, kérdeznek vagy panaszt tesznek. A szolgáltatásokat nyújtó mikrovállalkozások mentesülnek: a tíznél kevesebb alkalmazottat foglalkoztató, legfeljebb 2 millió EUR éves árbevétellel vagy mérlegfőösszeggel rendelkező vállalkozások. A kizárólag más vállalkozásoknak szóló ajánlatok általában nem tartoznak a hatálya alá.
Minden tagállam átültette az irányelvet a nemzeti jogába. Németországban ez a Barrierefreiheitsstärkungsgesetz (BFSG), Lengyelországban egy 2024-es törvény arról, hogy bizonyos termékek és szolgáltatások megfeleljenek az akadálymentességi követelményeknek. A felügyeleti hatóságok és a szankciók országonként eltérnek, a műszaki mérce azonban nagyjából ugyanaz: a gyakorlatban az EN 301 549 európai szabvány, amely pedig a webes tartalmak akadálymentességi irányelveire (WCAG) épül.
Miért éri meg jogi kötelezettség nélkül is
Lehet, hogy vállalkozása mentesül, vagy csak más cégeket szolgál ki. Az akadálymentes űrlapok mégis megérik a fáradságot, egy egyszerű okból: minden ember, aki félúton feladja, egy megkeresés, amely soha nem jut el Önhöz. Azok a javítások, amelyek egy képernyőolvasó-használónak segítenek, annak is segítenek, aki telefonon, vonaton, erős napfényben, eltört csuklóval vagy nem az anyanyelvén tölti ki az űrlapot. Az egyértelmű címkék és a segítőkész hibaüzenetek mindenkinél kevesebb félbehagyott űrlapot jelentenek – és egyikük sem gyengíti a spamvédelmét.
Gyakorlati ellenőrzőlista WCAG 2.2 hivatkozásokkal
- A beviteli mezőkhöz kapcsolt látható címkék (1.3.1, 3.3.2): minden mezőnek van látható címkéje, amely for/id segítségével kapcsolódik hozzá. Egy helykitöltő szöveg önmagában nem címke – eltűnik, amint valaki gépelni kezd.
- A javítást elmagyarázó hibaüzenetek (3.3.1, 3.3.3): nevezze meg a mezőt, mondja meg, mi a hiba, és hogyan javítható – szövegesen, ne csak piros kerettel. A „Kérjük, adjon meg egy e-mail-címet, például name@example.com” jobb, mint az „Érvénytelen bevitel”.
- Teljes billentyűzetes kezelhetőség (2.1.1, 2.1.2): minden mező, jelölőnégyzet, CAPTCHA és a küldés gomb elérhető és használható a Tab, a Szóköz és az Enter billentyűvel, billentyűzetcsapdák nélkül.
- Látható fókusz (2.4.7): mindig látszik, melyik mező aktív. Ha a böngésző fókuszkeretét pótlás nélkül eltávolítja, ez a feltétel nem teljesül.
- Elegendő kontraszt (1.4.3): a szövegek, címkék és hibaüzenetek kontrasztaránya a háttérhez képest legalább 4,5:1 (nagy szövegnél 3:1).
- Célméret (2.5.8): a gombok, jelölőnégyzetek és linkek legalább 24 × 24 CSS-képpont méretűek, vagy elegendő térköz veszi körül őket.
- CAPTCHA-alternatívák (1.1.1) és akadálymentes hitelesítés (3.3.8): az 1.1.1 szöveges alternatívát és a CAPTCHA több érzékszervi formáját írja elő; a 3.3.8 szigorúan véve a bejelentkezési lépésekre vonatkozik, de az alapgondolata átvihető – egy feladvány, például torzított betűk újragépelése vagy egy összeadás megoldása ne legyen az egyetlen út. Kínáljon alternatívát, vagy használjon olyan módszert, amelyhez egyáltalán nem kell feladvány.
- A kisegítő technológiák elől elrejtett honeypotok: a csapdamező csomagolóeleme aria-hidden="true" értéket, maga a mező tabindex="-1" értéket kap, így a képernyőolvasót és a billentyűzetet használók soha nem jutnak bele.
CAPTCHA-k és honeypotok: ahol a spamvédelem és az akadálymentesség találkozik
Szigorúan véve a 3.3.8-as feltétel a bejelentkezési és hitelesítési lépésekről szól, nem a kapcsolatfelvételi űrlapokról. A mögötte álló gondolat azonban jól átvihető: a torzított betűk begépelése, egy összeadás megoldása vagy a közlekedési lámpák kiválasztása egy képrácsból egyeseket teljesen kizár. Azok a lehetőségek, amelyek általában feladvány nélkül működnek – például a Cloudflare Turnstile, a Friendly Captcha, egy időellenőrzéssel kombinált honeypot vagy egy szerveroldali szűrés, mint az Akismet –, anélkül tartják távol a spamet, hogy a látogatóknak bármit is bizonyítaniuk kellene. Egy honeypot csak akkor barátságos, ha valóban láthatatlan, a képernyőolvasók és a billentyűzetet használók számára is:
<div class="hp" aria-hidden="true">
<label for="hp-website">Hagyja üresen ezt a mezőt</label>
<input type="text" id="hp-website" name="website"
tabindex="-1" autocomplete="off">
</div>
<!-- CSS: .hp { position: absolute; left: -10000px; } -->Tesztelje saját űrlapját tizenöt perc alatt
- 1Tegye félre az egeret, és töltse ki az egész űrlapot csak billentyűzettel. Elér minden mezőt és a küldés gombot, és mindig látja, hol tart?
- 2Küldje el az űrlapot üresen, majd hibás e-mail-címmel. A hibák szövegként jelennek meg a megfelelő mező mellett, és egyértelmű, mit kell tenni?
- 3Nyissa meg az oldalt telefonon, vagy nagyítsa a böngészőt 200%-ra. Minden olvasható, a gombok könnyen megérinthetők, és nem takarja-e el egy sütibanner vagy csevegőwidget a küldés gombot?
- 4Kapcsoljon be egy képernyőolvasót (VoiceOver, NVDA vagy TalkBack), és figyeljen: minden mezőt a címkéjével együtt olvas fel, és a honeypot néma marad?
- 5Futtasson egy automatizált ellenőrzést, például az axe-core-t. Gyorsan megtalálja a hiányzó címkéket és a kontrasztproblémákat, de nem mindent – a fenti kézi lépésekre továbbra is szükség van.
Ha inkább egy áttekintéssel kezdené, a formexposed kívülről, semmit sem beküldve vizsgálja meg a nyilvános űrlapjait. Akadálymentességi ellenőrzései minden űrlapon lefuttatják az axe-core-t, jelzik az akadálymentes alternatíva nélküli CAPTCHA-kat és a képernyőolvasók által felolvasott honeypotokat, és megnézik az űrlapot telefonon is – érintési célok, a küldés gombot eltakaró rétegek, vízszintes görgetés. Az ingyenes ellenőrzés az összesített szintet mutatja; ezek a részletek a teljes jelentésben találhatók. Jó kiindulópont a fenti listához, de nem helyettesíti a valódi emberekkel végzett tesztelést.