Van egy 51,92% -os esélye, hogy elolvassa ezt a cikket egy mobil webhelyen. Ha egy okostelefonon (vagy akár egy táblagépen) találkozol az olvasás ezen időpontjában, akkor kevéssé kell meggyőzni róla, hogy az érzékeny webes tervezés kritikus fontosságú bármely webhely sikeréhez vagy meghibásodásához.
Jelenleg 2,6 milliárd okostelefon-felhasználó van a világon – az egész népesség több mint egyharmada.
A szakértők arra számítanak, hogy ez az arány tovább nő az elkövetkező öt évben, mivel az okostelefonok egyre inkább megfizethetők és széles körben elterjedtek. Nem csoda, hogy a keresőmotorok, mint a Google, mobil-első megközelítést alkalmaznak az új tartalom indexelése és rangsorolása során. Bármely fejlesztő vagy webmester tudja, hogy ez nagyon nagy ügy.
Ha egy webhelyet futtat, és még nem érkezett mobilra, akkor itt talál néhány olyan érzékeny webes tervezési tippet, amelyet fontolóra vehet:
1. Gyakorolja a minimalizmust
Az első dolog, amit az embereknek meg kell érteniük a mobilról, a korlátozott ingatlan. Ellentétben az asztali számítógépekkel vagy laptopokkal, amelyek 13-15 hüvelyknyi képernyőteret biztosítanak (néha még ennél is többet), az okostelefonok többsége alig nagyobb, mint egy normál méretű tenyér. A webes tervezők és az oldalvezetők számára ez alapvető problémát jelent: hogyan lehet egy teljes, felhasználóbarát webhelyet létrehozni, anélkül, hogy veszélyeztetné a funkcionalitást.
A kérdésre adott válasz a minimalizmus.
A minimalizmus egy olyan tervezési filozófia, amelyet legjobban az Antoine de Saint-Exupery kései nagy francia író ír le: "A tökéletességet nem akkor érik el, ha nincs több hozzáadva, de ha nincs más, amit el kell vinni.
Mobil weboldal tervezésénél kezdj el. Távolítsa el az oldalelemeket egyenként, amíg nem marad más, ami eltávolítható.
Ha a gyakorlást követően még több hely marad (ami őszinte, általában nincs), lassan hozzá kell adni az elemeket a fontossági sorrendbe. Ezzel biztosítja, hogy a korlátozott helyet a lehető legteljesebb mértékben használják fel, így a látogatók számára mindent elengedhetnek, anélkül, hogy túlzsúfolták a képernyőjüket.
2. Tartalom Első
A mobiltelefonnal kapcsolatos tartalom tervezése egy kicsit trükkös. A korlátozott téren kívül a képernyőforgatás, a készülék kompatibilitása, a nagyítás, valamint a számtalan más probléma is jelentéktelen. Mindezek a tényezők nehezebbé teszik a tartalmat.
Az első ponttól való kiemeléshez elsőbbséget kell adnia. Ha olyan idegen elemek vannak, amelyek elvonják a látogató tartalmát, távolítsa el őket. Ezek általában asztalok, oldalsávok, lebegtethető elemek és hasonlók. Ne is gondolkodj kétszer.
A tartalomra és a tartalom tervezésére összpontosítva, mielőtt bármi mást eredményezne, jobb mobil élményt nyújt, és gyakrabban vezet magasabb konverziókhoz.
Ideális esetben, amikor a látogatók böngészik a mobil tartalmat, minden mást (például navigációs sávokat, kezdőbetűket, menüket stb.) El kell hagyni.
3. Nagyítás Fontos Érintési pontok
Ne feledje, az első iPhone? Az innováció olyan nagyszerű volt, mint a gépelés, rendkívül frusztráló volt, szinte ugyanúgy, mint a tű beillesztése.
Az okostelefonok és a mobil weboldalak már hosszú utat tettek meg. Manapság a telefonba írva a második természet – a billentyűzetek jobban illeszkednek, a gombok nagyobbak, és az általános gépelési élmény sokkal, sokkal jobb.
Sajnos, sok weboldal még mindig elmaradott, a gombok és az ellenőrzések, amelyek a mobiltelefon előtti korszakhoz tartoznak. Mindezek rossz felhasználói élményt eredményeznek, amely rövid webhelyes munkameneteket, gyenge elkötelezettséget és sok ugrást eredményez.
A megoldás legegyszerűbb módja, ha a gombokat könnyebben kattinthatóvá teheti – pl. elég nagy ahhoz, hogy befogadja a hüvelykujját, körülbelül 48 x 48 dp. Szintén helyezze a szöveget a gombokba az egyszerű azonosítás érdekében.
Ez kicsi, jelentéktelen változásnak tűnhet, de drámai módon növelheti a konverziós arányt.
Ha problémái vannak a webhely konfigurálásával kapcsolatban, érdemes felvennie a kapcsolatot egy mobil design szakértővel, például a Vardot-tel.
4. Gyorsított mobil oldalak
A KissMetrics szerint csak három másodperc alatt tölthet be egy oldalt, mielőtt a látogatók többsége visszafordulna. Ha még nem vagy az AMP-nél, megölheted a SEO-t és elveszítheted a potenciális ügyfeleket.
Mi az Accelerated Mobile Pages (AMP)?
Az AMP egy nyílt forráskódú webes programozási nyelv, amelynek célja a statikus tartalmak azonnali átadása mobileszközökön, például okostelefonokon és táblagépeken. Ez egy egyszerű, lecsupaszított HTML-verzió, amely kifejezetten a statikus (olvasható: nem interaktív) weboldalak felgyorsítására szolgál mobileszközökön.
Az AMP-vel gyors szállítás érhető el, de bizonyos funkciókat feláldoz. Íme néhány hátrány:
- A JavaScript korlátozott az AMP könyvtáron kívül
- A képek betöltődnek, amikor lefelé görgetjük őket (lusta betöltési funkció)
- A CSS-t egyszerűsíteni kell
A hátrányok ellenére az AMP nagyszerű módja az UX (felhasználói élmény) javításának és a SEO növelésének. Fontos megjegyezni, hogy a Google elhúzta az AMP-oldalak azonosítását és népszerűsítését.
5. Alkalmazza a játékot
Egy lépéssel tovább kívánja vinni a mobil design-t? Kiegészítse webhelyét saját mobilalkalmazásával.
A mobilalkalmazások sokkal rugalmasabban nyújtanak mobilitást. Ráadásul kimutatták, hogy nagyobb konverziót, jobb sebességet, alacsonyabb visszafordulási arányt és megnövekedett megtakarítást eredményez.
Gondolj egy alkalmazásra, mint saját kisvilágodra – nemcsak a megfelelőnek ítélheti meg, hanem az értesítőkkel és figyelmeztetésekkel is foglalkozhat, illetve testreszabhatja és hozzáadhat további funkciókat, valamint kizárólagos in-app promóciókat kínálhat többek között dolgokat. Valóban nincsen korlátozás a dolgokra, amit tehetsz.
Csak tisztázni, ez nem egy vagy sem. Az alkalmazás valójában egy nagyszerű kiegészítő a mobil webhelyen és vise versa. Kihasználva mindkettőt, több forgalmat generálhat, többcsatornás értékesítési és konverziós csatornákat hozhat létre, és több ember számára is gondoskodhat.
6. Szociálisítsd a felhasználókkal
Az emberek manapság gyakorlatilag a társadalmi fiókjukon keresztül élnek, és a legtöbbjük ezeket a számlákat mobileszközökön keresztül érheti el. A jelentések azt mutatják, hogy mindennap közel két órát töltenek a közösségi médiában, és a szociális média idő 80% -át mobilon érik el.
Mondanom sem kell, hogy ha nem optimalizálja a közösségi médiát a mobil webhelyén, akkor esetleg hiányozhat a lehetséges forgalomról és a konverziókról.
A közösségi média hatékony eszköz a személyes kapcsolatok létrehozásához. Ha megengedjük, hogy a webhely látogatói szociálisan elérhessék Önt, akkor képesek lesznek megnyitni az elkötelezettség és az interakció lehetőségeit, amelyek remélhetőleg elősegítik a márkahűséget és javítják a lényegét.
Helyezzen szociális média gombokat és kütyüket az oldalai kiemelt területein, hogy a felhasználók tetszeni tudjanak, oszthassanak meg, kommentálhassanak és egyéb módon vegyenek részt a tartalmukon. Ideális esetben a nagyokat, mint például a Facebook, az Instagram, a Twitter, a Google+ és a LinkedIn is szeretné bevonni.
7. Teszt, teszt, teszt
A mobil első megközelítés nem hagyja abba a webhely vagy alkalmazás építését. Gyakran szükség van rendszeres módosításra, csípésre, felülvizsgálatra, felülvizsgálatra, elemzésre és optimalizálásra.
… ami teszteléshez vezet.
Milyen jobb módja annak, hogy javítsuk, amit már megvan, mint teszteléssel. Hajtsa fel KPI-jét és elemzőit, hogy megnézze, hol javíthatja. Van-e olyan oldal, amely rosszul alakul? Vannak olyan elemek, amelyek miatt a felhasználók elhagyják az oldalakat? Lassú a mobil webhelyed?
A legjobb módja ennek az A / B tesztelés (vagyis egy elem egyszerre történő tesztelése, miközben az összes többi tényező állandó). Az összehasonlítások olyan ártalmatlanok lehetnek, mint a gombok színe vagy a CTA belsejében található szöveg. Meg fogsz lepődni, hogy az egyszerű változások milyen hatalmas eredményekhez vezethetnek.
Nem tudod, hogyan kell ezt csinálni? Több száz olyan eszköz használható, amelyek az oldal sebességétől a konverzióig gyakorlatilag minden mást tartalmaznak. Olvassa el a 7 legfontosabb eszközt a mobil weboldal teszteléséhez.
Íme egy átfogóbb részlet az A / B tesztelésre, ha érdekel. Az egész dolog egy hosszú iteratív folyamat, de az, amelyik megéri a nyereséget.
Összefoglalás
Világos, hogy a nap az internet jövője. Ha van egy webhelyed, vagy futsz, akkor egy érzékeny webes megoldás abszolút szükséges – ez elkerülhetetlen igazság az interneten mindenki előtt.
Készen áll arra, hogy webhelyét mobilra fejlessze? Kövesse a fenti tippeket, és jó lesz az utat!
Kérjen tanácsot? Együttműködhessen mobilon egy megbízható webfejlesztővel.
Kommentek