• Tanuljon SEO-t

Mobile-First Indexing: Mobilbarát weboldalak biztosítása: Útmutató a mobilbarát weboldalak biztosításához

  • Yoni Yampolsky
  • 6 min read
Mobile-First Indexing: Mobilbarát weboldalak biztosítása: Útmutató a mobilbarát weboldalak biztosításához

Intro

A mobil-első indexelés nem új téma a keresőoptimalizálás (SEO) és a weboldalfejlesztés világában. Valójában az Exploding Topics jelentése szerint a világ forgalmának több mint 55%-a mobileszközökről érkezik.

Ha vállalkozásának nincs mobilbarát weboldala, a potenciális ügyfelek valószínűleg pillanatok alatt leugranak az oldaláról.

A legjobb módja annak, hogy weboldala megjelenjen a Google keresőmotorok találati oldalain (SERP), a mobil-első indexelés elfogadása.

Ez a Google módszere a webhelyek rangsorolására a webhelyek tartalmának mobilverziója alapján.

Hogy segítsen a helyes útra terelni, ez az útmutató elmagyarázza, hogyan építheti be a mobil-első indexálást egy reszponzív weboldal kialakításával.

Ellenőrizze, hogy weboldala mobilbarát-e

A mobil-első indexelés során a keresőmotorok a weboldal mobil verzióját fogják feltérképezni és megjeleníteni, minden másnál előbbre helyezve azt. Ha webhelye nem mobilbarát, akkor alapértelmezés szerint az asztali verziója jelenik meg a mobilmegjelenítőkön.

A mobilfelhasználók pedig egy túlméretezett és nehezen kezelhető weboldalt kaphatnak okostelefonjukon vagy táblagépükön. Ez enyhén szólva sem ideális helyzet. Kihagyja a reszponzív dizájnt. És a webhelye nem alkalmazkodik a különböző képernyőméretekhez.

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Ezt a forgatókönyvet elkerülheti, ha ellenőrzi, hogy a honlapja már mobilbarát-e. A legjobb módja a Google PageSpeed Insights eszközének használata.

PageSpeed Insights (Kép forrása)

Ha csak beilleszti weboldalának URL-címét a keresősávba, valós idejű adatokat tekinthet meg arról, hogyan teljesít a mobileszközökön:

PageSpeed Insights results (Kép forrása)

Amint láthatja, kulcsfontosságú, hogy a mobilbarát weboldal pontszáma 90-100 között legyen. Ha azt tapasztalja, hogy webhelye nem mobilbarát, akkor itt az ideje, hogy a Google Search Console felé vegye az irányt.

Mobile Usability from Search Console (Kép forrása)

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Itt megtalálhatja a kúszási problémákat, a webhely sebességével kapcsolatos problémákat és egyéb hibákat, amelyek hátráltathatják a mobilos élményt.

Azonban a leggyakoribb mobilbarát problémák találsz benne, amikor cikkeket, Google Search Console:

  • Problémák az érintéses bevitellel (linkek és gombok) a mobilfelhasználók számára
  • Nem reagál a weboldal kialakítása, sablonja vagy témája
  • Nem mobilbarát felugró ablakok
  • Fura navigáció a weboldalon
  • Nehezen olvasható betűtípusok

Akár a semmiből építette weboldalát, akár egy tartalomkezelő rendszert (CMS), például a WordPress-t használja, nem szabad azt feltételeznie, hogy az oldala már mobilbarát.

A PageSpeed Insights és a Google Search Console áttekintést ad webhelye mobil teljesítményéről, így elvégezheti a szükséges fejlesztéseket a mobil képernyők számára.

Győződjön meg róla, hogy webhelye ugyanazt a felhasználói élményt nyújtja asztali és mobil eszközökön egyaránt.

A SEO-k és a fejlesztők gyakran kivágnak néhány webes funkciót a mobil weboldalakból a jó felhasználói élmény (UX) érdekében.

Végül is, soha nem jó ötlet, ha egy nehézkes, haszontalan elemekkel teli mobilweboldalunk van. A túl sok ilyen funkció kiiktatása azonban hatással lehet webhelye mobil-első indexelésére.

A Google biztosítani szeretné, hogy a fejlesztők ugyanazt a felhasználói élményt nyújtsák az asztali és a mobil felhasználóknak. Íme, mit mondtak konkrétan a témával kapcsolatban:

"Ha mobiloldala kevesebb tartalommal rendelkezik, mint asztali oldala, fontolja meg mobiloldala frissítését, hogy annak elsődleges tartalma megegyezzen az asztali oldaléval. Az Ön webhelyének szinte minden indexelése a mobil webhelyről származik."

Ez nagyon egyszerű.

Ha a mobil weboldalának verziója kevesebb tartalommal rendelkezik, akkor nem fog jól szerepelni a SERP-ken.

