Miért buknak el jó űrlapok?
A szándék szuper, csak közben „elgurul” a felhasználó türelme: túl sok mező, félreérthető címkék, hibák, amiket a rendszer csak az oldal alján jelez, és persze a böngésző törli a beírt adatokat. Nem a látogató makacs – az űrlap fárasztó.
Hány mező az ideális?
Rövid válasz: csak ami feltétlenül kell az első lépéshez. Lead‑űrlapnál gyakran elég 3–5 mező (név, e‑mail/telefon, üzenet/opció). Webshopnál a számlázási/szállítási adatokat kérd akkor, amikor tényleg muszáj. Ha bonyolult a folyamat, törd több lépésre (progress bar), és mutasd, hol tart az illető.
Másodpercekben mérhető UX‑fogások
- Valódi label, nem csak placeholder. A címke maradjon látható gépelés közben is.
- Input‑típusok: e‑mailnél
type='email', telefonnáltype='tel' inputmode='numeric'. - Azonnali (inline) validáció – ne a Submit után derüljön ki, hogy hiányzik valami.
- Nagy, egyértelmű gomb aktív igealakkal: Kérem az ajánlatot.
- Mobil‑első elrendezés – nagy érintési célok, kevés görgetés.
- Akadálymentesítés: fókusz‑állapot,
aria-invalid, hiba‑összefoglaló linkkel az első hibára.
Hibakezelés, amit szeretni fognak
Légy barátságos és konkrét. Őrizd meg a már beírt adatokat, emeld ki pirossal az érintett mezőt, és adj rövid megoldási javaslatot (pl. „Így néz ki egy jó e‑mail: valami@pelda.hu”). Az oldal tetején lehet egy hiba‑doboz is, ami a problémás mezőre ugrik.
Köszönőoldal vagy beágyazott sikerüzenet?
Köszönőoldal: ha fontos a mérés és a következő lépés (letöltés, időpontfoglalás, extra ajánlat). Retargetinghez is praktikus. Beágyazott sikerüzenet: ha nem akarod kirángatni az embert az aktuális kontextusból. Mindkettőnél legyen egyértelmű következő lépés.
Mikrokonverziók és mérés (GA4/GTM)
- Form view – amikor az űrlap a viewportba kerül.
- Start typing / field focus – jelzi a szándékot.
- Step next – több‑lépéses űrlapnál lépésenkénti esemény.
- Submit attempt és Submit success – különítsd el a próbálkozást a sikeres beküldéstől.
- UTM & forrás – rejtsd el mezőben, és küldd be az adatokkal.
- Consent Mode V2 – mérj jogkövetően, modellezett konverziókkal is.
Anti‑spam és biztonság
Használj honeypot mezőt, időalapú védelmet (túl gyors beküldés = gyanús), reCAPTCHA v3/hCaptcha‑t, és mindig szerveroldali validációt. A beküldéskor naplózd az időbélyeget és IP‑t (GDPR‑kompatibilisen).
Bizalom az űrlap körül
Apró, de számít: rövid adatkezelési ígéret (pl. „Nem küldünk spamet, bármikor leiratkozhatsz.”), rövid GDPR‑szöveg linkkel, referenciák a közelben, és egy telefonos elérhetőség a bizalmatlanoknak.
Mini audit – 10 gyors pont
- Max. 3–5 mező első körben.
- Valódi label + példa‑placeholder.
- Inline validáció, hiba‑összefoglaló.
- Mobil‑barát elrendezés, nagy gomb.
- Megőrzött beviteli adatok hiba után.
- Köszönőoldal vagy sikerüzenet + következő lépés.
- GA4 események: view/start/next/attempt/success.
- UTM‑ek, források rögzítése.
- Honeypot + szerveroldali validáció.
- Bizalmi elemek és rövid adatvédelmi üzenet.
