Tidligere hadde nettsteder mange unødvendige elementer, nemlig sider fulle av prangende og stygge fargevalg, for mye tekst fast i små mellomrom, og forgrunnsvinduer som dukker opp og irriterer besøkende.

Men designerne visste ikke mer den gang, eller rettere sagt, de jobbet bare med de eneste designtrender og beste praksis de visste.

Tidene har endret seg mye siden den gang.

Webutviklere og designere er ikke lenger begrenset av teknologi eller teknikk, noe som betyr at det ikke finnes flere unnskyldninger for dårlig design. Dette gjelder hvert element som finnes på et WordPress-nettsted, fra startsidebildet til skjemaer kontakter, samt fra typografi til popup-vinduer. Alt betyr noe nå når du designer for brukeropplevelse.

I dag vil jeg fokusere på det som gjør en popup effektiv, noe jeg ser på som en viktig del i konverteringsprosessen. Spesielt vil jeg ta en titt på anatomien til en effektiv WordPress-popup og hvordan dette spennende elementet kan øke konverteringsfrekvensen din.

Argumentet for å bruke popup-vinduer på WordPress

Pop-ups er et interessant designelement. Mens de midlertidig avbryter brukeropplevelsen (som vanligvis ikke blir satt stor pris på), tilbyr de som blir gjort riktig noe som er så tiltalende eller spennende at besøkende ikke har noe imot å miste en minutt å ta hensyn.

Selvfølgelig, i dette tilfellet snakker vi om konverteringsgenererende popup-vinduer som tjener til å samle abonnenter til nyhetsbrev eller lokke besøkende til å foreta kjøp. Men popup-vinduer kan brukes til ulike formål. Du kan for eksempel dele informasjonskapsler eller personvernregler, anbefale relaterte varer etter at besøkende har lagt noe i handlekurven, eller til og med be dem om å ta en rask undersøkelse.

Pop-up-anatomi - Pop-up av målanbefalinger

For det meste, hvis du bruker et popup-vindu, vil du sannsynligvis at besøkende skal ta affære. Tross alt, hvorfor avbryte opplevelsen hvis forstyrrelsen ikke er en nyttig bruk av tiden deres? I følge en studie på nesten to milliarder popup-vinduer, fant de at den gjennomsnittlige konverteringsfrekvensen for disse typer popup-vinduer var 3,09%.

Nå er det spørsmålet: Er popup-vinduer fortsatt relevante og effektive? Hvis markedet er så overmettet med exit-popup-vinduer, hallostenger, helsidesoverlegg og mer, er dette et konverteringsgeneratorverktøy verdt å bruke på WordPress-siden din?

Selvfølgelig !!!

Forgrunnsvinduer tar høyde for mange gode metoder for nettdesign. For eksempel:

  • Forgrunnsvinduer fjerner unødvendig rot fra sidene til nettstedet ditt.
  • De er vanligvis sammensatt av rene bilder og minimal tekst.
  • Handlingskallene er godt utformet og rett og slett tilbudt i form av ordlyden.
  • Det er en liten læringskurve for de besøkende, ettersom folk flest er kjent med popup-vinduer og vet hvordan de skal samhandle med dem.
  • Forgrunnsvinduer gir en morsom mulighet til å infisere nettstedet ditt med animasjoner, videoer eller sosiale bevis.
  • Du kan enkelt lage dem med WordPress plugins høy kvalitet som Hustle eller OptinMonster.

Anatomi popup - sosialt bevis HubSpot

Generelt er en veldesignet pop-up ideell for å fange oppmerksomheten til besøkende når du trenger det mest. Du kan bruke dem til å sende varsler eller forespørsler i tide. Du kan også bruke besøksdata for å lokke dem til å kjøpe.

Anatomien til en effektiv WordPress-popup

Åpenbart avhenger suksessen til WordPress-nettstedets popup-vinduer av de som er perfekt designet og har så overbevisende tilbud at besøkende ikke kan la være å samhandle. Så la oss ta en titt på hvordan en vinnende formel for en effektiv pop-up ser ut.

1. stil

De forskjellige typene av popup-vinduer har en tendens til å være mer effektive når det gjelder å konvertere besøkende til abonnenter:

  • Pop-ups for e-postabonnement har en konverteringsfrekvens på 2,9%.
  • Velkomstvinduer (de som fyller hele siden ved oppføring) konverteres til 2,6%.
  • Rull-utløste popup-vinduer konverterer 1,9%.
  • Smart eller Hei popup-vinduer viser en konvertering av 0,5%.

