Kodėl svarbios prieinamos formos
Prieinamos formos leidžia vartotojams lengviau pateikti informaciją ir atlikti veiksmus. Pagrindiniai privalumai:
- Įtraukimas: Užtikrina, kad naudotojai, pasikliaujantys pagalbinėmis technologijomis, galėtų naršyti ir pateikti formas.
- Laikymasis: Atitinka prieinamumo standartus, tokius kaip WCAG ir ADA.
- Patobulinta vartotojo patirtis: Pagerina visų lankytojų patogumą, sumažinant formų atsisakymo rodiklius.
Žingsnis po žingsnio prieinamų formų kūrimo vadovas
1 veiksmas: pridėkite etiketes prie formos laukų
Etiketės suteikia formos laukų kontekstą ir užtikrina, kad vartotojai suprastų kiekvieno lauko paskirtį. Norėdami pridėti etiketes Elementor:
- Atidarykite „Elementor“ redaktorių ir pasirinkite formos valdiklį.
- Spustelėkite kiekvieną lauką ir įjunkite etiketė pasirinkimas.
- Rašykite aprašomąsias etiketes, pvz., „Visas vardas“, o ne „Vardas“.
El. pašto adresas
2 veiksmas: naudokite aprašomąsias vietos rezervavimo priemones
Vietos žymos turėtų papildyti etiketes, o ne jas pakeisti. Naudokite juos, kad pateiktumėte patarimų ar pavyzdžių:
3 veiksmas: užtikrinkite tinkamą lauko tvarką
Klaviatūros naudotojai pasitiki logiška skirtukų tvarka. Patikrinkite, ar formos laukai atitinka nuoseklią tvarką:
- Naršykite formą naudodami
TabRaktas. - Įsitikinkite, kad židinio indikatorius matomas ir logiškai juda laukais.
4 veiksmas: pateikite aiškius klaidų pranešimus
Kai vartotojai daro klaidų, klaidų pranešimuose turėtų būti aiškiai aprašyta, kas nutiko ir kaip ją ištaisyti. „Elementor“:
- Įgalinkite patvirtinimo parinktį formos valdiklio nustatymuose.
- Tinkinkite klaidų pranešimus, pvz., „Įveskite galiojantį el. pašto adresą“.
5 veiksmas: pridėkite ARIA atributus
ARIA (Accessible Rich Internet Applications) atributai pagerina formos pasiekiamumą. Naudokite tokius atributus kaip aria-required bei aria-describedby:
Įveskite savo vardą ir pavardę
6 veiksmas: išbandykite formas su pagalbinėmis technologijomis
Norėdami išbandyti formas, naudokite ekrano skaitytuvus, pvz., NVDA arba VoiceOver. Užtikrinkite, kad visi laukai, etiketės ir klaidų pranešimai būtų paskelbti teisingai.
Geriausia prieinamų formų praktika
- Naudokite būtinus rodiklius: Aiškiai pažymėkite privalomus laukus žvaigždute (
*) ir paaiškinkite jo reikšmę. - Su grupe susiję laukai: Naudokite laukų rinkinius ir legendas, kad sugrupuotumėte susijusius laukus, pvz., apklausose ar kelių žingsnių formose.
- Pateikite prieinamas „Captchas“: Naudokite prieinamas tradicinių „captcha“ alternatyvas, pvz., „Google“ reCAPTCHA v3.
Atvejų analizė: veikia prieinamos formos
1 atvejo analizė: registracija internetu
Kūno rengybos studija patobulino savo registracijos formą pridėdama etiketes ir klaidų pranešimus, todėl 20 proc. padaugėjo pateiktų formų.
2 atvejo analizė: kontaktinė forma
Vietinė įmonė optimizavo savo kontaktinę formą ekrano skaitytuvams, todėl klientai sulaukė teigiamų atsiliepimų ir padaugėjo užklausų.
DUK: „Elementor“ prieinamų formų kūrimas
Ar man reikia kodavimo įgūdžių, kad Elementor formos būtų pasiekiamos?
Ne, Elementor formos valdiklis leidžia pridėti etikečių, vietos rezervavimo ženklų ir klaidų pranešimų be kodavimo. Naudojant išplėstines funkcijas, pvz., ARIA atributus, naudingos pagrindinės HTML žinios.
Kaip galiu patikrinti savo formų prieinamumą?
Naudokite tokius įrankius kaip WAVE arba testuokite rankiniu būdu naudodami ekrano skaitytuvus ir klaviatūros naršymą.
Kuo skiriasi etiketės ir rezervuotos vietos?
Etiketės apibūdina lauko paskirtį, o rezervuotos vietos pateikia patarimų ar pavyzdžių, ką įvesti.
Ar įstatymai reikalauja prieinamų formų?
Taip, daugelyje regionų prieinamos formos turi atitikti tokius standartus kaip WCAG ir ADA.
Kurie papildiniai gali padėti su prieinamomis formomis?
Papildiniai, tokie kaip WPForms ir Ninja Forms, teikia pirmenybę prieinamumui ir gerai integruojami su Elementor.
