Minden mezőt kapcsoljon tartós szöveges címkéhez, csak a szükséges adatokat kérje, a hibát írja le a mezőnél és az összesítőben is, és beküldés után egyértelműen erősítse meg az eredményt.
Az űrlap párbeszéd az ember és a rendszer között. Ha csak a placeholderre támaszkodik, nem jelöli a kötelező mezőket, vagy hiba után törli az adatokat, a probléma nemcsak a segítő technológiákat használókat érinti. Az egyértelműség hiánya növeli a javítások és a támogatási kérések számát, valamint annak kockázatát, hogy valaki helytelen vagy érzékeny információt küld el.
Az akadálymentesség a rövid terjedelem, a helyes HTML, az érthető utasítások és a megbízható állapotok kombinációjából jön létre. A kliensoldali validáció segít a hiba kijavításában, de nem helyettesíti a szerveroldali biztonsági ellenőrzést. Az űrlapot billentyűzettel, képernyőolvasóval, nagyítással és lassú kapcsolat mellett is tesztelni kell, tiszteletben tartva a magánszférát és az adatgyűjtés jogi célját.
A mező célját és terjedelmét az írás előtt érthetővé kell tenni
Csak az adott folyamathoz szükséges adatokat kérje, és magyarázza el, miért van rájuk szükség, ha ez nem egyértelmű. A kötelező és az opcionális mezőket szöveggel különböztesse meg, ne csak magyarázat nélküli csillaggal. A sorrend kövesse a természetes beszélgetést. A hosszú űrlapot ossza logikus lépésekre, és jelezze a haladást mesterséges elnyújtás nélkül.
Az útmutatást a mező előtt vagy annak közelében adja meg, különösen szokatlan formátum, jelszó vagy fájlfeltöltés esetén. Ne várja meg, hogy a felhasználó hibázzon, mielőtt megismeri a szabályt. A szövegnek azt kell közölnie, mit kell megadni, és mire használják fel az adatot, nem pedig az adatbázisoszlop belső nevét.
A label tartós megnevezés, a placeholder csak kiegészítő példa
Használjon label elemet, amely helyesen kapcsolódik a mező egyedi azonosítójához. A labelre kattintva aktiválódnia kell a hozzá tartozó elemnek, és a képernyőolvasónak be kell jelentenie annak nevét. A placeholder a gépelés megkezdésekor eltűnik, gyakran gyenge a kontrasztja, és nem hordozhatja az egyetlen információt a mező céljáról vagy formátumáról.
A rádiógomb- és jelölőnégyzet-csoportokat lássa el közös legendával, az egyes lehetőségek pedig tartsák meg saját címkéjüket. A gombot az eredmény alapján nevezze el, például „Kérelem elküldése”, ne általános „OK” felirattal. Egyedi komponenseket csak akkor használjon, ha a natív elem nem tudja kielégíteni az igényt, és Ön képes megvalósítani annak teljes működését.
- látható címke minden vezérlőelemhez
- egyedi id és helyes for-összekapcsolás
- fieldset és legend az összetartozó csoporthoz
- a tényleges műveletről elnevezett gomb
A mezőtípus és az automatikus kitöltés csökkenti a felesleges újragépelést
Válasszon megfelelő beviteli típust e-mailhez, telefonszámhoz, dátumhoz vagy számhoz, de engedje meg azokat a formátumokat, amelyekre a felhasználónak valóban szüksége van. A telefonszám nem matematikai érték, tartalmazhat előhívót vagy szóközöket. Az automatikus formázás nem változtathatja meg a jelentést, és nem mozgathatja kiszámíthatatlanul a kurzort.
A szokásos személyes és elérhetőségi adatoknál állítsa be a megfelelő autocomplete értéket, hogy a böngésző és a kisegítő technológiák felismerjék a mező célját. Biztonsági ok nélkül ne tiltsa le a szöveg beillesztését a jelszó vagy az ellenőrző kód mezőjébe. A jelszókezelő és a másolás csökkentheti a hibákat, és támogathatja a mozgásszervi vagy memóriazavarral élő felhasználókat.
A hibaüzenet megnevezi a mezőt, az okot és a javítás módját
Sikertelen beküldés után őrizze meg a helyesen megadott adatokat, és jelenítse meg a hibák összesítését az űrlap elején. Az összesítés minden eleme hivatkozhat a konkrét mezőre. A hibaüzenet a mezőhöz is tartozik, és programozottan hozzá kell rendelni. A szöveg nélküli piros keret nem magyarázza el a problémát, és nem működik a színek megkülönböztetése nélkül.
A fókuszt egy következetes modell szerint helyezze az összefoglalóra vagy az első hibára, és a változást zavaró ismétlés nélkül jelezze a kisegítő technológiának. A validálást megfelelő pillanatban végezze; egy minden begépelt számjegynél megjelenő, agresszív hibaüzenet akadályt jelent. A szerver ismét ellenőrzi a bemenetet, és biztonságos üzenetet ad vissza technikai stack trace vagy belső részletek felfedése nélkül.
- egyértelmű összegzés sikertelen beküldés után
- konkrét mezőhöz rendelt szöveges hibaüzenet
- megőrzött érvényes értékek és logikus fókusz
- azonos ellenőrzés a kliensen és a szerveren
- a mezővel együtt elérhető segédszöveg
- a helyesen megadott értékek nem törlődnek
- az eredmény megerősítése a hiteles válasz után
- regressziós teszt billentyűzettel és képernyőolvasóval
A megerősítés és a tesztelés zárja le a teljes folyamatot
Sikeres beküldés után egyértelműen közölje, mi érkezett be, mi történik ezután, és hogyan javíthatja ki valaki a tévedését. Ne keltse a beküldés látszatát csupán a gomb animációjával. Dupla kattintásnál akadályozza meg az ismételt rekord létrejöttét, és jelenítsen meg stabil állapotot. Az érzékeny értékeket ne ismételje meg a visszaigazoláson és az URL-ben sem.
Tesztelje az üres űrlapot, a határértékeket, a lassú választ, a szerver kiesését, a visszalépést és az oldal frissítését. Járja végig a teljes folyamatot egér nélkül és képernyőolvasóval. Az automatikus audit a problémák egy részét megtalálja, de nem ellenőrzi a kérdések érthetőségét, az adatgyűjtés arányosságát, sem azt, hogy a felhasználó megértette-e az eredményt.
Gyakori kérdések
Helyettesítheti a placeholder a labelt?
Nem. A gépelés megkezdésekor eltűnik, és nem biztos, hogy megbízhatóan felolvasásra kerül. A mezőnek tartós, programozottan hozzárendelt címkére van szüksége.
Elegendő-e a kliensoldali validáció?
Nem. Segíti a felhasználót, de a bevitelt a szerveren is biztonságosan ellenőrizni kell. Mindkét réteg hibaüzeneteinek érthetőnek és következetesnek kell maradniuk.
Jelölni kell a kötelező vagy az opcionális mezőket?
Válasszon következetes modellt, és magyarázza el szövegesen. Ha egy űrlapon a mezők többsége kötelező, áttekinthetőbb lehet egyértelműen jelölni a kivételeket és a követelményeket is.
Források és további olvasnivaló
Adam Antoni vyvíja weby, aplikácie a softvér na mieru. Prepája firemné systémy, automatizuje procesy a vytvára AI agentov. Pôsobí v Spišskej Novej Vsi a spolupracuje s firmami na celom Slovensku.
