# Akadálymentes űrlapok tartalomkészítőknek > Miért fontos az akadálymentesség, és hogyan állítsd be az űrlapot: címkék, tabindex, színek, elnevezések, captcha és hibaüzenetek. A Gravity Forms jó eszköz akadálymentes webes űrlapok készítéséhez. Ez a fejezet segít abban, hogy az űrlapot akadálymentességi szemlélettel állítsd be, és tudd, mire figyelj. A gyors ellenőrzéshez használd az [Akadálymentesítési ellenőrzőlistát](https://hub.hellowp.io/hu/plugins/gravityforms/hogyan-akadalymentesseg-ellenorzolista/). ## Miért kell akadálymentes űrlap Az akadálymentes űrlapot minél több ember tudja használni, minél többféle eszközön. Gondolj például ezekre a felhasználókra: - fejlesztő, aki számítógépet, billentyűzetet és egeret használ; - vak felhasználó, aki képernyőolvasót használ; - siket-vak felhasználó, aki képernyőolvasót és braille-kijelzőt használ; - vonaton utazó, aki okostelefonon, lassú wifin böngész; - idős ember, aki erős napfényben használ táblagépet; - gyerek, akinek eltört a karja, és csak a billentyűzetet tudja használni. Becslések szerint az emberek mintegy 20 százaléka él valamilyen fogyatékossággal, és az idősödő társadalomban ez az arány nő. Az akadálymentesség nem csak nekik hasznos: ha az űrlapok akadálymentesek, mindenki jobban használja őket. ## Irányelvek és jogi követelmények A Gravity Forms a webes akadálymentesség nemzetközi irányelveit követi: WCAG 2.1, AA szint. Egyes országokban a jogi követelmény a WCAG 2.0 AA, vagy külön szabályrendszer van érvényben. Hogy az országodban és a webhelyed típusára mi vonatkozik, azt a saját hatóságodnál érdemes ellenőrizni. ## Ajánlott beállítások ### Űrlapbeállítások Új űrlap létrehozása után az űrlap beállításaiban állítsd be: - **Címke elhelyezése:** felülre igazítva - **Leírás elhelyezése:** a beviteli mezők fölött - **Az érvényesítési üzenet elhelyezése:** a beviteli mezők fölött - **Alcímke elhelyezése:** a beviteli mezők fölött - **Érvényesítési összefoglaló:** bekapcsolva - **Kötelező mező jelölése:** ne vedd ki a kötelező mezők jelölését ### Az űrlap blokk beállításai Amikor űrlapblokkot teszel az oldalra, a blokk beállításaiban: - az **Űrlap beállításai** közt kapcsold be az űrlapcím megjelenítését; - a **Haladó** beállításoknál ne állíts be pozitív tabindexet, az érték maradjon -1 (vagyis ne legyen tabindex). ## Címkék, helyőrzők és leírások - A címke megmondja, mit kell kitölteni, és mindig látszódjon. - A címke a beviteli mező fölött legyen. - A címke csak a beviteli mezőre vonatkozzon, ne tegyél bele hivatkozást, súgóbuborékot vagy más HTML-t. - A helyőrző javaslat arra, hogyan töltsd ki a mezőt. - A leírás kiegészítő információt adhat a mezőről. - A címke mindig legyen értelmes és látható. A helyőrző és a leírás elhagyható. ### Miért így - Ha a címke mindig látszik, az emberek nem felejtik el, mit kell kitölteniük. - Ha az űrlapot az automatikus kitöltés tölti ki, a látható címke segít ellenőrizni, hogy az érték a megfelelő mezőbe került. - Az emberek fentről lefelé olvasnak. Ha a címke a mező alatt van, összezavarhat, melyik címke melyik mezőé. - A helyőrző eltűnik, amint gépelni kezdesz, ezért ha csak az van, a felhasználó elfelejtheti, mit kell beírnia. - Ha hivatkozás van a címkében, a segítő technológiát (például képernyőolvasót) használó ember összezavarodhat. A címke legyen lényegre törő, a kiegészítő információt a leírásba írd. - A Gravity Forms gondoskodik róla, hogy a leírást a képernyőolvasók is felolvassák, ezért itt érdemes kiegészítő információt adni. Példa: **Címke:** Név, **Helyőrző:** például Minta Mária. ## Küldés gomb A gomb beállításai: - **Küldés gomb → Általános → Küldés beviteli típusa:** válaszd a **Szöveg** lehetőséget. - **Küldés gomb → Általános → Küldés gomb szövege:** használj beszédes szöveget (lásd az „Elnevezések” szakaszt). - **Küldés gomb → Feltételes logika:** ne kapcsold be. ## Tabindex Kerüld a pozitív tabindexet az űrlapelemeken. Vannak, akik nem tudnak egeret használni, például mert vakok vagy a finommotorikájuk korlátozott. Ők a billentyűzettel navigálnak: a Tab billentyűvel ugrálnak az elemek (hivatkozás, gomb, űrlapelem) között. Ha egy űrlapelemre pozitív tabindexet állítasz, az lesz az első, amelyik fókuszt kap az oldalon. Ezzel eltéríted a természetes fókuszsorrendet, ami nagyon zavaró annak, aki a főmenübe szeretne eljutni, és nem a hírlevélre akar feliratkozni. Hagyd, hogy a felhasználó irányítson. ## Színhasználat Az űrlap színeit általában a WordPress-téma határozza meg. Ha a testreszabóban módosítod őket, tartsd szem előtt: - a szöveg és a háttere, valamint a szegélyek és a hátterük közti színkontraszt legyen elegendő; - ne hivatkozz színre jelentésként, például: „Nyomd meg a zöld gombot a folytatáshoz”. Nem mindenki lát tökéletesen. Ha a szöveg és a szegélyek kontrasztja jó, a legtöbben még tábláról, napfényben is el tudják olvasni. A férfiak 8, a nők 0,4 százaléka színtévesztő, ők elveszíthetik a színre utaló információt. ## HTML-blokkok és szakasztörések A **HTML** mező vagy a **Szakasz** mező ne tartalmazzon olyan információt, amely nélkül nem lehet kitölteni az űrlapot. A képernyőolvasó az űrlap kitöltése közben nem mindig mondja be ezeket. A fontos információt tedd egy beviteli mező leírásába, mert azt a képernyőolvasók felolvassák. ## Elnevezések A hivatkozásokat, címkéket és gombokat önmagukban is érteni kell. Ne kelljen kitalálni, vagy a környező szöveget végigolvasni, hogy kiderüljön, mi történik. Ha több információ kell egy mező kitöltéséhez, használd a leírást. Példák: - A gombnak legyen beszédes felirata. A „Küldés” általános, jobb például a „Feliratkozás”. - A hivatkozás szövege legyen leíró. A „Kattints ide” nem hasznos, jobb például az „adatvédelmi tájékoztatónk”. Úgy írd a mondatot, hogy a hivatkozás szövege önmagában is érthető legyen. - Az új jelszó mellé írj világos leírást, például: „Legalább 8 karakter hosszú jelszót adj meg.” ## Mondd meg, mire számíthat a felhasználó A többlépéses űrlap jó ötlet a hosszú űrlap kezelhető részekre bontására. De ne hagyd sötétben a felhasználót, hány lépésből áll az űrlap. Ha oldaltöréseket használsz, tegyél hozzá látható folyamatjelzőt is. A szorongó emberek (és valójában mindenki) nyugodtabb, ha tudja, mire számítson. Tájékoztasd a lépések számáról, és adj lehetőséget az előző lépésekre való visszalépésre, hogy ellenőrizhessék, mindent jól töltöttek-e ki. A gombok és hivatkozások szövege legyen beszédes, hogy egyértelmű legyen, mi történik a kattintásra. A folyamatjelzőről a [Folyamatjelző többoldalas űrlapokon](https://hub.hellowp.io/hu/plugins/gravityforms/hogyan-folyamatjelzo-tobboldalas-urlapokon/) fejezetben olvashatsz. ## reCAPTCHA-k A captchák és reCAPTCHA-k nagyon nehezek lehetnek vak, kognitív fogyatékkal élő vagy kevésbé gyakorlott webhasználók számára. Gondold át, valóban szükséged van-e rájuk. A spam megelőzésére más módot is találhatsz: kapcsold be az űrlapbeállításokban a haladó honeypotot, vagy használj spamvédő bővítményt. A Google reCAPTCHA v3 is lehet megoldás, de sértheti a felhasználók adatainak védelmét, ez bonyolult kérdés. Mindenekelőtt: ne a felhasználóra hárítsd a spam megakadályozásának terhét, mert kizárhatod az igazi felhasználókat is. Lásd még a [Spamvédelem: első lépések](https://hub.hellowp.io/hu/plugins/gravityforms/spamvedelem-elso-lepesek/) fejezetet. ## Űrlapellenőrzés ### Mi a kötelező? Nem mindenki tudja, mit jelent a csillag. Ha csillaggal jelölöd a kötelező mezőket, tegyél az űrlap fölé magyarázó sort, vagy a címkébe írd oda, hogy „(kötelező)”. ### Egyéni érvényesítési üzenetek A mezők **Egyéni érvényesítési üzenet** beállításával írj értelmes hibaüzenetet. A „Ez a mező kötelező” szöveg javítható, például: „Add meg a teljes neved.” A gondosan megírt hibaüzenetek lényegesek. A hiányzó vagy hibás adatról adott hasznos visszajelzés csökkenti a felhasználó bosszúságát. Adj minden segítséget az űrlap kitöltéséhez, és ha fontos, hogy a felhasználó ki tudja tölteni, a kapcsolattartási adataidat is.