Det betyr ikke at du alltid må bruke en tradisjonell popup-popup for e-postabonnement. Her er et eksempel fra Neil Patels side.

Pop-up anatomi - Neil Patel's Bar Hei

Denne er godt utført, fordi den er enkelt designet, ikke-påtrengende, et bruker morsom animasjon for å fange oppmerksomhet i tilfelle det minimale fotavtrykket blir ubemerket. Husk at valg av stil ikke handler om å bruke den som er den mest populære eller mest kjente for høyere konverteringsfrekvenser. Det handler om å finne en stil som fungerer for nettstedet ditt, de besøkende, og som er designet for å utfylle opplevelsen i mellom.

2. farge

Farge vil selvfølgelig alltid spille en viktig rolle i design av nettsteder. Ved å forstå psykologien bak de valgte fargene dine, kan du lage mer effektive popup-vinduer som konverterer. Selvfølgelig kan du heller ikke glemme det etablerte fargevalget for merkevaren din, så det handler om å finne en balanse mellom å designe et popup-vindu som ser bra ut på siden, men som tvinger også besøkende til å ta affære.

3. sammensetningen

Det er viktig å ta et skritt tilbake og se popup-vinduet som en helhet. Selv om utformingen av hver bevegelige del i pop-up-saken, betyr det også den generelle sminke av pop-up.

Pop-up-vinduet ditt skal:

  • være enkel og enkel å følge.
  • Designet med rene linjer og være godt balansert.
  • Inkluder relevante bilder med høy oppløsning; ideelt sett et enkelt bilde som oppsummerer emnet for tilbudet.
  • Ser ut som en utvidelse av nettstedet ditt, og er åpenbart ikke laget av en popup med begrensede tilpasningsalternativer.
  • Bruk en stor, lettlest typografi.

4. tekst

Så har vi popup-meldingen. Mens du ikke er i ferd med å utvikle språket som går inn i disse tingene, er det en rekke beste fremgangsmåter som du fremdeles bør være oppmerksom på når det gjelder å fylle popup-vinduer med tekst.

Husk følgende:

  • Ta alltid med en overskrift, en kort melding (en setning vil gjøre det) og en oppfordring til handling.
  • Bruk sterkt språk som appellerer til besøkende følelser.
  • Vær kort. Hvis du ikke kan skrive den på mindre enn 30 ord, tilhører denne meldingen ikke et popup-vindu.
  • Bruk den samme tonen og personligheten som du bruker på nettstedet ditt.
  • Tilby noe verdifullt som de besøkende ikke vil finne andre steder på nettstedet.
  • Bruk haster hvis mulig. Hvis du ikke kan gjøre det med ord, gjør det med farger.

Anatomy pop-up - Wishpond-skjermoverlegg

5. CTA

Det er en merkelig voksende trend i disse dager hvor nettsteder gir besøkende to muligheter til å oppfordre til handling. Jeg forstår hvorfor denne trenden vokser, men jeg har sett den brukt feil på så mange nettsteder at jeg håper trenden til slutt vil dø ut.

Du har sannsynligvis sett denne dårlige applikasjonen selv:

  1. Det positive alternativet : Denne sier: “Å takk, takk! Jeg vet at dette tilbudet er i ferd med å endre livet mitt til det bedre! " 
  2. Det negative alternativet : Denne sier: "Jeg liker å ta dårlige livsvalg og jeg setter pris på at du gni ansiktet mitt." La meg bare klikke på dette alternativet for automatisk avskrivning for å motta et nytt vindu som spør meg igjen om jeg vil ta denne forferdelige avgjørelsen. " 

Dette er ikke å si at alle popup-vinduer med to CTA-alternativer er dårlig utformet eller ment å skamme den besøkende. Tim Ferris har et godt eksempel på et godt utført dobbelt alternativ CTA:

Pop-up Anatomy - Tim Ferris Positive Negative

Samlet sett vil jeg imidlertid si at hvis du prøver å være sarkastisk eller skremme de besøkende til deres beslutning, så gå ut av nettstedet ditt og legg det på Twitter. Nettstedet ditt er ikke et sted for det, og Twitter vil forhåpentligvis svelge det helt opp.

Bortsett fra dette kjæledyret, foreslår jeg også å holde oppfordringen til handling enkel. Bruk et enkelt språk som gjør det klart hva besøkende får for å skrive inn e-postmeldingen eller klikke på knappen. Hold også jobben til et minimum: ikke mer enn to felt å fylle ut (dvs. e-post og kanskje et navn) og en knapp å klikke på.

Det er det for denne opplæringen, jeg håper det lar deg utforme oppfordringsknappene dine godt.