A cyberbullying egy angol kifejezés, amit leginkább „kiberzaklatásként” lehetne lefordítani, habár nincs igazán magyar megfelelője. A magyarázatot tovább nehezíti, hogy még az angol nyelvben sincs konkrét, hivatalosan elfogadott definíció a „bullying” kif...
A kiváló mobilos felhasználói élmény 10 alapszabálya
Van mobilos webhelyed, igaz? Reszponzív kialakítású, vagy egy pluginnal oldod meg, hogy jól nézzen ki? De konvertál így egyáltalán? Mivel a mobilról internetezők száma drasztikusan megnőtt az elmúlt évek során, webhelyed mobilverziójának felhasználói élménye (röviden „mobil UX”) épp annyi figyelmet kell kapjon, mint amennyit az asztali verzió. Erre nem csak a felhasználók miatt van szükség, hanem azért is, mert a Google már a mobilos verziójuk alapján indexeli és értékeli a webhelyeket. Az alábbiakban 10 tippet olvashatsz arról, hogy hogyan kínálhatsz jobb felhasználói élményt webhelyed mobilos verzióján.
Fontos azonban, hogy mindenek előtt tisztázzunk valamit. Habár az alábbiakban említett pontok mind vonatkoznak táblagépekre is, a tippek kifejezetten a mobilos UX szemszögéből íródtak. 2020-ban azonban nem csak a telefonokat kell észben tartanod tartalmaid elkészítésekor, hiszen lehet, hogy valaki épp okosórájáról, vagy TV-jén olvassa majd őket!
1. Feladatalapú design
Mobilos webhelyed, illetve annak szerkezetének kialakításakor a felhasználó igényeit tartsd szem előtt, és persze a mobil seo-ról se feledkezz meg. Látogatód mobiltelefont használ. Lehet, hogy épp úton van valahová, és meg akar nézni valamit webhelyeden. Mi lehet az?
Derítsd ki, hogy miket csinálnak leggyakrabban a látogatók webhelyeden (ehhez nézd meg a google Analytics statisztikákat, gondolkodj el céged általános ügyfélköréről, vagy készíts részletes teszteket). Tudd meg, hogy mik a fő feladatok, tevékenységek mobilos webhelyeden.
Gerry McGovern feladatszakértő szerint a fő feladatok azt a néhány (általában kevesebb, mint 10, gyakran kevesebb, mint 5) feladatot jelentik, amelyek a legfontosabbak a felhasználóid számára. Ezek azok a feladatok, amiket gyorsan szeretnének tudni elvégezni webhelyeden. Optimalizáld tehát mobilos webhelyedet úgy, hogy látogatóid könnyedén és gyorsan elérhessék ezeket a feladatokat.
Az emberek okostelefonján temérdek alkalmazás található, amik jó részét rendszeresen használják. Éppen ezért egy mobileszközön a felhasználók talán nehezebben összpontosítanak majd webhelyedre. Persze a figyelemelterelő tényezők mindenütt jelen vannak, nem csak mobilokon. A cél tehát egyszerű, gyors lehetőségeket kínálni nekik feladataik elvégzésére, mielőtt egy másik alkalmazás elvonná a figyelmüket.
2. Kínálj egy letisztult menüt és egy keresőfunkciót
A mobilos felhasználói élmény egyik legfontosabb eleme a keresés. Lehetőséget kell biztosítanod felhasználóidnak, hogy bármikor azonnal keresést indíthassanak webhelyeden. A keresés funkciónak minden oldalon jelen kell lennie.
Habár a cél mindig az, hogy egyszerűen használható webhelyet kínálj látogatóidnak, mindig lesznek olyan elemek, amelyek nem passzolnak természetesen tartalmaidba. A kereséssel többek között ezeket az elemeket is elérhetik majd felhasználóid.
Ha ingatlanokkal foglalkozol, vagy ruhákat árulsz az interneten, akkor valószínűleg épp, hogy a keresés webhelyed legfontosabb funkciója. Ez esetben főleg fontos, hogy a keresés a tartalomban helyezkedjen el, illetve legyen elérhető egy gombnyomásra azokon az oldalakon, amelyeken nem tölt be főszerepet.
Egy fontos dolog a mobilos felhasználói élmény és a keresés kapcsolatáról: az csak egy dolog, hogy keresést kínálsz webhelyeden – az már egészen más kérdés, hogy a találatokat felsoroló oldalak is jól néznek-e ki. Elsődlegesen az eredmények relevancia szerint kell, hogy rendeződjenek a felhasználónak, és egyértelműen el is különöljenek egymástól.
3. Nem lesz szükség elválasztókra
Ha már az elkülönítésről van szó – ez nem jelenti azt, hogy mobilos webhelyeden mindenféle elválasztót kellene használnod. Ezek mind helyet foglalnak a képernyőn, ami rossz hatással lehet a felhasználói élményre.
Ehelyett inkább próbálj olyan stílust adni elemeidnek, hogy szemmel láthatóan különbözzenek egymástól – és ne legyen szükség elválasztókra. Használj kereteket, címsorokat, stb. Rengeteget tehetsz felhasználói élményedért anélkül, hogy felesleges elemekkel használnád fel a rendelkezésre álló helyet.
Na persze nem is tilos használni őket, de ügyelj rá, hogy elférjenek a helyükön és ne zavarják meg a látogatókat a feladataik elvégzésében.
4. Használj rövid űrlapokat
Akárcsak asztali webhelyed, úgy annak mobilos verziója is a konverziókra kell, hogy törekedjen. Ezek lehetnek termékeid értékesítései, vagy árajánlatkérések szolgáltatásaidra.
A hírleveledre való feliratkozás vagy egy kapcsolattartási űrlap kitöltése mind olyan feladatok, amelyek felhasználói beavatkozást igényelnek. Egy hatoldalas űrlap könnyedén tönkreteheti a felhasználói élményeket. Az emberek talán kitöltik majd, de ne számíts rá, hogy sokaknak lesz türelme hozzá.
Az ideális mobil UX érdekében a lehető legrövidebb űrlapokat kell felhasználóid elé raknod. Tüntess el belőlük mindent, amire nincs igazán szükséged. Ha például egy hírlevélről van szó, akkor elég csak egy email cím. Ha árajánlatról, akkor email cím és vezetéknél. A felhasználó vásárol? Akkor szállítási és számlázási cím (és legyen opció egy kattintással átmásolni a szállításit a számlázásiba, az egyszerűség kedvéért).
5. Fogd vissza magad
Meglehet, hogy webhelyeden jól mutatnak a különböző színek és hatalmas képek, de a mobilos verzión ezeket biztosan másképp látják majd az emberek. Kevesebb lesz a fókusz. Persze nem kell, hogy webhelyed csak fekete és fehér legyen, de egy fehér háttér, fekete betűkkel, illetve egy vagy két egymással jól működő színnel bőven elegendő az ideális mobilos felhasználói élményhez.
Fontos arra is ügyelned, hogy mobilos és asztali webhelyed tartalmai megegyezzenek egymással – tehát ugyan azt az élményt kínáld mobilon, mint amit asztali rendszereken is. Ez nem csak a tartalomra vonatkozik persze, hanem a designra is. Összességében ítéld meg úgy webhelyedet, ahogy a google is teszi: mobil-első hozzáállással. Ha most tervezed átalakítani webhelyedet, akkor kezdd a mobilos verzióval!
A visszafogottsághoz hozzátartozik a látványos animációk kiiktatása is. Minden nem létfontosságú javascript csak feleslegesen lassítja az oldal betöltését és működését, különösen régebbi, vagy gyengébb okostelefonokon.
6. Figyelj oda a gombok nyomható területére
Sajnos 2020-ban erre még mindig emlékeztetni kell jó néhány webhely tulajdonosát. A mobilos webhelyeket többnyire ujjakkal szokás böngészni és használni, és a gombok gyakran túl kicsik ahhoz, hogy könnyedén meg lehessen nyomni őket. A Google egyik cikkében bővebben is olvashatsz erről. Valójában minden koppintható elemre vonatkozik, hogy könnyedén lenyomhatók kell legyenek.
A fent említett Google cikkben a következő olvasható:
„A minimum ajánlott érintési célpont mérete nagyjából 48 eszközfüggetlen képpont egy megfelelően beállított mobilos viewporttal rendelkező webhelyen. Például habár egy ikonnak talán csak 24 képpontos a szélessége és a magassága, a maradék helyet is kihasználhatod arra, hogy az érintési célpont méretét 48 képpontosra bővítsd. A 48x48 képpontos terület nagyjából 9mm-t jelent, ami egy átlagos személy ujjbegyének a mérete.”
7. Ne használj túl sok betűméretet
A tipográfia jelentősen befolyásolja egy mobilos webhely felhasználói élményét. Nem csak a választott betűkészletek fontosak, hanem a szövegek, feliratok méretére is oda kell figyelned. Továbbá nem használhatod ugyan azokat a betűméreteket mobilon, mint amiket webhelyed asztali verzióján, ennek pedig két oka van:
- A mobiloknak apró kijelzőjük van a monitorokhoz, laptopokhoz képest. Nem ideális, ha a cím az egész oldalt kitölti – a cikk szövege már az első képernyőn el kell kezdődjön, hogy ne kelljen lejjebb görgetni az első sorokért. Persze a főszöveg betűtípusa sem szabad, hogy túl kicsi legyen, különben a felhasználóknak nagyítaniuk kell majd az oldalon, hogy el tudják olvasni.
- Ha több, mint három betűméretet használsz, azzal csak felfordulást okozol majd oldalaidon. A méretbeli különbségek sokkal láthatóbbak lesznek, mint az asztali kijelzőkön, ezért legfeljebb kettő (talán három) különböző méretet használj csupán.
A Google Mobilbarát tesztje a betűméreteket is figyelembe veszi, habár csak a főszöveget vizsgálja ilyen szempontból.
8. Optimalizálj sebességre
A mobilos felhasználói élmény másik nagyon fontos tényezője a sebesség. Egy weboldal sebességét többféle eszközzel (pl. Google PageSpeed Insights) is lemérheted.
Webhelyed sebességét számos módszerrel javíthatod. Az első magától értetődő: optimalizáld képeidet. Legalább annyira ügyelj, hogy képeid fájlméretét egy erre alkalmas eszközzel (Sqoosh, TinyPNG, stb.) lecsökkentsd, mielőtt feltöltenéd őket webhelyedre.
Továbbá összevonhatod és „minifikálhatod” css és javascript fájljaidat, amikre szükség van oldalaid működéséhez. Minél gyorsabban tölti be ezeket az elemeket egy böngésző, annál gyorsabbnak tűnik majd oldalad működése, ami javítja a felhasználói élményt. Na persze sosem árt, ha minőségi webtárhelyet használsz.
A webhelysebesség egy felkapott téma a Google portáján. A keresőóriás nemrégiben bejelentette az új „alapvető webes vitals-mutatókat”, amelyek segítségével a Google megállapíthatja majd, hogy egy-egy oldal milyen élményeket nyújt a felhasználóknak. 2021-től ezek a mutatók a mobilos webhelyek értékelésében és rangsorolásában is megjelennek majd.
Persze a sebesség csak egy ilyen élményfaktor a sok közül – bővebben itt olvashatsz az új alapvető webes vitals-mutatókról.
9. Ne vidd túlzásba a hirdetéseket
Sok webhely hirdetésekből tartja fenn magát, ami manapság egy teljesen elfogadott szokás. Azonban nem éri meg átesni a ló túloldalára, és elijeszteni a felhasználókat mindenféle felugró ablakkal és hasonló reklámmal. Bizonyára te sem várod el komolyan, hogy egy látogató rögtön feliratkozzon hírleveledre, amikor még csak először jár webhelyeden, és talán semmit sem tud márkádról.
Ügyelj továbbá arra is, hogy a dolgok megfelelően megjelenjenek, mielőtt betöltenéd hirdetéseidet és CTA-idat. Azonban még ezek is legyenek visszafogottak, nem pedig tolakodók. Ha egy szilárd kapcsolatot szeretnél kialakítani az látogatókkal, akkor ebben nem sokat segít majd, ha folyamatosan önreklámokkal bombázod, valahányszor új oldalra lép át webhelyeden (vagy amikor először megérkezik oda).
Mindez nem csak rossz felhasználói élményt eredményez, hanem még a Google is rossz szemmel nézi.
10. Rendszeresen teszteld webhelyed mobilos felhasználói élményét
Ha reszponzív webhelyet kínálsz látogatóidnak (ami manapság már egyébként is alapfeltétel), akkor biztosítanod kell, hogy minden változtatást letesztelsz a mobilos ész az asztali verzión is. A trendek változnak, a seo algoritmusok fejlődnek, és a felhasználói igények is átalakulnak időnként. Igyekezz lépést tartani ezekkel, és ne felejtsd el rendszeresen tesztelni webhelyedet minden népszerűbb platformon!
Írta: Mocsonoky Csaba | A cikk forrása eredetileg angol nyelven jelent meg a Yoast.com-on: https://yoast.com/improve-mobile-ux/
