Et telefonnummerfelt er bedragerisk enkelt. En tekstboks med labelen "Telefon". Men i det øjeblik du åbner formularen for internationale brugere eller spørger efter telefonnumre på mobil, bliver det enkle felt kompliceret. Forskellige lande formaterer numre forskelligt. Forskellige tastaturer skal vises. Internationale opkaldere tænker i landekoder. Din formular skal klare det hele, ellers mister du datakvalitet. Et stærkt telefonfelt virker overalt og guider brugerne mod det rigtige format, ikke imod det.
Tag en hvilken som helst formular med høj konvertering, der indsamler telefonnumre. Se, hvordan den håndterer feltet. De fleste behandler det som et hvilket som helst tekstfelt og regner med, at brugerne skriver det format, de selv synes er rigtigt. Så ankommer dataene i kaos. Nogle numre har bindestreger. Nogle har parenteser. Nogle har mellemrum. Nogle springer formatering helt over. Din database indeholder det samme telefonnummer i fem forskellige formater. Når du skal ringe til nogen, kan dit system ikke se, at 5551234567 og (555) 123-4567 er det samme nummer. Dataene er teknisk set indsamlet, men fungerer ikke.
Løsningen er ikke at acceptere kaos og rydde op bagefter. Løsningen er at guide brugerne mod ét korrekt format, mens de skriver. Det sker med inputmaske, kloge standardværdier og validering, der hjælper i stedet for at blokere.
Derfor skal telefonfelter håndteres anderledes end tekstfelter
Et telefonnummer er data med internationale regler. En e-mailadresse er stort set universel. Et navn kan være, hvad man vil. Men et telefonnummer har en struktur, som Den Internationale Telekommunikationsunion har fastlagt. Forskellige lande bruger forskellige længder, præfikser og formateringsstandarder. Et gyldigt telefonnummer i Japan ligner slet ikke et gyldigt nummer i Frankrig. Dit felt skal forstå det, ellers afviser det gode numre og accepterer dårlige.
Derudover tænker brugere på telefonnumre i deres eget lands format. En person i London tænker i britisk format. En person i Berlin tænker i tysk format. Når du tvinger dem ind i amerikansk format, bliver de forvirrede. De laver fejl. De dropper formularen. Gnidningen kommer af uoverensstemmelsen mellem det, feltet forventer, og det, brugeren forsøger at give dig.
Ét felt eller delt felt
Nogle formularer deler telefonnummeret op i flere felter. Områdekode i én boks. Central i en anden. Linjenummer i en tredje. Det fungerer fint til amerikanske telefonnumre, hvor strukturen er forudsigelig. Det går i stykker alle andre steder. En bruger i Tyskland kan ikke få sit nummer ind i tre amerikanske bokse. Det kan en bruger i Australien eller Frankrig heller ikke. Delte felter skader også mobiloplevelsen, fordi brugerne skal trykke mellem felterne i stedet for at skrive i ét stræk. Brugertest viser, at mange har svært ved at navigere mellem separate felter på telefoner.
Ét felt er bedre. Én lang inputboks. Ét sted at skrive hele nummeret. Feltet guider formatet med en inputmaske, ikke ved at dele det op. Det virker lige godt til danske og internationale numre. Mobilbrugere skriver én gang, og så er de færdige.
Sådan gør en inputmaske kaos til orden
En inputmaske formaterer automatisk nummeret, mens nogen skriver. De taster 5 5 5 1 2 3 4 5 6 7, og feltet viser (555) 123-4567. De skriver langsomt eller hurtigt, og formateringen følger med. Det har to formål. For det første giver det dem feedback i realtid om, at de skriver i det rigtige format. For det andet forhindrer det dem i at skrive det forkerte format fra start. De kan ikke taste et tegn, der bryder formatet. Feltet tager ikke imod det.
Det viste format afhænger af det valgte land. Vælger de USA, er masken (XXX) XXX-XXXX. Vælger de Canada, er den den samme. Vælger de Tyskland, tilpasser masken sig. Brugeren ser et format, de kender. De skriver ind i det. Dataene ankommer rene hos dig.
Forskning viser, at 89 procent af brugerne indtaster et telefonnummer i det format, de selv vælger, selv når der er hints. En inputmaske fjerner problemet helt. Du hinter ikke om formatet. Du håndhæver det visuelt, mens de skriver.
Landekode og international understøttelse
I det øjeblik du går international, har du brug for en landevælger. En dropdown, der viser landenavne med flagikoner. Brugeren vælger sit land. Feltet opdaterer sin inputmaske. Landekoden vises automatisk.
To designvalg er vigtige her. For det første: Sæt en klog standardværdi. Hvis de fleste af dine brugere er i USA, så brug USA som standard. Hvis du har et globalt publikum, så brug brugerens faktiske placering via geolokalisering. Én i Frankrig skal ikke scrolle forbi 20 lande for at finde Frankrig. For det andet: Hold landevælgeren synlig og let at ændre. En bruger kan ved en fejl vælge det forkerte land. De skal kunne skifte med ét tryk og ikke lede efter en gemt dropdown.
Landekoden skal vises sammen med nummeret. Brugeren ser +1 (555) 123-4567, ikke bare (555) 123-4567. Det gør formatet entydigt. De ved, at det er et amerikansk nummer ud fra +1-præfikset. Hvis de har lavet en fejl og valgt det forkerte land, ser de det med det samme og kan skifte.
Og så endnu en ting: Når brugeren skifter land, så behold det nummer, de allerede har skrevet. Ryd ikke feltet. Nulstil ikke alt. Hvis de skrev 5551234567 og så opdagede, at de valgte det forkerte land, så lad dem ændre landekoden og beholde cifrene. De skal ikke starte forfra.
Mobiltastaturer og attributten type="tel"
På en telefon har tastaturet betydning. Vis e-mailtastaturet til et e-mailfelt. Vis taltastaturet til et telefonnummer. Det er ikke kun en bekvemmelighed. En lille forskel i tastaturets layout forhindrer fejl. Den, der ser et taltastatur, bliver mindet om, at de skriver et tal og ikke tekst. Layoutet gør det sværere at taste bogstaver ved en fejl.
Brug type="tel" i HTML for at få taltastaturet frem automatisk. Ikke alle telefoner viser det samme tastatur. Nogle viser 0-9 plus symboler. Nogle viser kun tal. Nogle viser bogstaver sammen med tal. Det varierer fra enhed til enhed. Men alle telefoner viser noget mere nyttigt end det fulde QWERTY-tastatur.
Ud over tastaturvalget er mobilskærme små. Gør inputfeltet stort. Knapper i tommelfingerstørrelse nederst. Input i fuld bredde. Ingen vandret scrolling. Et nummer, der er svært at trykke på, bliver ikke tastet rigtigt.
Hvilke valideringsstrategier der faktisk virker
Validering kontrollerer, om nummeret er ægte. Ægte betyder, at det følger formatreglerne for det valgte land og har det rigtige antal cifre. Forskellige lande har forskelligt antal cifre. Et amerikansk nummer har 10 cifre efter landekoden. Et tysk nummer har 6 til 11 cifre alt efter region. Din validering skal kende reglerne.
Den bedste valideringsmetode til telefonnumre er E.164-standarden. Det er det internationale format, som ITU har fastlagt, og som alle globale systemer forstår. E.164-format er et plustegn, landekode og derefter det nationale nummer. Ingen mellemrum, ingen parenteser, ingen bindestreger. +14155550123 til et amerikansk nummer. Det er det, der gemmes i din database. Det, brugeren ser og skriver, er formateret, så det er let at læse. Det, der gemmes, er E.164 for at sikre ensartethed og nøjagtighed.
Kør validering to steder. For det første: Valider i browseren, mens brugeren skriver. Validering i realtid. De ser et flueben, når nummeret er komplet og gyldigt. De ser en besked, når noget mangler. For det andet: Valider på din server, når de har sendt. Validering i browseren gør oplevelsen glat. Validering på serveren beskytter dine data, hvis nogen slår browserens kontrol fra eller sender dårlige data gennem en API.
Fejlen ved at bede om bekræftelse af telefonnummer
Nogle formularer spørger om telefonnummer og derefter om bekræftelse af nummeret. Skriv dit nummer. Skriv det igen for at bekræfte. Det fordobler gnidningen. Nogen skal skrive et nummer på 10 cifre rigtigt og derefter skrive det igen rigtigt. De fleste laver en tastefejl i ét af de to forsøg. Så sidder de fast. De to numre stemmer ikke overens. De skal rette begge felter for at komme videre.
En bedre metode er at validere nummeret i realtid, mens de skriver. Når de når til send-knappen, er nummeret allerede valideret. Du behøver ikke, at de skriver det to gange. Selve valideringen er bekræftelsen.
Almindelige fejl, der ødelægger kvaliteten af telefondata
Du accepterer ethvert telefonnummer uden at tjekke landet
En formular accepterer et nummer på 7 cifre og et på 15 cifre uden at vide, hvilket land hvert af dem kom fra. Begge gemmes som gyldige. Senere prøver du at ringe til nogen, og ingen af numrene virker. Valider altid ud fra det valgte land. Et nummer på 7 cifre kan være gyldigt i nogle europæiske lande. Et nummer på 10 cifre er standard i USA, men forkert alle andre steder. Landets sammenhæng har betydning for hver valideringsregel.
Du viser kun valideringsfejl efter afsendelse
Hvis du venter, til nogen klikker på send, med at fortælle dem, at telefonnummeret er ufuldstændigt eller ugyldigt, har du skabt gnidning. De klikker på send. Ser en fejl. Retter nummeret. Sender igen. Validering i realtid forhindrer det. I det øjeblik de er færdige med at skrive nummeret, ved de, om det er gyldigt. Når de sender, bør der ikke være nogen overraskelser.
Du gemmer landevælgeren et forvirrende sted
Landekoden er ikke en eftertanke. Gør den tydelig. En stor dropdown øverst i telefonfeltet, ikke gemt under tre andre dropdowns. Brugeren skal kunne se den og let ændre den. Hvis de vælger det forkerte land, skal de straks lægge mærke til det, når formatet i feltet skifter.
Du forklarer ikke, hvorfor du har brug for telefonnummeret
Forskning viser, at 14 procent af brugerne dropper en checkout, hvis et telefonfelt er obligatorisk uden forklaring. Men test viser også, at brugerne bliver, hvis du blot fortæller dem, hvorfor du har brug for det. Tilføj én sætning hjælpetekst. "Vi bruger det til at bekræfte din ordre" eller "Sådan kontakter vi dig, hvis der er spørgsmål." Lidt sammenhæng forhindrer frafald.
Du bruger en formatering, der kun virker i ét land
Hvis du formaterer alle numre som (XXX) XXX-XXXX, har du låst dig til amerikanske numre. Det format betyder intet i Tyskland eller Japan. Brug enten E.164 til opbevaring og en landebevidst maske til input, eller lad formatet tilpasse sig det valgte land. Gå ikke ud fra, at ét format virker overalt.
Privatliv og det valgfrie telefonfelt
Telefonnumre er personoplysninger. I mange lande udløser indsamling af dem privatlivsregler. Brugerne er i stigende grad forsigtige med telefonnumre, fordi de fører til spamopkald. Nogle formularer indsamler telefonnumre af vane, ikke af reelt behov. Hvis du ikke har brug for et telefonnummer, så lad være med at spørge om det. Hvis du har brug for det, så forklar hvorfor.
Gør feltet valgfrit, hvis det er muligt. Obligatoriske felter skaber gnidning. Valgfrie felter mindsker frafaldet. Hvis telefonkontakt er vigtig, men ikke absolut nødvendig i dit workflow, så markér feltet som valgfrit og forklar værdien. "Tilføj dit telefonnummer, så vi kan sende dig ordreopdateringer på sms" giver dem en grund til at udfylde det, selv om det ikke er påkrævet.
Sådan håndterer WEMASY telefonnummerfelter
WEMASY's formularbygger har telefonnummerfelter med indbygget international understøttelse. Opret et telefonfelt, og vælg, om det er lokalt eller internationalt. Til lokale felter vælger du dit land. Til internationale ser brugerne en landedropdown med flagikoner. Feltet viser automatisk den rigtige inputmaske ud fra det valgte land. Mens de skriver, formaterer feltet automatisk. (555) 123-4567 vises, uden at de skriver parenteser og bindestreger. Validering i realtid bekræfter, at nummeret er komplet og gyldigt for det valgte land. På mobil vises taltastaturet. Feltet virker på alle enheder. Du kan se dine telefonnummerdata i formularens analytics og lægge mærke til mønstre i, hvilket format brugerne forsøger at skrive. Når data ankommer i dit CRM, er alle numre i E.164-format. De er ensartede. De virker med opkaldssystemer. Din opfølgning når den rigtige person.