Mobilos B2B személyre szabás: érd el a vásárlókat minden eszközön

A mobilos B2B személyre szabás jellemzően mellékes szempont. A személyre szabási szabályokat asztali böngészőben tervezik, 27 hüvelykes monitoron nézik át, és jóváhagyják, mielőtt bárki megnyitná a variánst egy telefonon. Aztán egy vevő rákoppint egy linkre egy LinkedIn-üzenetben, az alapértelmezett herót kapja, mert a személyre szabott blokk későn töltődött be, és továbbgörget egy esettanulmány-kártya mellett, amelyet két szó széles oszlopba préseltek.

Hogy ez mennyire számít, a forgalmadtól függ, és ezt érdemes ellenőrizned, mielőtt továbbolvasnál. Ez a cikk bemutatja, hogyan becsüld meg a mobilos lehetőséget a saját adataidból, mi változik, amikor kis képernyőre szabsz személyre, milyen CTA- és űrlapminták működnek telefonon, hogyan teszteld a változatokat valódi eszközökön, és milyen helyzetekben hordozzák a mobilos látogatások a legnagyobb szándékot.

Kezdd a saját eszközmegoszlásoddal

A „mobilos B2B forgalom arányára” közzétett számok nagyon eltérnek, és nagyon különböző oldalakat kevernek, így tervezéshez nem sokat érnek. Az analitikád néhány perc alatt megválaszolja a kérdést a saját vállalkozásodra:

1. A GA4-ben nyisd meg a Jelentések → Technológia → Technológiai részletek menüpontot, és állítsd a dimenziót Eszközkategória értékre. Használd az elmúlt 90 napot.
2. Adj hozzá egy összehasonlítást arra a forgalomra, amelyet ténylegesen perszonalizálsz (például azonosított célfiókok egy szegmensére, vagy a fizetett és e-mail-kampányokból érkező munkamenetekre).
3. Jegyezd fel a munkamenetek és a kulcsesemények (demókérések, kapcsolatfelvételi űrlapok) arányát mobilon és asztali gépen.
4. Ismételd meg a három legnagyobb forgalmú landing page-eden. A mobil aránya gyakran egészen más egy e-mailes és közösségi kattintásokat kapó oldalon, mint a kezdőlapon.

Két mintára érdemes reagálni. Ha a mobil a munkamenetek nagy, de a konverziók kis részét adja, a mobilos élmény valószínűleg elveszíti az embereket. Ha a mobil összességében kicsi, de bizonyos kampányoldalakon nagy, először ezeket az oldalakat szabd személyre mobilra, a többit hagyd.

Óvatosan a konverziós különbséggel. Egy része nem javítandó probléma: rengeteg vásárló telefonon olvas, és később laptopon konvertál. Mielőtt a mobilos oldalt hibáztatnád, nézd meg az eszközökön átívelő képet (lásd lent a mutatókról szóló részt).

Mi változik kis képernyőn

Egy perszonalizált elem a hajtás fölött, nem négy

Egy asztali hero egymás mellett elbír egy személyre szabott címsort, a látogató iparágának logósávját, egy ajánlást és egy CTA-t. Egy 375 pixel széles telefonon az első képernyőre a címsor, egy-két sor alszöveg és esetleg egy gomb fér ki. Döntsd el, melyik egyetlen elem jelzi, hogy „ez neked szól”, és gondoskodj róla, hogy görgetés nélkül látható legyen. A legtöbb B2B beállításnál ez a címsor, mert ez a legolcsóbban változtatható elem, és ezt olvassák el elsőként.

A renderelési sebességen múlik, hogy a változatot egyáltalán látják-e

A kliensoldali személyre szabás általában így működik: megjelenik az alapértelmezett oldal, egy szkript megkérdezi a személyre szabási szolgáltatást, ki a látogató, majd kicseréli a tartalmat. Lassabb mobilkapcsolaton a lépések közötti szünet hosszabb, így a látogató vagy felvillanni látja az alapértelmezettet a variáns előtt (villódzás), vagy egy üres blokkot, amíg vár. Egyik sem segít.

