Így javíthatod webhelyed mobilos verziójának teljesítményét

Hogyan javíthatsz a mobil SEO-n

Akárcsak az asztali SEO, a mobil SEO lényege is az, hogy webhelyed fellelhető és feltérképezhető legyen. E mellett persze kiváló teljesítményt kell kínáljon, remek tartalmakkal és pazar felhasználói élménnyel. Mindehhez tudnod kell, hogy webhelyed jelenleg hogyan teljesít, és hogy mit csinálnak rajta látogatóid.

Például: mobilon is ugyan azokkal a kulcsszavakkal találnak rád a keresők? Mire szeretnéd rávezetni a mobilos látogatókat? Nincs sok értelme a legközelebbi zöldségeshez vezető útvonalat mutogatni nekik, ha asztali gépről látogatnak meg – okostelefonon azonban már igazán hasznos lehet ez a funkció.

Mobilos SEO eszközök

Össze kell majd barátkoznod a Google Search Console felületével. A szolgáltatás rettentően hasznos eszközöket kínál, amelyek segítenek kideríteni, hogy webhelyed hogyan teljesít a keresőtalálatok között. Megnézheted például, hogy a mobilról és asztali számítógépekről kereső felhasználók milyen kulcsszavakat használnak kereséseikhez, amelyekkel rátalálnak webhelyedre. Ezeket a kulcsszavakat célzod meg tartalmaiddal? Érdemes lenne valami másra összpontosítani?

A Googlebotnak fel kell tudnia térképeznie a JavaScript, a CSS és a képfájlokat is, hogy megfelelően indexelhesse őket. A Google Search Console ehhez is kínál egy hasznos eszközt, mégpedig az URL-ellenőrzést. Az URL ellenőrzésével megtekintheted, hogy pontosan milyennek is látja webhelyedet a Googlebot. Ha például a képek elcsúsznak az előnézeten, akkor valószínűleg érdemes utánajárni a probléma forrásának.

A mobilos használhatóság eszköz

A Google Search Console egy olyan funkciót is kínál, ami kifejezetten webhelyed oldalainak mobilos használhatóságát elemzi ki neked. Segítségével könnyedén kiszűrheted azokat az oldalakat, amelyek nem felelnek meg a Google mobilos szabványainak, hogy kijavíthasd őket és mobil SEO-dat is.

Egyéb eszközök a mobil SEO-hoz

Szintén hasznos eszközöknek bizonyulhatnak még a Google Mobilbarát tesztje, Bővített találtok tesztje, a Google Analytics és a Lighthouse is.

Mobil SEO: Tervezz teljesítményre

A legfontosabb dolog, amire oda kell figyelned mobil SEO-d javítása közben, az a teljesítmény. A teljesítmény szinte kizárólag a webhely sebességétől függ. Logikus: minél gyorsabb a webhelyed, annál jobban élvezik majd használni látogatóid. Köztudott, hogy ha egy webhely nem jelenik meg néhány másodperc alatt, akkor látogatóid hamar feladják majd, és máshol nézelődnek tovább.

Ha mindez nem lenne elég, a webhelyek egyre nagyobbakká és összetettebbekké válnak az idő múlásával, tehát a teljesítmény biztosítása egy folyamatos feladat lesz majd. Egy webhely sosem lehet elég gyors – mindig van hová fejlődni. Ha azonban rendszeresen ellenőrzöd webhelyed teljesítményét, akkor időben rátalálhatsz a problémák forrására, és orvosolhatod azokat. Egy gyors webhellyel nem csak a Google-t, hanem látogatóidat is megnyered majd.

Dinamikus kiszolgálás

Webhelyed mobilos verziójának kialakításakor három opciód van. Használhatsz reszponzív designt, kínálhatod tartalmaidat dinamikusan, vagy egy külön aldomainre is elhelyezted őket.

Reszponzív kialakítás

A Google ezek közül a reszponzív design szereti a legjobban, ami ahhoz az eszközhöz alkalmazkodik, amelyikről épp megtekintik. Ennek a verziónak egyetlen forráskódja van, így könnyű frissíteni, karban tartani és módosítani. A Google szerint a reszponzív design használatával webhelyed alkalmassá válik, hogy bekerüljön a keresőmotorok mobil-első indexébe. Ne felejtsd el használni meta name=”viewport” kódrészletet webhelyed fejrészében, jelezvén ezzel a Google-nak, hogy webhelyed reszponzív designt használ.

