14 tipp a tökéletes mobilbarát landing oldalakért
Az elmúlt években több helyen is találkozhattál a kijelentéssel, miszerint az online forgalom nagyobb részéért felelősek a mobileszközök, mint az asztali számítógépek. Ennek ellenére azonban az asztali készülékeken továbbra is több konverziót sikerül lebonyolítani, mint okostelefonokon vagy táblagépeken.
Hogy miért? Nos, ennek két fő oka van. Az egyik, hogy sokan még mindig nem szívesen bízzák rá személyes adataikat egy mobileszközre, vagy egy mobilon böngészett webhelyre – ez ellen nem igazán tudsz mit tenni.
A másik ok, hogy a legtöbb mobilos webhely egyszerűen nem biztosít megfelelő felhasználói élményt, ami konverzióra ösztönözné a látogatókat – ez az, ami ellen rengeteget tehetsz saját webhelyed mobilos landing oldalain. A következőkben felsorolt tippek pontosan ebben hivatottak segíteni! Mielőtt azonban belevágnánk…
Mik azok a landing oldalak?
Azokat az oldalakat nevezzük egy webhelyen landing oldalaknak (más néven „céloldalaknak”), amelyekre a látogatók megérkeznek, miután egy keresőtalálatra, vagy egy hirdetésre kattintottak.
Ilyen értelemben webhelyed minden indexelt oldala lehet landing oldal, de általánosságban azokra az oldalakra értjük, amelyek fizetett hirdetéseidhez tartoznak (a Google-ról, a Facebookról, stb.)
Mit tehetsz mobilos landing oldalaid optimalizálásáért?
1. Készíts különálló landing oldalt mobilkészülékekre
A legtöbb landing oldal azért nem konvertál jól mobilon, mert habár reszponzív designt használnak, általában alapjáraton egy asztali weboldalnak vannak elkészítve, ami alkalmazkodik a mobiképernyők méretéhez is.
Ebből következik, hogy az oldal felépítése nem mobilokra készült, és mivel az emberek másképpen használják a webhelyeket asztali és mobileszközökön, az ilyen landing oldalak használata nem kifejezetten intuitív ezeken a készülékeken.
Tisztában kell lenned azzal az úttal, amelyet ügyfeleid megtesznek a konverziójuk pillanatáig, és az út minden szakaszához külön, mobil-első designú landing oldalakat is létre kell hoznod, hogy megfelelj a mobilozók igényeinek.
2. Kínálj azonnali hívási lehetőséget
Habár fontos, hogy az alapvető elérhetőségek és információk (pl. nyitva tartási idők) könnyedén fellelhetők legyenek webhelyeden, előfordulhat, hogy a felhasználóknak további kérdéseik vannak, amiket egy ügyfélszolgálatos munkatársnak szeretnének feltenni.
Tedd egyszerűbbé ezt számukra egy „Kérdése van? Hívjon most!” (vagy hasonló feliratú) gombbal. Az azonnaliság fontos a mobilfelhasználók számára, és ha nem találják meg, amit keresnek, vagy nem tudnak kitől segítséget kérni, akkor rövid időn belül távoznak majd webhelyedről.
3. Használj opcionális görgetést
Az esetek többségében érdemes rövidre, tömörre, lényegretörőre fogni landing oldalaidat. Vannak persze olyan felhasználók is, akik részletesebb információkra kíváncsiak kínálatodról, cégedről, vagy bármi másról webhelyeden – az ilyen felhasználóknak több kell egy rövid landing oldalnál.
Az ilyen esetekre kínálj opcionális görgetést. Ehhez navigációs gombokat kell elhelyezned landing oldaladon, amelyek lehetővé teszik a látogató számára, hogy egy hosszabb, tovább is görgethető oldalra kerüljenek át. A cél az, hogy ne próbáld meg azt a rengeteg információt ráerőltetni a látogatókra, akik tényleg csak a landing oldalra kíváncsiak, add meg nekik a választás lehetőségét.
4. Használj kitűzött fej- vagy lábléceket
Ez egy érzékeny pont, hiszen a mobilkészülékek képernyőin általában nagyon kevés hely áll a rendelkezésedre design szempontjából. Azonban pontosan ezért olyan fontos, hogy minél egyszerűbbé tedd a navigációt a látogatók számára.
Ezt a legegyszerűbben egy olyan navigációs sávval oldhatod meg, amely mindig a képernyő tetején (vagy alján) marad, bárhová is görgetnek a felhasználók landing oldaladon. Ez javítja a felhasználói élményt, és arra ösztönzi az embereket, hogy tovább maradjanak webhelyeden.
5. Írj rövidebb szövegeket
Ez a fenti ponthoz kapcsolódik – az emberek nem regényeket szeretnének olvasni mobilkészülékeiken, ezért igyekezz rövidre, tömörre fogni mobilos tartalmaid fogalmazását, különben rengeteg látogatót veszíthetsz el, mielőtt megtalálnák, amit keresnek. Nézzük, hogy mit tehetsz ez ellen:
- Nélkülözz mindent, ami felesleges, de ügyelj a szöveg érthetőségére: Csak a legfontosabb mondanivalókat hagyd meg, de ügyelj rá, hogy a szöveg így is érthető, logikus maradjon.
- Használj pontozott felsorolást: A pontozott felsorolások segítenek tömören, átláthatóan adagolni a legfontosabb dolgokat anélkül, hogy további magyarázatot igényelnének, ráadásul a legtöbben szívesebben futnak át egy ilyen felsorolást, mint egy bekezdésnyi szöveget.
- Használj rövid mondatokat és bekezdéseket: Fontos, hogy a mondatok és a bekezdések rövidek, és könnyedén olvashatók legyenek. Ugyanez a helyzet a címekkel is – egy 8-10 szavas cím több soros is lehet egy mobilkészüléken. Ezt nem mindig lehet megkerülni, de érdemes megpróbálni.
6. Spórolj a vizuális elemekkel
Habár a képek, a videók, és más vizuális elemek remek kiegészítői lehetnek szöveges tartalmaidnak, sokkal több adatforgalmat is igényelnek azoknál. Mivel nincs mindenütt nyilvános Wi-Fi (és sokan nem is szívesen használják ezeket biztonsági okokból), fontos ügyelni rá, hogy a nélkülözhetetlen vizuális elemek a lehető legkevesebb adatforgalmat használják fel.
A képek esetén figyelj a felbontásra (felesleges nagy képeket feltölteni egy mobilos oldalra) és a hatékony képtömörítésre. Ha videók is szerepelnek landing oldaladon, akkor győződj meg róla, hogy egyik sem kezd el automatikusan lejátszódni.
Az egyszerű, letisztult design és a mutatós, de minimális adatforgalmat igénylő látványelemek is hatásosak lehetnek, persze ez már némi kreativitást igényel majd. A lényeg az, hogy vedd figyelembe, hogy a mobileszközök korlátozott erőforrásokkal, sávszélességgel, és letölthető adatmennyiséggel rendelkeznek!
7. Ügyelj a sebességre
A webhelyek betöltési és működési sebessége nem csak azért fontos, mert a Google tavaly nyár óta a mobileszközökön is rangsorolási szempontnak tekinti ezeket, hanem azért is, mert egy átlag felhasználó csupán néhány másodpercig hajlandó várni egy oldalra, mielőtt visszalépne róla, hogy más találatokat nézzen meg inkább.
Az átlag mobiloldal durván 15 másodperc alatt tölt be, ami aggasztó, ugyanis a mobilos felhasználók durván fele nagyjából 3-5 másodpercet hajlandó várni visszalépés előtt. Íme néhány további tipp, amikkel felgyorsíthatod webhelyedet, és itt a Google sebességmérő eszköze is, amivel ellenőrizheted saját oldalaidat is.
8. Gondold át navigációdat
Néhány marketingszakértő szerint érdemes lenne teljesen elhagyni a navigációs opciókat a landing oldalakon, és szó szerint minden elemet arra áldozni, hogy a konverzió irányába mozgassuk a látogatókat.
A legtöbb mobilos landing oldal (és webhely) egy úgynevezett „hamburgeres” menüt használ (három vízszintes vonal egymáson), hogy ezzel is képernyőfelületet spóroljon meg a tartalom javára. A felhasználók már ösztönösen tudják, hogy ez a gomb egy részletesebb menüt nyit meg.
Más oldalakon kitűzött fej- vagy láblécek működnek, elérhetőbbé téve ezzel a navigációt. Hogy melyiket választod, az csak rajtad múlik, de tartsd észben, hogy az emberek másképpen használják a weboldalakat mobileszközökön, mint egy számítógépen.
9. Optimalizáld űrlapjaidat is
Az űrlapok kitöltése nem a legkényelmesebb feladat mobileszközökön, tehát fontos, hogy a lehető legkevesebb információt kérd be látogatóidtól, hogy megspórold nekik az ezzel járó kínokat. Ha megszerzed email címüket, akkor később úgyis bármikor felkeresheted őket több információért.
10. Használj kontrasztos designt
A kontrasztos elemek két szempontból is fontosak egy mobilos landing oldalon.
Egyrészt figyelemfelkeltők, és kattintásra (vagyis koppintásra) ösztönzik a látogatókat, másrészt mivel az emberek változó fényviszonyok mellett használják készülékeiket, így elképzelhető, hogy a kevésbé kontrasztos elemek nem lesznek eléggé kivehetők a képernyőn (például a szabadban, napsütésben).
11. Használj fehér térközöket
Számos nagyobb márka használ előszeretettel üres, fehér térközöket designjában, szellősebbé, átláthatóbbá, elegánsabbá téve ezzel webhelyét (az Apple jó példa erre). A fehér térközök némi pihenőidőt biztosítanak a szemeknek a szövegek olvasgatása közben, továbbá egyszerűbbé teszik az oldalak ujjal való kezelését az érintőképernyőkön (és csökkentik a félrenyomásokat is).
12. Helyezd el CTA-dat az oldal tetején
Habár a mobilos felhasználók hozzá vannak szokva, hogy mindenképpen görgetniük kell valamennyit az oldalakon, a „hajtás feletti” rész fogalma a mobilok világában is jelen van. A mobilozók többségének figyelmét az oldalak teteje kapja meg, így célszerű, a CTA-t is elhelyezni itt, hogy az minden görgetés nélkül látható legyen.
13. Végezz A/B teszteket
Ez talán a legfontosabb optimalizálási tipp az eddigiek közül. Kitartó A/B teszteléssel szép lassan, de biztosan lépkedhetsz landing oldalaid legjobban konvertáló verziója irányába.
Egy A/B teszt a következő alapvető lépésekből áll:
- Tűzz ki egy célt – például több feliratkozás a hírlevélre.
- Döntsd el, hogy landing oldalad mely eleméből szeretnél összevetni két verziót – például, hogy a feliratkozó űrlap milyen adatokat kér be, vagy hogy mit kínálsz a feliratkozásért cserébe.
- Készítsd el az oldal két verzióját, amelyek kizárólag abban az egy elemben különböznek egymástól.
- Adj némi időt a tesztnek, majd nézd meg, hogy mely verzió konvertált több felhasználót – ezzel a verzióval folytasd a tesztelést a 2. ponttól.
Ha részletesebb információkat szeretnél az A/B tesztelésről, akkor ez az útmutató neked szól.