A saját oldalad ellenőrzéséhez nyisd meg a személyre szabott oldalt a Chrome DevToolsban, állítsd a hálózati lassítást az egyik lassabb előbeállításra (például Slow 4G), a CPU-lassítást 4x-re, és rögzíts egy teljesítményprofilt. Nézd meg, mikor jelenik meg a változat címsora az alapértelmezetthez képest. Ezután futtasd le ugyanazt az URL-t a PageSpeed Insightsban, és hasonlítsd össze a Largest Contentful Paint értéket a személyre szabott és az alapértelmezett változatnál. Ha a változat érezhetően késlelteti az LCP-t, hozd korábbra a döntést: szerveroldalra, az edge-re, vagy legalább csak a cserélt blokkot rejtsd el (ne az egész oldalt), amíg el nem készül.

Nincs hover

Az eszköztippek, az egérrel felfedhető panelek és az esettanulmányok egérmutatós előnézetei érintőképernyőn semmit sem érnek. Minden olyan személyre szabott komponensnek, amely a hoverre épül, koppintásos megfelelőre van szüksége. Az érintési célpontoknál a WCAG 2.2 bővített kritériuma legalább 44 × 44 CSS pixelt kér; ez AAA szintű kritérium, de az elsődleges gombokhoz észszerű alsó határ.

Rövid munkamenetek, és ugyanaz a vásárló egy másik eszközön

A mobilos látogatások gyakran rövidek, és később laptopon folytatódnak. A telefonon beállított süti nem érhető el a laptopon, így a sütialapú szegmensek nem követik a személyt. A cégszintű azonosítás (fordított IP vagy adatgazdagítás azon a hálózaton, amelyen a látogató van) és a követett linkekre kattintó, CRM-ben ismert kontaktok azok a jelzések, amelyek jellemzően átvihetők. Úgy tervezd a perszonalizációs szabályokat, hogy akkor is értelmesek legyenek, ha a látogató minden eszközön csak egyetlen munkamenetet lát.

Elrendezési minták személyre szabott blokkokhoz

Határozz meg mobilos prioritási sorrendet a személyre szabott blokkjaidnak, mielőtt a designer egymás alá rendezi őket. Gyakori sorrend: címsor, majd CTA, majd bizonyíték (logó vagy egysoros idézet egy hasonló cégtől), majd kiegészítő tartalom, például egy esettanulmány-kártya. Amikor az asztali oszlopok összecsukódnak, a blokkok ebben a sorrendben jelennek meg, nem abban, amit a rács véletlenül előállít.

További minták, amelyek beváltak:

• Sűríts, ne rejts el. Egy asztali esettanulmány-kártya mutathat főcímet, kétmondatos összefoglalót és eredményt. Mobilon a főcímet és az eredményt mutasd, az összefoglaló pedig egy koppintás mögé kerüljön. A személyre szabott jelzés (az iparág neve, az ügyfél logója) látható marad.
• Rövid vízszintes karusszelek a bizonyítékokhoz. Ha több ajánlást is perszonalizálsz, egy húzható sor kevesebb függőleges helyet foglal, mint egymás alá rakva. Néhány elemnél ne legyen több, és érintőképernyős eszközökön kapcsold ki az automatikus léptetést, mert ott ütközik a felhasználó saját húzásaival.
• A változatok szövegét már a forrásnál tartsd röviden. Egy asztali gépen két sorba férő főcím telefonon ötsorosra is tördelődhet. Minden szegmens változatát karakterkorláttal írd meg, és közzététel előtt nézd meg 375 pixeles szélességen.

CTA-k és űrlapok mobilon

