9 tipp a mobilbarát weboldal létrehozásához

Ha elmulasztottad, a Google legfrissebb algoritmusa az ún. "Mobilegeddont" hozta létre, amely büntette azokat a weboldalakat, amelyek nem voltak mobilbarátok. Oké, kicsit túlzásba keveredhetek, de a Google április 21-én közzétette a frissítést, amely büntett minden olyan webhelyet, amelyen hiányoztak a mobilbarát oldalak, csökkentve a webhely rangsorolását a mobil keresési eredményekben. Ez a frissítés lehet, hogy nem volt annyira apokaliptikus, mint a becenevet hallgatólagosan, de ez még mindig valami, amit minden internetes marketingszakembernek, aki kezel egy weboldalt, tisztában kell lennie.

Mobilbarát weboldalak kereshetők a mobil előcsarnok asztali használatával

2014-től a mobil az elsődleges eszköznek számító mobiltelefonhoz jutott, mint az internethez való hozzáférés, ami azt jelenti, hogy az asztali számítógépeknek nem kellene többé az egyetlen gondolat, hogy webes tervezők és marketingesek legyenek a weboldal fejlesztésekor. A Google új algoritmusa arra ösztönzi a vállalkozásokat, hogy először a mobilra gondoljanak.

Azonban van egy tudáshatár, amikor mobilbarát weboldal létrehozására van szükség. Mit csinálsz először? Sajnos a mobil webes fejlesztési tér egy olyan komplexitási réteget vezet be, amely néhány üzleti csoport számára nehéz lehet. A mobilbarát weboldalak fejlesztése több, mint kereszt-böngésző; ez a cross-platformról szól. Az alábbi 9 tippet összegyűjtöttük, hogy segítséget nyújtsunk egy mobilbarát webhely létrehozásához.

9 tipp a weboldal könnyű hozzáférhetőségéről mobil eszközökön

Tipp # 1: Ne csináljon külön mobilbarát weboldalt

A múltban, amikor weboldalakat terveztünk a "mobil webre", kivágtuk a tartalmat, hogy mobil használatra alkalmassá válhassunk, és vitassuk meg, hogy mely részek alkalmasabbak a mobileszközökre. Azonban nem tudjuk ellenőrizni, hogy milyen tartalmat szeretnénk a felhasználók, és nem mondhatjuk, hogy a mobileszközök olyan alapvetően különböznek az asztali számítógépeinktől, hogy a mobilnak saját webterületet kell tartalmaznia.

Legutóbb, amikor ellenőriztem, csak egy Google van, és ha a Google már büntetett bennünket a sokszorosított tartalom miatt, akkor két weboldallal - egy mobiltelefonhoz és egyet asztali számítógépekhez - ugyanazt a tartalmat legyőzi a cél a Google keresőmotoraiban való megjelenés. Ezért nem szabad külön weblapot létrehoznia a mobilhoz.

Tip # 2: Használjon érzékeny designot

A felelősségteljes kialakítás lehetővé teszi a webhelyfejlesztők számára, hogy olyan webhelyet hozzanak létre, amely könnyen megtekinthető a különböző méretű eszközökön. Ez csökkenti a munkahelyi weboldalak fejlesztőinek az összegét, amikor egy weboldal létrehozására van szükség.

A rugalmas formatervezési megközelítés rugalmas elrendezéseket, rugalmas képeket és lépcsős stylesheet média lekérdezéseket használ. Ha egy weboldalon érzékeny tervezést használnak, a weboldal képes lesz felismerni a látogató képernyő méretét és tájolását, és ennek megfelelően megváltoztatni az elrendezést.

3. tipp: mindig tartalmazzon egy nézetablak metatagát

A nézetablak egy olyan virtuális terület, amelyet a böngésző a renderelőmotor segítségével meghatározza a tartalom méretének és méretének meghatározására. Ez az oka annak, hogy kritikus kódot jelent a multi-eszköz élmény létrehozásakor. Anélkül, hogy webhelye nem fog jól működni mobileszközön. Amit a nézetablak metacímkéje megmondja a böngészőnek, hogy az oldalnak illeszkednie kell a képernyőhöz. Számos konfiguráció létezik, amelyek segítségével a nézetablakot vezérelheti. Íme, amit a dokumentum fejlécében javasoltam (ezt csak egyszer kell megadni):

