A legtöbb érdeklődő ma nem számítógépen találkozik először a vállalkozásával, hanem két perc várakozás közben, a telefonján. Ha ott nehéz olvasni a szöveget, nem egyértelmű, mivel foglalkozik, vagy elvész a kapcsolatfelvétel lehetősége, jó eséllyel tovább is lép. Ez az útmutató mobilbarát weboldal tervezéshez abban segít, hogy a honlap ne csak kisebb képernyőn is működjön, hanem valóban ügyfeleket tereljen a következő lépés felé.
A mobilbarát működés nem egy utólag bepipált technikai részlet. A tartalom sorrendjét, a gombok helyét, a képek használatát és a teljes oldal felépítését befolyásolja. Egy szolgáltató vállalkozásnál különösen sok múlik rajta: a látogatónak gyorsan el kell döntenie, jó helyen jár-e, és könnyűvé kell tenni számára a kapcsolatfelvételt.
Mitől mobilbarát egy üzleti weboldal?
A mobilbarát oldal nem egyszerűen „összenyomott” asztali weboldal. Telefonon a látogató függőlegesen görget, gyakran útközben használja az oldalt, és kevesebb türelme van a keresgéléshez. Emiatt a lényegnek hamar látszania kell.
Egy jól megtervezett kezdőképernyőn általában néhány másodpercen belül kiderül, kinek szól a szolgáltatás, milyen problémában segít, és hogyan lehet továbblépni. Ez lehet időpontkérés, ajánlatkérés, telefonhívás vagy egy rövid kapcsolatfelvételi űrlap. Nem kell minden információt az első képernyőre zsúfolni. Elég egy tiszta fő üzenet és egy egyértelmű gomb.
A jó mobilos élményhez hozzátartozik az olvasható betűméret, a megfelelő sortávolság, a kényelmesen megérinthető gombok és a gyors betöltődés is. Ha egy elemhez nagyítani kell, vagy a látogató véletlenül a rossz menüpontra nyom, az oldal ugyan technikailag lehet reszponzív, üzletileg mégsem működik jól.
Útmutató mobilbarát weboldal tervezéshez: a sorrend döntő
Mobilon nincs hely hosszú bevezetőkre és túl sok párhuzamos üzenetre. A látogató nem fogja végigolvasni az összes bemutatkozó mondatot, hogy kitalálja, mit kínál. A tartalmi sorrendnek kell elvégeznie ezt a munkát.
Érdemes az oldalt úgy felépíteni, hogy az első blokkok a legfontosabb kérdésekre válaszoljanak: mit nyújt a vállalkozás, kinek, milyen eredménnyel, és mi a következő lépés. Ezután jöhetnek a szolgáltatások részletei, a bizalomépítő elemek, például referenciák vagy vélemények, majd a gyakorlati információk.
Egy masszőrnél például a mobilos nyitóblokkban fontosabb lehet, hogy milyen kezelések érhetők el, hol található a rendelő, és hogyan lehet időpontot kérni, mint egy hosszú szakmai bemutatkozás. Egy B2B tanácsadónál viszont az első üzenetnek azt kell tisztáznia, milyen üzleti problémát old meg, és kiknek dolgozik. Nincs minden vállalkozásra érvényes, egyetlen jó sablon. A döntést az ügyfél útja alapján kell meghozni.
Kezdje az egyetlen fő céllal
Mielőtt látványról, színekről vagy menüpontokról döntene, nevezze meg az oldal elsődleges célját. Egy honlap lehet többfunkciós, de mobilon különösen fontos, hogy ne versenyezzen egymással öt különböző felhívás.
Ha az új ügyfelek telefonon kérnek időpontot, a hívás legyen könnyen elérhető. Ha ajánlatkérés a cél, ne rejtse el a kapcsolatfelvételi űrlapot több kattintás mögé. Ha egy szolgáltatás megértéséhez előbb tájékozódni kell, vezesse a látogatót egy rövid, jól strukturált szolgáltatásoldalra. A fő cél adja meg a gombok szövegét, a tartalom sorrendjét és a menü súlypontját is.
A navigáció legyen rövid és kiszámítható
Az asztali nézetben még elférő, hét-nyolc menüpontos navigáció telefonon hamar nehézkessé válik. A mobilmenü nem attól jó, hogy minden oldal belekerül, hanem attól, hogy a látogató gyorsan megtalálja, amit keres.
Kisebb vállalkozásoknál sokszor elég a Kezdőlap, Szolgáltatások, Rólam vagy Bemutatkozás, Referenciák és Kapcsolat felosztás. Ha több szolgáltatás van, a részletes aloldalak kerülhetnek egy közös Szolgáltatások pont alá. Így nem kell az egész kínálatot már a menüben feldolgoznia az érdeklődőnek.
A kapcsolatfelvétel ne csak a menü végén kapjon helyet. Egy jól látható, rövid feliratú gomb sokat segíthet, különösen akkor, ha az oldal célja az érdeklődők gyűjtése. A „Kérjen ajánlatot” vagy „Időpontot kérek” általában érthetőbb, mint az általános „Tovább” felirat. A gomb szövege mondja el, mi történik a kattintás után.
Szöveg, képek és gombok mobilnézetben
A mobilos olvasás ritmusa más. A hosszú, tömör bekezdések és a túl sok kiemelés fárasztóvá teszik az oldalt. Használjon rövid bekezdéseket, beszédes alcímeket és hétköznapi megfogalmazást. Egy szolgáltatói honlapnak nem kell szakzsargonnal bizonyítania a hozzáértést. A pontos, érthető információ sokkal inkább bizalmat kelt.
A képeknek is legyen feladatuk. Egy jó portré, egy igényes helyszínfotó vagy a munka folyamatát bemutató kép segíthet abban, hogy a látogató közelebb érezze magát a vállalkozáshoz. A túl nagy, csak dekorációs célt szolgáló képek viszont lassíthatják az oldalt, és mobilon értékes helyet foglalnak el.
A gomboknál a méret és a távolság is számít. Ujjal kell őket megérinteni, nem egérrel pontosan célba venni. Hagyjon elegendő helyet a kattintható elemek között, és ne helyezzen egymás mellé több azonos súlyú gombot. Ha a látogató azt látja, hogy „Ajánlatkérés”, „Hívás”, „Üzenet küldése” és „Részletek” egyszerre vár döntésre, könnyen elhalasztja azt.
Az űrlap ne legyen akadálypálya
A kapcsolatfelvételi űrlap célja nem az, hogy minden részletet előre begyűjtsön. Mobilon különösen igaz, hogy minél több mezőt kér, annál többen adják fel kitöltés közben.
Alapvetően elegendő lehet a név, az e-mail-cím vagy telefonszám, valamint egy üzenetmező. Ha a szolgáltatás miatt szükséges további információ, kérje be később, személyes egyeztetés során. Kivétel lehet például egy összetett projektajánlat, ahol néhány előzetes kérdés valóban segít a pontos válaszadásban. Ilyenkor is érdemes csak azokat az adatokat kérni, amelyek alapján érdemi első választ tud adni.
A sebesség nem technikai luxus
Egy lassú oldal a legjobb szöveget és dizájnt is rontja. A mobilhasználók gyakran gyengébb hálózaton érkeznek, ezért egy nagy méretű kép vagy felesleges animáció különösen sokba kerülhet. Nem feltétlenül látványosan, hanem elveszett érdeklődők formájában.
A gyorsaság érdekében a képeket megfelelő méretben és tömörítve érdemes feltölteni, kerülni kell a túl sok mozgó elemet, és át kell gondolni, valóban szükség van-e minden beépülő funkcióra. Egy automatikusan induló videó vagy egy látványos átmenet lehet szép asztali gépen, de ha lassítja az oldalt vagy zavarja az olvasást, akkor inkább hátráltatja az üzleti célt.
A kompromisszum itt egyszerű: nem a legtöbb effektet használó oldal a professzionális, hanem az, amelyik gyorsan, érthetően és megbízhatóan segíti a látogatót.
Ne csak nézze, használja is a mobilverziót
A tervezés végén ne elégedjen meg azzal, hogy a weboldal szerkesztői előnézetben jól néz ki. Vegye kézbe a saját telefonját, nyissa meg az oldalt, és menjen végig rajta úgy, mintha először találkozna a vállalkozással.
Figyelje meg, mennyi idő alatt derül ki, mit kínál. Keresse meg a szolgáltatások részleteit, próbálja ki a menüt, nyomja meg a gombokat, küldjön tesztüzenetet az űrlapon. Nézze meg azt is, hogyan jelenik meg az oldal kisebb és nagyobb kijelzőn. Ami egy modern, nagy telefonon kényelmes, nem biztos, hogy egy régebbi készüléken is ugyanúgy működik.
Hasznos, ha valaki más is kipróbálja az oldalt. Ön ismeri a saját szolgáltatását és a honlap logikáját, ezért könnyebben megtalál mindent. Egy külső szem viszont gyorsan jelzi, ha egy felirat félreérthető, egy gomb túl rejtett, vagy egy fontos információ túl későn jelenik meg.
A mobilbarát weboldal tervezése akkor jó befektetés, ha nem külön feladatként kezeli, hanem az egész weboldal alapjaként. Az Adaiformnál ezért már a tervezés elején a látogató útját, a tartalmi sorrendet és a kapcsolatfelvétel egyszerűségét nézzük. Egy jól működő honlap nem kér több figyelmet a látogatótól, mint amennyit feltétlenül muszáj. Inkább világosan megmutatja, miért érdemes Önnel kapcsolatba lépni.