Ha a termékedhez tartozik kísérőalkalmazás, a mobilos látogatókat egy telepítési CTA jobban kiszolgálhatja, mint egy demóűrlap. Az alkalmazás-landing page példáink megmutatják, hogyan kezelik a csapatok az áruházjelvényeket és az okos alkalmazásbannereket a webes konverzió elvesztése nélkül.

Rögzített CTA, szegmensenként személyre szabva

Telefonon a fő CTA gyorsan kigördül a látótérből. Egy keskeny, alul rögzített sáv elérhető közelségben tartja. A felirata könnyen személyre szabható, például:

• Azonosított nagyvállalati fiókok: „Beszélj a nagyvállalati csapattal”
• Kisebb cégek: „Csomagok és árak megtekintése”
• Visszatérő látogatók, akik megnézték az árazást: „Válassz demóidőpontot”

A sáv legyen elég kicsi, hogy ne takarjon el tartalmat, és ügyelj rá, hogy ne kerüljön a cookie-banner vagy egy chatwidget fölé. A CTA-szövegek szegmensekhez igazításáról bővebben az adatvezérelt személyre szabott CTA-k cikkünkben olvashatsz.

Rövidebb űrlapok, kevesebb kitöltendő mező

Telefonon lassú a gépelés, így minden mező többe kerül, mint asztali gépen. A lead capture űrlapról szóló útmutatónk amellett érvel, hogy csak azt kérdezd, amit nem tudsz utánanézni; mobilon ez az érv még erősebb.

• Legördülő listák helyett használj adatgazdagítást. Ha a cég azonosítva van, töltsd ki előre a cégnevet, a méretet és az iparágat, vagy hagyd el ezeket a mezőket. Az előre kitöltött céget egy „szerkesztés” linkkel mutasd, ahelyett hogy mindent megerősíttetnél a látogatóval.
• Állítsd be a megfelelő input típusokat. A type="email" és a type="tel" a megfelelő billentyűzetet hozza elő, az autocomplete attribútum (email, name, organization) pedig lehetővé teszi, hogy a telefon kitöltse a mentett adatokat.
• A másodlagos kérdéseket tedd későbbre. A telefonszámot vagy a projekt részleteit a köszönőoldalon vagy az időpontfoglalóban kérd, miután a fő konverzió már rögzült.

Mérd a hatást a saját forgalmadon. Hasonlítsd össze a mobilos munkamenetek űrlapkezdési és -kitöltési arányát előtte és utána, és nézd meg, változik-e a leadek minősége; az A/B teszt mintaméret útmutatónk mintaméret-ellenőrzése megmondja, mennyi ideig fog ez tartani.

Kattintással hívás azoknak a szegmenseknek, amelyek ezt szeretnék

Egy tel: link telefonon egyetlen koppintás. Nagyvállalati szegmenseknél, ahol a hívás szokásos következő lépés, egy „Hívd a nagyvállalati csapatunkat” gomb működhet. Önkiszolgáló szegmenseknél általában nem: egy kis cég vásárlója, aki ki akarja próbálni a terméket, valószínűleg nem vágyik értékesítési hívásra. Ez olyan eset, amikor a szegmensszabályok ugyanannyira megakadályozzák a rossz élményt, mint amennyire jót teremtenek.

Változatok tesztelése valódi eszközökön

Minden személyre szabott változatot ellenőrizz három szélességben az indulás előtt:

A DevTools eszközemulációja az elrendezéshez megfelel. Nem adja vissza a valódi érintéses viselkedést, a valódi betűmegjelenítést vagy egy középkategóriás telefon processzorát, ezért élesítés előtt minden variánst nyiss meg legalább egy fizikai telefonon. Ha a szegmensbe tartozás nélkül szeretnél megnézni egy variánst, használd a személyre szabási eszközöd előnézeti módját vagy egy URL-paramétert, amely kikényszeríti.

Mit kövess külön mobilon