A keresőmotorok értékelik a tartalmat, mert csak így tudják megállapítani, hogy miről szól a webhely. Annak érdekében, hogy webhelye asztali és mobil verziója azonos legyen, itt van néhány kulcsfontosságú ajánlás, amelyet követnie kell:

  • Dolgozzon együtt az UX, SEO és fejlesztői csapatokkal, hogy a tartalom mobilbarát módon jelenjen meg ahelyett, hogy eltávolítaná a weboldal kulcsfontosságú elemeit.
  • A képeket, videókat és más nagyméretű tartalomfájlokat megfelelően kell optimalizálni a különböző mobileszközök, például táblagépek, okostelefonok és más intelligens eszközök alapján.
  • Tartsa az összes strukturált adatot, meta robotcímkét és technikai weboldaladatot univerzálisnak az összes IoT-eszközön.

Ne feledje, a mobil-első indexelés azt jelenti, hogy a keresőmotorok elsősorban a weboldal mobil verzióját fogják feltérképezni. Ha a mobilos webhelye éhezik a tartalomra, nem számít, hogy mennyire optimalizált az asztali webhelye.

Egyik sem fogja a keresett SEO-teljesítményt generálni.

Ismerje meg a különbséget a mobil használhatóság és a mobil-első indexelés között

A mobil-első indexelést és a mobil használhatóságot gyakran felváltva használják. Az igazság az, hogy ezek a kifejezések nem ugyanazok.

A mobil használhatóság a weboldal mobileszközökön nyújtott teljesítményét magyarázza. Amint azt már korábban elmagyaráztuk, a mobil-első indexelés az, hogy a Google előnyben részesíti a mobil weboldalak verzióinak feltérképezését az asztali verziókkal szemben.

Itt a figyelmeztetés.

Ha a webhelye nem mobilbarát, és rengeteg mobilhasználhatósági problémája van, a Google akkor is indexelheti, és indexelni is fogja. Tegyük fel például, hogy Ön egy éttermet üzemeltet, és az egyik étlapja egy PDF-fájl.

Természetesen a PDF-fájlok nehezen olvashatók és navigálhatók mobileszközökön. A Google azonban a mobil-első indexeléssel még mindig képes feltérképezni az információkat, ha van belőlük elég.

Végső soron az okostelefonos Googlebot automatikusan feltérképezi webhelyét, ha az elegendő tartalommal rendelkezik a mobil-első indexeléshez. Mégis, először meg kell oldania webhelye mobilhasználhatósági problémáit.

Gyorsítsa fel webhelye sebességét

Egy felhasználó átlagosan 54 másodpercet tölt el egy weboldalon.

Senkinek sincs ideje egész nap várni a weboldal betöltésére. Elvégre több milliárd más weboldal van, amelyeket néhány másodperc alatt elérhetnek.

Ezért a weboldal sebességének javítása alapvető fontosságú, nemcsak a mobilfelhasználók, hanem a SEO szempontjából is.

A lassú weboldal betöltési idő mind a tartózkodási időre, mind a visszafordulási arányra hatással van. Ezek olyan mérőszámok, amelyek megbecsülik, hogy az emberek mennyi ideig maradnak a weboldalán, vagy mennyi ideig hagyják el azt anélkül, hogy bármit is tennének.

Ha ez a weboldal lassúsága miatt történik, a Google észreveszi és visszaminősíti a weboldalát a SERP-ben. Ennek elkerülése érdekében webhelye sebességét webhelyaudit elvégzésével ellenőrizheti és nyomon követheti.

A Ranktracker segítségével átfogó webes auditot végezhet, hogy felmérje webhelye sebességét a mobileszközökön.

Optimalizálja weboldalát a lusta betöltő tartalomra

A lusta betöltődésű tartalom a legtöbb modern weboldalon mindennapos. A hírkiadványok ilyen típusú tartalmat használnak arra, hogy folyamatosan újabb és újabb történetekkel töltsék fel az oldalaikat, ahogy görgetünk lefelé.

A sporthíreket kiadó ClutchPoints lehetővé teszi a felhasználók számára, hogy a "További történetek" gombra kattintsanak, ha további híreket szeretnének olvasni bizonyos sportkategóriákban:

Lazy Loading content (Kép forrása)

A tartalom lusta betöltése mögött az az elv áll, hogy csak akkor jelenítsünk meg tartalmat, amikor a felhasználó kéri. Ez pedig növeli a webhely sebességét azáltal, hogy csökkenti a Google számára a feltérképezéshez szükséges felesleges kódsorokat.

Emellett az UX-nek is jót tesz, ha a mobilfelhasználók számára kevésbé tartalmasak a weboldal oldalai. A probléma azonban az, hogy a lusta betöltésű tartalmak indexelése kihívást jelenthet a keresőmotorok számára.

Visszatérve például a ClutchPoints-ra.

Természetesen a Google nem lesz képes indexelni a "További történetek" gombra kattintva előhívható történeteket, ha azok még nincsenek ott.

Ezt a problémát úgy tudja orvosolni, ha gondoskodik arról, hogy a webhelye lehetővé tegye a oldalankénti betöltést. Ez lehetővé teszi, hogy a keresőmotorok, mint például a Google, megjegyezzék webhelye teljes tartalmát, még akkor is, ha az végtelen görgetést használ, mint például a ClutchPoints.

