6 aanmeldingspagina ontwerppraktijken voor wrijvingsloze formulieren
als marketeer denkt u waarschijnlijk dat u uw prospects goed begrijpt — wie ze zijn, hoe ze zich gedragen, enz. Dus als een van hen uw website of aanmeldingspagina bezocht, wat denk je dat ze vervolgens zouden doen?
waarschijnlijk registreren voor uw dienst, toch?
dat is niet altijd het geval, zoals een merk ontdekte. Voor hen, iets tussen die CTA en hun “Dank u” pagina was waardoor het bedrijf te verliezen bijna een kwart van de potentiële klanten.
er was een probleem met hun aanmeldingspagina.
startpagina ‘ s bouwen met Instapage ➔
Wat is een aanmeldingspagina?
Aanmeldpagina ‘ s, ook wel “registratiepagina ‘ s” genoemd, zijn niet allemaal hetzelfde. Sommige zijn PPC post-click landingspagina ‘ s; andere zijn gekoppeld aan de homepage via navigatie – sommige zijn zelfs de homepage. Ondanks hun verschillen delen ze allemaal hetzelfde doel: aanmeldingen genereren voor een dienst.
in veel gevallen is de aanmeldingspagina de laatste stap in de conversietrechter van een bedrijf. Het is waar prospects navigeren nadat ze een merk hebben geëvalueerd en besloten dat de service biedt wat ze nodig hebben.
daarom richten Aanmeldpagina ‘ s zich minder op het overtuigen van de prospect om te converteren en meer op het minimaliseren van de wrijving die er bij betrokken is. Die focus op bruikbaarheid betekent dat andere traditionele post-click landing page elementen zoals social proof, getuigenissen, en aandachttrekkende media nemen een achterbank.
kijk gewoon naar Shopify ‘ s aanmeldingspagina hieronder, die verschijnt op de homepage zodra u op “aan de slag” klikt.”
het is eigenlijk maar een korte vorm. En, zoals je een beetje later zult zien, de meeste sign-up pagina ‘ s zijn gebouwd op dezelfde manier, met niets meer dan een kop, een paar formuliervelden, en een call-to-action.
maar alleen omdat velen zo zijn ontworpen, betekent niet dat het de juiste manier is. Het maken van een succesvolle aanmeldingspagina gaat over meer dan het elimineren van afleiding en het verminderen van formuliervelden. De taak is tweeledig.
om maximale aanmeldingen te genereren, moet u de stappen bij het registreren minimaliseren en tegelijkertijd het meeste uit de weinige elementen halen die u gebruikt. Hier zijn enkele tips en inzichten van de experts.
gebruik een voordeel-georiënteerde kop
tegen de tijd dat een prospect op uw aanmeldingspagina aankomt, hebben ze in de meeste gevallen al uw dienst geëvalueerd en vastgesteld dat deze aan hun behoeften voldoet. Maar, betekent dat dat je ze er niet aan moet herinneren waarom ze daar zijn?
hieronder gebruikt Copyblogger een sociaal-proof gevulde kop om gebruikers te overtuigen om zich aan te melden, en hoger herinnert Shopify prospects dat hun proefperiode 14 dagen gratis is.
eenvoudig is goed, maar als je de ruimte hebt om je USP te versterken met een headline, Doe het dan. De kans is groot dat het een meer positieve impact heeft op conversies dan negatief.
maak al uw velden verplicht
deze tip gaat minder over het vereisen van uw bezoekers om uw formulier in te vullen en meer over het zeker weten dat u de juiste velden hebt gekozen. Daarmee bedoelen we, als je hebt bepaald dat een formulierveld optioneel is, je hoeft niet dat stukje informatie om de prospect te ondertekenen.
bijvoorbeeld, een service als Groupon moet uw locatie kennen bij het aanmelden om u relevante deals en coupons aan te bieden. Maar, Locatie is niet een cruciaal stukje informatie voor Instapage om te weten over haar klanten, dat is waarom we niet vragen om het tijdens de registratie.
als u het bedrijf, de positie en het aantal werknemers van uw prospect niet echt hoeft te weten, vraag het dan niet. Hoe minder werk ze moeten doen, hoe beter.
te overwegen formuliervelden
te overwegen formuliervelden te consolideren/kwijt te raken:
- Gebruikersnaam: hebben uw gebruikers echt een gebruikersnaam nodig om zich aan te melden? Of kun je gewoon vragen om hun e-mail, en laat ze hun Gebruikersnaam te bepalen zodra ze hebben ingelogd?
- Wachtwoord bevestigen: dit veld is verouderd en alleen nodig vanwege het maskeren van wachtwoorden, een andere onpraktische techniek.
Password masking is de technologie die ervoor zorgt dat elke letter eruit ziet als een identiek opsommingsteken wanneer deze in een formulier wordt ingevoerd. Het geeft de indruk van extra veiligheid, maar het enige waar het echt tegen beschermt is mensen die over je schouder gluren.
vraag uzelf af: zijn mijn prospects echt het creëren van hun wachtwoorden in een drukke openbare omgeving? Niet waarschijnlijk.
in plaats van een “wachtwoord bevestigen” – veld te gebruiken, kunnen gebruikers zien wat ze typen door het originele “wachtwoord” – veld te ontmaskeren, of door een “tonen/verbergen” – functie te gebruiken, zoals MailChimp doet op hun aanmeldingspagina:
- voor-en achternaam: overweeg het samenvoegen van de voor-en achternaam in één “volledige naam” veld. Of Vraag gewoon naar je voornaam. Misschien denk je er zelfs over om het helemaal weg te doen.
in een aantal voorbeelden hieronder (Buffer, Asana, Crazy Egg) vragen aanmeldingspagina ‘ s niet onmiddellijk om naam, maar laten hun geconverteerde klanten gegevens invoeren zodra ze op het platform zijn ingelogd.
- gebruikersovereenkomst: in plaats van uw gebruikers op een selectievakje te laten klikken waarin staat dat ze akkoord gaan met uw gebruikersvoorwaarden, kunt u overwegen een bericht boven uw CTA op te nemen zoals LinkedIn hieronder doet. Het stelt dat door het omzetten, de gebruiker automatisch toestemt.
startpagina ‘ s met Instapage ➔
Als u al die informatie absoluut nodig hebt, vraag er dan in stappen
kijk, soms hebt u echt veel informatie nodig om een nieuwe gebruiker te registreren. Aanmeldingen die ter plaatse betaling vereisen vereisen lange formulieren om gevoelige informatie zoals factuuradres en creditcardnummer vast te leggen. Wanneer dat gebeurt, overwegen het opsplitsen van het registratieproces in meerdere stappen.
uit een rapport van Formstack blijkt dat de registratieformulieren van meerdere pagina ’s vorig jaar met meer dan 9 pagina’ s beter presteerden dan de registratieformulieren van één pagina.%:
waarom?
formulieren met meerdere pagina ‘ s maken het converteren minder overweldigend door het proces in enkele korte stappen te scheiden. Meer pagina ‘ s betekenen meer ruimte voor grotere lettertypen, langere velden en beschrijvende labels die mogelijk niet in een kortere vorm passen. Bovendien, multi-pagina aanmeldingen komen meestal met een handige voortgangsbalk waarmee gebruikers weten hoe ver ze zijn in de registratie.
onthouden: als u uw formulier kunt inkorten door het elimineren van een paar velden, verkort het. Als je dat niet kunt, probeer dan niet om het korter te laten lijken door alles in een kleine hoeveelheid ruimte te proppen. U zult alleen rommel uw pagina en overweldigen uw prospect.
overweeg het gebruik van een modaal venster
voor degenen met een snel aanmeldingsproces, zoals Canva, biedt een modaal venster een paar voordelen.
ontwerper Joshua Johnson legt uit waarom:
ze overlappen de huidige inhoud in plaats van u naar een andere pagina te brengen. Op de een of andere manier is dat gewoon minder verontrustend dan weggevoerd worden naar een nieuwe plek, wat voelt als een onderbreking. Door het dimmen van de homepage graphics en het brengen van een modal sign registratieformulier, krijg je het gevoel dat het proces snel en pijnloos zal zijn en dat je terug naar browsen in een mum van tijd.
in een tijd waarin internetgebruikers ongeduldig zijn dan ooit, is het een goede gewoonte om hen de indruk te geven dat ze in een oogwenk weer kunnen surfen.
Bouw landingspagina ‘ s met Instapage ➔
schakel social autofill
in bijna elk aanmeldingspagina hieronder zie je social autofill knoppen. Hiermee kunnen gebruikers uw formulier met een enkele klik omzeilen door relevante persoonlijke informatie te importeren die ze al hebben ingediend bij sociale netwerken.
Formstack vond dat door het opnemen van deze functie, gebruikers in staat waren 189% hogere vormconversies te genereren. Bovendien, 86% van de mensen zeggen dat het creëren van nieuwe gebruikersaccounts op verschillende websites is onhandig. Wanneer uw doel is om het omzetten zo eenvoudig mogelijk te maken, gebruik te maken van social autofill is een no-brainer.
plaatsaanduiding tekst
om te converteren, moeten bezoekers weten hoe ze uw formulier moeten invullen. Maar, met behulp van placeholder tekst is niet de beste manier om ze te laten zien.
volgens de Nielsen Norman-groep heeft het toevoegen van lichtgrijze tekst aan uw formuliervelden de potentie om:
- belast het kortetermijngeheugen van gebruikers. Wanneer ze beginnen te typen en de grijze tekst verdwijnt, denken ze bij zichzelf: “hoeveel tekens moet mijn wachtwoord weer hebben?”
- maak uw formuliervelden onzichtbaar. Lege formuliervelden zijn eigenlijk meer merkbaar door prospects dan degenen met placeholders.
- irriteren gebruikers die door het formulier bladeren. Degenen die snel het invullen van uw formulier met behulp van de “tab” knop hebben geen tijd om te lezen explanational placeholder tekst voordat het verdwijnt.
- verwarren bezoekers. Ze kunnen placeholder tekst te verwarren met informatie die automatisch werd ingevuld.
om verwarring te voorkomen, dient u boven elk veld een label op te nemen dat de bezoekers precies vertelt wat ze erin moeten opnemen. Placeholder tekst zal alleen maar meer wrijving op uw registratie pagina te creëren.
Bouw landingspagina ’s met Instapage ➔
hoe de profs registratiepagina’ s bouwen
Nu u weet wat u op uw aanmeldingspagina moet zetten, laten we eens kijken hoe de profs hun registratiepagina ‘ s bouwen.
deze LinkedIn-aanmeldingspagina is van de landingspagina na klikken. Het is standalone, wat betekent dat het niet is verbonden met de website van het bedrijf via de navigatie — zelfs niet in het logo.
boven het formulier zou de kop een groter voordeel kunnen opleveren. Vier velden houden de wrijving laag. Hoewel, door het combineren van voor-en achternaam in een “volledige naam” veld, die wrijving kan nog lager worden gemaakt.
over elk tekstvak laat grijze letters prospects weten wat ze moeten typen, en boven het veld “Wachtwoord” is dat label nog specifieker. Hoewel, dat” wachtwoord ” veld niet volgen best practices door het weergeven van identieke kogels voor elke letter de prospect types.
extra grijze letters onder het laatste formulierveld laten bezoekers weten dat door op “Nu aanmelden” te klikken ze akkoord gaan met de gebruikersovereenkomst, het Privacybeleid en het Cookiebeleid van LinkedIn. Dat bespaart de prospect de extra stap van het hebben van een opt-in vak om toestemming te geven.
in de call-to-action benadrukt het woord “now” dat zodra de gebruiker op de CTA-knop klikt, ze onmiddellijk deel uitmaken van het netwerk. Voor zover de knop zelf gaat, kan hij nog wat meer knallen, denk je niet? Een andere achtergrond of knop kleur kan meer aandacht vestigen op waar de gebruiker moet klikken om mee te doen.
hieronder stroomlijnt een knop “Doorgaan met Facebook” het hele proces. Als u een profiel op ‘ s werelds grootste sociale netwerk, klik op die knop om automatisch invullen van het formulier voor u met behulp van gegevens die u al hebt gedeeld met Facebook.
Copyblogger
hier is een aanmeldingspagina die meer is dan alleen een formulier. Het eerste wat prospects waarschijnlijk zullen opmerken is die gigantische, sociaal-proof gevulde kop. Vertaald zegt het: “als we goed genoeg zijn voor 334.000 marketeers, zijn we ook goed genoeg voor jou.”
het maakt ook gebruik van een fenomeen dat algemeen bekend staat als “FOMO”, wat “angst om iets te missen” betekent.”Niemand wil missen op het krijgen van de voorsprong die 334.000 van hun industrie collega’ s hebben.
daaronder, een preview van alle gratis waardevolle inhoud die prospects krijgen na registratie verleidt hen om dat formulier in te vullen. De vorm zelf kan echter beter worden ontworpen.
door het “re-enter password” veld te elimineren en de voor-en achternaam Te comprimeren in “full name”, zou Copyblogger het aantal tekstvakken kunnen verminderen van 5 naar 3, en op zijn beurt de hoeveelheid wrijving die betrokken is bij het aanmelden. In plaats van dat” re-enter password ” veld, een show/hide optie kan worden gebruikt om de nauwkeurigheid te garanderen bij het invoeren van een wachtwoord.
om de wrijving nog verder te verminderen, moeten de etiketten in elk veld hierboven worden geplaatst. Op dit moment verdwijnt die grijze belettering wanneer prospects in het tekstvak klikken, waardoor ze gemakkelijk kunnen vergeten wat ze aan het typen waren.
over het algemeen is de vrije inhoud van Copyblogger te waardevol om te laten liggen, hoewel een paar tekortkomingen in de vorm en een paar uitgaande links de conversies op deze aanmeldingspagina kunnen schaden.
Crazy Egg
deze foto toont Crazy Egg ‘ s inschrijfformulier en hoe ze het optimaliseren voor nieuwe klanten met een verkort formulier en gepersonaliseerde CTA-kopie.Ten eerste, een bedrijf dat zichzelf “de leider” in zijn industrie noemt, is als een café dat zijn koffie de beste ter wereld noemt. Er zijn velen die het zeggen, maar weinigen die het kunnen bewijzen. In plaats van jezelf de beste te noemen, een back – up van uw claim met een statistiek of door het citeren van een bekende klant die gelooft dat je bent.
onder die kop is een afbeelding die een voorbeeld geeft van het inzicht dat je krijgt als je Crazy Egg gebruikt, en rechts van de afbeelding leggen drie regels kopie uit wat dat inzicht is samen met wat je ermee kunt doen.
op deze superkorte vorm is de wrijving minimaal. De kop benadrukt dat de proef is gratis, de knop verschijnt op de witte achtergrond, en de call-to-action is geschreven in de eerste persoon. Op dit moment is het enige dat deze vorm tegenhoudt om pijnvrij te zijn, de afleidende grijze plaatshouder tekst in elk veld.
hieronder versterkt sociaal bewijs in de vorm van herkenbare clientlogo ‘ s en de tekst “meer dan 200.000 bedrijven converteren beter met Crazy Egg” de overtuigingskracht van deze aanmeldingspagina.
in totaal maakt deze pagina het converteren een fluitje van een cent voor bezoekers.
Bouw landingspagina ‘ s met Instapage ➔
Buffer
wanneer u op de “Meld u gratis aan” call-to-action op de Buffer klikt.com, de homepage transformeert in een aanmeldingspagina door het implementeren van een korte pop-up formulier en donkerder omringende inhoud.
op die pop — up is het conversieproces eenvoudig: klik op een van de drie social login knoppen om het formulier te omzeilen, of voer een e-mailadres en wachtwoord in. Hoe dan ook, wrijving is minimaal. De enige manier waarop dit formulier gemakkelijker kan worden ingevuld? Weg met die afleidende placeholder tekst.
Asana
maximaal, aanmelden op deze pagina van Asana duurt twee klikken. Met een Google login-functie, het kan zo weinig als een te nemen.
een zin boven het formulier vertelt u hoe u het formulier moet invullen, zelfs bij welke e-mail u zich moet aanmelden.
direct daaronder leidt een formulierveld gevuld met grijze plaatshoudertekst de gebruiker af. Maar zal het mensen ervan weerhouden zich aan te melden? Niet waarschijnlijk. Deze vorm is bijna wrijvingsloos en eenvoudig in te vullen.
begin met het maken van een geoptimaliseerde aanmeldingspagina met Instapage, vraag vandaag nog een Instapage Enterprise demo aan.