• Görgetési mélység a személyre szabott oldalakon. Ha a mobilos látogatók többsége soha nem jut el a személyre szabott bizonyítékblokkig, vidd feljebb, vagy hagyd el mobilon.
• Űrlapkezdés és -befejezés eszközönként. Az alacsony kezdési arány az oldalra, az alacsony befejezési arány a mezőkre utal.
• Dühös és halott koppintások. A munkamenet-rögzítő eszközök jelzik az olyan elemekre leadott ismételt koppintásokat, amelyek nem csinálnak semmit; ez általában azt jelenti, hogy valami linknek látszik, pedig nem az.
• Eszközváltó visszatérés. Az azonosított cégek közül hányan térnek vissza asztali gépen egy héten belül egy mobilos látogatás után, és ott konvertálnak-e? Ha sokan, akkor a mobiloldalakat aszerint ítéld meg, hogy kiváltják-e ezt a visszatérő látogatást, ne csak a mobilos konverziók alapján.

Ahol a mobilos látogatások a legerősebb szándékot hordozzák

Események

A résztvevők az előadások között utánanéznek a beszállítóknak. Ha kiállítasz, ütemezz egy szabályt a rendezvény napjaira, amely a rendező város (vagy a résztvevői lista cégeinek) látogatóinak egy, a rendezvényre utaló hero-t mutat, linkkel a standnál történő megbeszélés foglalásához. A rendezvény utolsó napján távolítsd el. A rendezvényeken történő leadgyűjtésről szóló útmutatónk a követési oldalt is lefedi.

E-mail- és LinkedIn-kattintások

Nézd meg az e-mail-platformod eszközriportját: a legtöbb listánál a megnyitások és kattintások nagy része telefonon történik. Egy kampány-e-mailből érkező kattintás már elárulja, mi érdekelte a látogatót. Add át UTM-paraméterekben, és ezek alapján válaszd ki a változatot, hogy az oldal az e-mail témáját folytassa, ne egy általános kezdőlapon kezdje újra.

Az értékesítés által küldött linkek

Amikor egy értékesítő linket küld egy LinkedIn-üzenetben vagy egy követő e-mailben, az érdeklődő gyakran telefonon koppint rá. Adj az értékesítőknek követett linkeket (a fiókkal vagy kampánnyal a paraméterekben), amelyek egy, az értékesítő által tárgyalt témáról szóló oldalt nyitnak meg. Itt a legkönnyebb indokolni a fiókszintű személyre szabást, mert a kontextus egyértelmű.

Olvasás útközben

Aki vonaton olvas, az átfut, nem értékel. Egy „küldd el nekem ezt az esettanulmányt” opció, amely e-mailben elküldi a tartalmat, gyakran jobban illik ide, mint egy demóűrlap, és okot ad a follow-upra, amikor már újra az íróasztalnál ül.

Kéthetes kiindulópont

1. Kérd le a munkamenetek és konverziók eszköz szerinti megoszlását, összesítve és a személyre szabott szegmenseidre is.
2. Válaszd ki azt az egy oldalt, ahol ezekben a szegmensekben a legnagyobb a mobilos arány.
3. Ellenőrizd az oldal személyre szabott változatát valódi telefonon és lassított kapcsolaton. Először a villódzást és az elrendezést javítsd.
4. Adj hozzá szegmenst figyelembe vevő rögzített CTA-t, és szűkítsd a mobilos űrlapot azokra a mezőkre, amelyeket nem tudsz adatgazdagítással kitölteni.
5. Hasonlítsd össze a mobilos űrlapkezdéseket, -kitöltéseket és az eszközváltó visszatéréseket az előző időszakkal, majd döntsd el, kiterjeszted-e a módosításokat.

Ha olyan cégszintű jelzésre van szükséged, amely túléli a telefonról laptopra váltást, a Markettailor látogatóazonosítása bármelyik eszközön azonosítja a látogató céget, a szegmentálása pedig lehetővé teszi, hogy erre építve hozd létre a fenti mobilos szabályokat.