Vigyázzon a nem megfelelő hirdetéselhelyezésre

Ha a Google Adsense-t használja, fontos, hogy ügyeljen arra, hogy a hirdetések hogyan jelennek meg a weboldal mobilverzióján.

A mobileszközökön az asztali számítógépen megszokott hirdetések helyett a reszponzív megjelenítésű hirdetések (RDA) jelennek meg.

Itt vannak például tipikus asztali hirdetések:

Watch out for improper ad placement (Kép forrása)

És íme, így néznének ki egy mobileszközön:

here's what they'd look like on a mobile device (Kép forrása)

Nem úszhatja meg az asztali kijelzős hirdetések mobilon történő újrafelhasználását. Íme néhány követendő legjobb gyakorlat a mobil RDA-k készítésekor:

  • Utasítsa a SEO-csapatot és a fejlesztőket, hogy CSS és HTML címkék segítségével igazítsák a hirdetéseket a különböző megjelenítési méretekhez.
  • A címsor és a szöveg legyen világos és rövid
  • Próbálja meg elkerülni a szöveg hozzáadását a képek fölé
  • Többféle méretű hirdetési képek létrehozása

Győződjön meg róla, hogy webhelye megfelel az ADA szabványnak

AzEgyesült Államokban 61 millió ember él fogyatékossággal. Az akadálymentesített weboldal azt jelenti, hogy a fogyatékossággal élő felhasználóknak, akik esetleg hallássérültek, színvakok, vagy más láthatatlan fogyatékossággal küzdenek, alkalmazkodniuk kell a fogyatékkal élőkhöz.

Minél több ember tud interakcióba lépni a weboldalával, annál valószínűbb, hogy maradnak és konvertálnak. Ez a koncepció óriási jelentőséggel bír a mobil-első indexálás szempontjából.

A weboldal hozzáférhetővé tétele minden felhasználó számára előnyös, nem csak a fogyatékkal élők számára. Jobb ügyfélélményt nyújtanak a mobilbarát weboldalak, amelyek egyszerűen használhatók, világos tartalmi struktúrával rendelkeznek, és alternatív szöveget adnak a képekhez, egyéb hozzáférhetőségi funkciók mellett.

A honlapok hozzáférhetőségére való törekvés az etikai szempontok mellett bölcs kereskedelmi döntés is. Lényeges felismerni a hozzáférhetőség biztosításának jogi következményeit. Például az amerikai vállalatokra hatással vannak az olyan jogszabályok, mint az amerikai fogyatékossággal élő személyekről szóló törvény (ADA), amelyek előírják, hogy honlapjaiknak a fizikai helyiségek tükrében átfogó élményt kell nyújtaniuk minden látogató számára.

Használhat egy ingyenes weboldal-hozzáférhetőség-ellenőrző programot, például az accessiBe-t, amely pontosan felméri a weboldal jelenlegi hozzáférhetőségi állapotát, és megállapítja, hogy az megfelel-e a hatályos előírásoknak.

website accessibility checker Kép forrása

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Más módon is elérhetőbbé teheti weboldalát:

  • Egységes színek használata a weboldalán. Ügyeljen arra, hogy ne használjon nagyon élénk, neon színeket, amelyek nehezen olvashatók.
  • Alternatív szöveg hozzáadása a képekhez a képernyőolvasót használó fogyatékkal élők számára.
  • Egyértelmű tartalmi struktúra alkalmazása, hogy a felhasználók gyorsan és könnyen megtalálják a fontos információkat.

Ha már alkalmazta ezeket a legjobb gyakorlatokat, ellenőrizze, hogy honlapja megfelel-e a The Americans with Disabilities Act (ADA) törvénynek. Ha az oldala átmenő pontszámot kap, akkor készen áll.

Access Scan (Kép forrása)

Egy akadálymentesített weboldal kifejlesztése garantálja, hogy minden ember elkötelezett, tájékozott és kész a konverzióra.

A legfontosabb tudnivalók

Összességében a mobil-első indexelés magasabb színvonalat állított fel a weboldalak megjelenésével és teljesítményével kapcsolatban az interneten. A keresőmotorokat mostantól elsősorban az érdekli, hogy a webhely hogyan szolgálja ki a mobilfelhasználókat.

Ha követi ezt az útmutatót, tisztább képet kaphat arról, hogyan kezelhet mobilbarát weboldalt, és hogyan fogadhat több mobilfelhasználót.

Yoni Yampolsky

Yoni Yampolsky

Marketing Manager, Elementor

is a Marketing Manager for Elementor. With more than 10 million active users, Elementor empowers just about anyone to create stunning WordPress websites, code-free. Elementor now offers best-in-class, built-in cloud hosting features. You can build and host your WordPress site in one, single platform.

Link: Elementor

Kezdje el használni a Ranktracker-t... Ingyen!

Tudja meg, hogy mi akadályozza a weboldalát a rangsorolásban.

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Different views of Ranktracker app