hogy a webhely mobilbarát legyen a nézetablak címkéjével

Tipp # 4: A betűméretek és a gombméret fontos

A betűméret és a gombméretek sokat jelentenek a mobileszközökön. A betűmérethez legalább 14 képpont legyen. Ez nagyszerűnek tűnhet, de ahelyett, hogy a felhasználók nagyítással bővítenék tartalmát, könnyebbé tennék számukra a betűméret módosítását a maximális olvashatóság érdekében. Az egyetlen alkalom, hogy kisebbnek, legkevesebb 12-esnek kell lennie, címkéken vagy formában van.

Ami a gombokat illeti, annál nagyobb a gomb, annál jobb - csökkenti annak esélyét, hogy a felhasználó el fogja hagyni, vagy hibásan nyomja meg a rossz gombot. Például az Apple tervezési irányelvei azt ajánlják, hogy a gomb méretének legalább 44 x 44 képpont legyen. Ezeknek az útmutatásoknak köszönhetően maximalizálhatja felhasználói élményét mobileszközén, és növelheti az e-kereskedelmi webhelyek konverzióit.

A gomb mérete fontos ahhoz, hogy a webhely mobilbarát legyen

Tipp # 5: Nagy felbontású képek használata

Ugyanúgy, mint az Instagram esetében, a hi-res képek rendkívül fontosak az Ön reagáló webhelyein, így biztosítva felhasználói élményét. Az iOS eszközök legfrissebb modelljei nagyfelbontású képernyőkkel rendelkeznek, amelyeknél a kép duplája az asztal felbontásának. A rendkívül nagy felbontású képek rendkívül nagy felbontású képeket fognak megakadályozni, hogy elkerüljék a pixeles, vagy akár homályos képeket, ha egy retina minőségű képernyőn nézzük.

Tipp # 6: Távolítsa el az alapértelmezett zoomot

Az automatikus zoom valóban elrontja az elrendezés elemeit, különösen a képek és a navigációs tartalom számára. Lehetnek kicsiek vagy túl nagyok az elrendezésben. Ennek orvoslására használja a nézetablak meta tagjét, hogy egyedi változókat állítson be a tartalomban. Győződjön meg arról, hogy ezt a címkét a head HTML-ben is tartalmazza.

Távolítsa el az alapértelmezett zoomot, hogy webhelyének mobilbarátja legyen

Tipp # 7: Használj YouTube-videókat a webhelyeden

Ha sok videót használ a webhelyén, a videó mobilon történő megtekintésének módja nagyon eltérő lehet, és néha nehéz lehet. A YouTube-videók használata olyan megoldás, amely megakadályozza a mobileszközökön megjelenő videók megtekintésének bármely nehézségét. Ennek oka, hogy a YouTube-ba ágyazott kód már érzékeny. Ez több lépést takarít meg abban, hogy a videók mobilbarátak legyenek.

Tipp # 8: Ne korlátozza a felhasználó mobil élményét

Nem számít, milyen szép a mobil weboldal, mindig tartalmazzon egy menjen a teljes webhelyre vagy az asztali verzió opciót a webhely alján. Vannak, akik még mindig jobban szeretik a teljes webhelyet, és ha igen, miért akadályozzák meg őket abban, hogy megtapasztalják? Különösen, ha ezt akarják. Az utolsó dolog, amit akarsz, elveszít egy potenciális új ügyfelet, csak mert megállította őket a teljes webhely megtapasztalásától.

Tipp # 9: Soha ne hagyja abba a tesztelést

Miután létrehozta a reagálható weboldalt, tesztelje, másodszor tesztelje, majd tesztelje újra. Nem csak azt gondolom, hogy "próbáld meg többször egy mobileszközön" próbáld ki az iPhone, az Android, a Windows telefon és a különböző tabletták tesztelését. Tesztelj minden oldalt, felhasználói műveletet, gombokat; és tesztelése közben mindig fontos, hogy a felhasználó helyzetébe álljon, vagy kérdezzen meg valakit, aki nem tervezte, hogy tesztelje az Ön számára.


Remélem, ezek a tippek segítséget nyújtanak ahhoz, hogy megtudhassuk, hogyan lehet a webhely mobilabbá tenni. Ha a 2015-ös év egyik legnagyobb digitális marketing trendje mobil, akkor nincs ok arra, hogy ne állítsd be vállalkozásodat a mobil sikerre.