Dinamikus kiszolgálás

A dinamikus kiszolgálás egy másik lehetséges megközelítés. Ez az opció szerveroldali technológiát használ, amellyel a webhely egy másik verzióját szolgálja fel a mobilhasználóknak, attól függően, hogy hogyan érik el a webhelyedet. Az URL ugyan az marad, de a szerver más fájlokat küld a böngészőnek. Ehhez a Vary címkét kell használni a fejrészben – a Google ebből látni fogja, hogy egy másik helyről kap majd mobilra optimalizált fájlokat.

Külön mobilos verzió

A harmadik lehetőség egy külön URL-re, általában egy m.domain-re helyezni webhelyed mobilos verzióját, ez esetben azonban a tartalom más különáll az asztali verzióétól. A Google ugyan elfogadja és támogatja ezt a módszert, de csak akkor, ha megfelelően összekötöd egymással a mobilos és az asztali verziókat. Ezeket a kapcsolatokat a rel=”canonical” és a rel=”alternate” címkékkel jelezheted a Google-nak. Fontos, hogy habár a mobilos és az asztali verziók külön tartalmakat kínálnak, a tartalmaknak egyezniük kell webhelyed mindkét verzióján. Éppen ezért ez a legkevésbé kényelmes módszer, ahol több a hibalehetőség.

A mobilos webhely sebességének javítása

A mobil SEO egyik legfontosabb része a webhely sebességének javítása. A Google PageSpeed Insights eszköze megmutatja, hogy milyen gyorsan töltődik be webhelyed egy-egy oldala okostelefonokon illetve asztali eszközökön. Az eszköz továbbá lehetséges módosításokat is felkínál, amelyekkel jó eséllyel javíthatnád webhelyed sebességét.

Érdemes használni a böngészők beépített fejlesztői eszközeit is, illetve szemmel tartani a Google Search Console felületén található Alapvető webes vitals-mutatók jelentést is. Ez a jelentés (hasonlóképpek a PageSpeed Insightshoz) három fő mutatót jelenít meg:

• Legnagyobb vizuális tartalomválasz (Largest Contentful Paint): A legnagyobb vizuális tartalomválasz akkor történik, mikor a lekért oldal legnagyobb eleme megjelenik a képernyőn. Ha ez az érték jó, akkor a felhasználók gyors betöltődést érzékelhetnek.
• Első interakciótól számított válaszkésés (Frist Input Delay): Az első interakciótól számított válaszkésés azt mutatja meg, hogy mennyi idő telik el az első felhasználói interakció és a böngésző által adott reakció között. Minél jobb ez az érték, annál gyorsabbnak érződik a webhely működése.
• Elrendezés összmozgása (Cumulative Layout Shift): Az elrendezés összmozgása azt méri, hogy mennyit mozognak az oldal elemei az oldal betöltődése közben. Ez alapján kiderítheted, hogy oldalad elemei „ugrálnak-e”, mikor még nem töltődött be minden, ami zavarhatja a felhasználókat.

Írd be az oldal URL címét, és a PageSpeed Insights két pontszámot is felkínál majd: az egyikkel webhelyed mobilos verziójának értékeli, a másikkal pedig az asztalit. Ezek a számok valószínűleg nem fognak egyezni egymással, de ha mindkettő elég nagy értéket mutat, akkor ez nem feltétlenül probléma. Az alacsony pirossal jelzett értékek súlyos problémákra utalnak, a sárga szín átlagos teljesítményt mutat, a zöldek pedig értelemszerűen a legjobb eredmények.

Érdemes lejjebb görgetni és megfogadni az eszköz tanácsait a sebesség javítására, hiszen ezekkel jelentősen javíthatsz pontszámodon, és persze a látogatóidnak nyújtott felhasználói élményen.

