Miért érdemes optimalizálni, megtervezni?
Hogyan lehet optimalizálni egy pop-up ablakot?
A most következő példa a Sumo.com oldal cikkéből készült, ami olyan egyszerűen és érthetően mutatja meg a lényeget, hogy azt bárki megértheti, szakmai ismeretek nélkül, hiszen képekkel jól illusztrálva mutatja be nekünk, mik is a legnagyobb hibák, mikre kell odafigyelni és miken érdemes változtatni. Az alábbi kis bemutatómban érintem a legfőbb problémákat, amik előszoktak fordulni.
A kiindulás, a rettenetes példa
-
- A kiindulás, ami szinte nulla konverziót ígér, igazi ellenpélda
-
- A honlapon így nézett ki maga a pop-up
Igen, ez az amitől a szakmabeliek szívrohamot kapnak és UX designr-ért, marketingesért és sok esetben papért is kiáltanak. Nem is véletlenül. Remek példája annak, hogy mik azok amiket nem szabad. Kezdjük el szép sorban, mondjuk az UX design alapelveivel.
- Először is, ami súlyos probléma: a színeknek közül nincs az eredi honlaphoz. Rendben, felhívóak, kirívóak, de azért túlzás és elég ízléstelen is ebben a formában. Ráadásul a barna színű gomb, a pirosas részen nem emelkedik ki igazán. CTA (call to action – cselekvésre ösztönző) gombnál egy súlyos hiba.
- Aztán ha tovább haladunk, akkor fel kell tűnjön a szövegek olvashatóságának a nehézsége. Fárasztja a szemet, nem elég kontrasztos. Tipikusan olyan, amit senki nem olvas el, mivel az agy automatikusan védi magát a fölöslegesen fárasztó elemektől.
- Nincsenek elrendezve az egyes elemek. Nagyjából csak oda vannak dobálva, aztán ahogy puffantak. Szintén fárasztja a szemet és nehezíti a lényeges részek észrevételét. Az emberi agy szereti ha egyfajta rend van a tartalomban amit lát és azt fel is tudja ismerni.
UX után a felugró ablak
A jobb oldali az, ami már az UX design elveket megkapta. Látható a különbség, nem is kicsit. Ki van emelve a cím, jól olvasható alatta a szöveg, a mezők, gomb, cím elrendezése is egységes lett, továbbá a CTA gomb kontrasztos, eltér a többi elemtől erősen. Mennyivel másabb, ugye? Pedig ugyan az a felugró ablak van mindkét képen. Gondolom mindenki tudja, hogy melyik az amelyik jobban konvertál, több feliratkozót gyűjt.
Bal oldalt a régi, a jobb oldalt az UX „kezelés” utáni
UX megvolt, most jöhet a tartalom
A pop-up ablak tartalma igen fontos. Sok tényezőt kell figyelembe vennünk, hogy igazán jól tudjuk optimalizálni. Azonban a legfontosabbak ezek közül: ki a célcsoport, milyen korosztály például (betűméret kérdése), milyen színekkel dolgozunk a honlapunkon, mik azok komplementer párosai, mennyire tudjuk röviden összefoglalni a mondanivalónk lényegét egy, maximum kettő mondatban. Továbbá az is még ide tartozik, hogy mennyire célirányos a látogató. Általánosságban véve utóbbi nem szokott nagyon magas szinten lenni. Ez mit is jelent? nem hajlandó sok dolgot (több kattintást, több szövegmező kitöltését) megcsinálni. Persze lehet simán lusta is, de az más tészta, itt most más szempontokat figyelünk.
Szóval ott a látogató, aki még bizonytalan. Szeretnénk megkérni valamire, jelen esetben egy email feliratkozásra. Vajon mikor fogja előbb megtenni, ha alig kell valami minimálisat megtennie vagy ha több mindenre is meg szeretnénk kérni? Persze, hogy a minimálisra fog törekedni. Tehát ha elé rakunk egy több mezős űrlapot vagy egy rövid, egy mezőset, akkor szinte biztosan az utóbbit, rövidebbet fogja kitölteni. Senki nem szeret egyszerre sok adatot megadni magáról, félti az adatait. Éppen ezért, érdemes több lépcsőben be kérni a látogató adatait. Először kell egy olyan adat, amin át el tudjuk a jövőben érni. Egy email feliratkozásnál, ez az email cím, amit jó ha meg is erősít a látogató. Az email megadása, visszaigazolása már egy – egy mikro-elköteleződés, amik segítik a látogatóból vásárló / megrendelő formálást. Ezután már lehet és érdemes neki email-t küldeni, hogy adja meg más adatait is, mint például Keresztnév, Vezetéknél és telefonszám. A fenti példában megkezdett pop-up ablak esetében a lerövidített verzió az alábbi módon fest:
Rövid, lényegre törő, illeszkedik az honlap megjelenésébe, de még is elüt attól kis mértékben
Miután kellően rövid és vonzó lett a felugró ablakunk, érdemes átgondolni a szövegezését. A fenti képen látható Yes (mint Igen) helyett, továbbgondolva lecserélték még a gomb szövegét és a címet is újra gondolták. Végül ilyen lett ez adott pop-up:
Átdolgozott megjelenés, újragondolt szövegek és mezők számának csökkentése után: Jobban konvertál, határozottan.
Összegzésképpen
Elmondható, hogy egy kis odafigyeléssel és egyes elvek mentén átgondolt (UX design például) elkészített felugró ablakok sokkal eredményesebbek. Hosszabb távon ez jelentősen befolyásolhatja mind konverziós célok elérést és így akár egész honlapunk vagy marketingünk sikerességét. A letisztult, jól átlátható, rövid tartalmakra és űrlapokra igyekezzünk koncentrálni, amihez azért nem árt, ha némi szépérzéket is adunk.