Persze nincs olyan, hogy valaki 0 pontot kapjon a lehetséges 100-ból, ugye? Nos, az igazság az, hogy előfordulhat. Egy mobilos webhely teljesítményét (és ezzel pontszámát) rengeteg tényező befolyásolhatja. Például rossz webtárhelyről osztják meg a webhelyet, nem túl stabil helyre telepítik a WordPresst, lassú beépülő modulokat telepítenek rá, optimalizálatlan képeket töltenek fel, és így tovább…

Még a legnagyobb cégek is érhetnek el rossz pontszámokat, ha elhanyagolják webhelyüket. Persze mindenre van megoldás, de jobb el sem jutni odáig, hogy megoldásokra legyen szükség.

Íme néhány tipp a webhely sebességének javításához:

• Használj kevesebb képet, illetve optimalizáld őket feltöltés előtt
• Használj stabil, minőségi webtárhelyet
• Frissítsd a PHP-det a 7-es verzióra
• Ellenőrizd átirányításaidat
• Ellenőrizd a leképezést (render) korlátozó tartalmakat a hajtás felett
• Adj prioritást a látható tartalmaknak
• Optimalizáld és minimalizáld CSS-edet, HTML-edet és JavaScriptedet
• Használj gyorsítótárat
• Használj tartalomelosztó rendszert (CDN)
• Töltsd be kevesebb eszközt (pl. JavaScript könyvtárat
• Tölts be kevesebb reklámszervert
• Javítsd a szerver válaszidejét

Ebben a lapszemlében néhány hasznos módszerről olvashatsz, amelyek kifejezetten a Google Core Web Vitals mutatókat segítenek feljavítani.

Fontold meg az AMP bevezetését

Az AMP (Accelerated Mobile Pages, azaz gyorsított mobiloldalak) egy, a Google által létrehozott, nyílt forráskódú projekt, aminek célja, hogy minél gyorsabban betöltődő mobilos oldalakat lehessen készíteni vele. Az AMP ma már nem számít újdonságnak, sokan mégis elhanyagolják.

Eredetileg csak statikus tartalmakhoz használták (pl. blogbejegyzésekhez vagy hírcikkekhez), amelyek nem igényeltek semmilyen interakciót a felhasználótól. E-kereskedelmi és más, dinamikus oldalakon azonban nem igazán lehetett alkalmazni. Szerencsére a fejlesztéseknek köszönhetően ma már ez sem okoz problémát az AMP-nak, és egyre több funkciót kínál majd.

Fontos megjegyezni, hogy nem minden webhelynél ésszerű AMP-ot használni, de azok, amelyeknek hasznos lehet, komoly előnyöket szerezhetnek vele.

Progresszív webes alkalmazások (PWA-k)

A progresszív webes alkalmazások újabb lehetőségeket kínálnak a mobilos felhasználók megcélzására. A PWA-k lényege, hogy minden felhasználónak és mindenféle eszközön működnek, összekötve ezzel a webes tartalmak és az mobilalkalmazások világát. A webes alkalmazás úgy működik, mint egy „hagyományos” applikáció, csak éppen nem az adott platform alkalmazás-áruházában kell beszerezni.

A progresszív webes alkalmazások a mobilos webhelyek sebességét kombinálják a mobilos alkalmazások funkcionalitásával. Ha megfelelően elkészítik, egy jó PWA használata közben egy felhasználó azt hiheti, hogy egy igazi mobilos alkalmazást használ.

A mai modern böngészők már számos feladatot képesek elvégezni a háttérben, miközben a felhasználónak mutatott tartalmakat valós időben frissíthetik. Ez egy remek alternatíva lehet számodra, ha szeretnél mobilalkalmazást készíteni céged számára, de nem férne bele a költségkeretedbe.

Kétségtelen, hogy a jövőben többször is hallhatsz majd a progresszív webes alkalmazásokról, és a hasonló, illetve kapcsolódó technológiákról, ezért érdemes már most elkezdeni ismerkedni velük!

Mobilos SEO útmutatónk utolsó számával a jövő héten jelentkezünk!

Írta: Mocsonoky Csaba | A cikk forrása eredetileg angol nyelven jelent meg a Yoast.com-on: https://yoast.com/mobile-seo-ultimate-guide/