AMP-kompatibilis honlap létrehozása

A Google nemrég kezdte hivatalosan tesztelni a telefont előtérbe helyező rangsorolását, vagyis egy honlap esetében először azt veszik figyelembe, hogy hogy teljesít a telefonos megjelenítésben. Épp ezért ez a legjobb alkalom, hogy oldalunkat AMP-kompatibilis, vagyis gyorsított mobil honlappá tegyük!

Mi az AMP?

Az AMP (Accelerated Mobil Page) vagy gyorsított mobil honlap egy nyílt forráskódú, HTML-alapú rendszer, ami lehetővé teszi, hogy azok az oldalak, amik nagyméretű tartalmat, például videókat, hirdetéseket jelenítenek meg, azonnal betöltődjenek telefonos böngészéskor is.

Az AMP tulajdonképpen az asztali számítógépre optimalizált honlap, annak minden tartalmával, de a zavaró többlet nélkül, így a felhasználó azonnal látja a tartalmat okostelefonon, nem kell hosszú másodperceket várnia.

Miért fontos, hogy az oldal AMP-kompatibilis legyen?

Ha gyorsabban töltődik az oldal, a felhasználó számára is kényelmesebb a böngészés, nagyobb eséllyel marad az oldalon és néz körül. Ez a viselkedés a Google helyezések esetében is előnyös.

Bár az AMP szigorúan véve nem tartozik azon értékek közé, amiket a Google a rangsorolásban figyelembe vesz, de az oldalon eltöltött idő miatt fontos, indirekt tényezővé válik. Ez persze nem jelenti azt, hogy az oldalunk tartalma nem lényeges, de a felhasználók számára kiemelt jelentőségű lehet, ami az eredményeken is megmutatkozik. Emellett egy adott keresésben a találatok között az AMP tartalmak elsőbbséget élveznek, és a találati lista elején jelennek meg.

Hogyan fejlesszük AMP-vé a honlapunkat?

Aki már próbált reszponzív honlapot létrehozni, az tudja, hogy gyakran idegőrlő folyamat egy honlap megújítása, a jó hír viszont, hogy az AMP-kompatibilis honlap felépítése nagyon egyszerű.

1. lépés: Telepítsük az AMP plugint

Az Automattic által kínált AMP plugin nagyon megkönnyíti a dolgunkat. Miután aktiváltuk, a plugin minden honlapunkat AMP-kompatibilissé teszi, azáltal, hogy hozzáadja a /amp/ kiegészítést az URL-hez, vagyis az eredeti cikkekhez canonical taget társít, ami megmutatja a keresőknek, hogy melyik elérési utat tekintsék elsődlegesnek.

Ellenőrizhetjük, hogy sikeres volt-e a folyamat, ha odaírjuk az amp/ kifejezést valamelyik URL után.

2. lépés: Telepítsük a YoastGlueplugint

Az oldalunk már gyorsan töltődik be, de jobb lenne, ha a megjelenítés is olyan lenne, mint az asztali számítógépre optimalizált verzió a jelenlegi fekete-fehér helyett, nem?

Erre is van plugin. A YoastGlue kiegészítés ingyenes és könnyen kezelhető, lehetővé teszi, hogy integráljuk a meta-adatokat az AMP oldalakba, sőt akár a megjelenített oldal színeit is egyénileg változtathatjuk, hogy jobban harmonizáljon a honlapunk színpalettájához.

Miután telepítettük a plugint, kattintsunk a SEO-menüre a WordPress vezérlőfelületen és válasszuk ki az AMP opciót. Ezután kattintsunk a Design-menüpontra, ahol kiválaszthatjuk a választott színsémát és egyéni ikont adhatunk az oldalhoz, illetve beállíthatjuk a hivatkozások megjelenítését és a hyperlinkeket.

AMP-kompatibilis

Fontos kiemelni, hogy amennyiben már telepítettünk kiegészítést a rendszerünkbe, lehetséges, hogy a Yoast nem fog tökéletesen működni, ilyenkor érdemes a másik kiegészítést törölni.

Miután végeztünk a változtatásokkal, lesz egy AMP és egy alapértelmezett honlapunk. Az AMP verzió csak azt mutatja, amire a felhasználónak szüksége van, a konkrét szöveges és média tartalmat, míg a böngészőben megjeleníthető verzió tartalmazza a hirdetéseket.

3. lépés: Ellenőrizzük az AMP-oldalakat a SearchConsole-ban

Miután AMP-kompatibilissé tettük az oldalunkat, ideje megnézni, hogy a Google számára is így jelenik-e meg.

Lépjünk be a Google SearchConsole-ba és kattintsunk a SearchAppearance-re, majd az Accelerated Mobile Pages funkcióra. Itt megnézhetjük, hogy az AMP-oldalaink hogy rangsorolódnak és javíthatjuk az esetleges hibákat. Ezek a hibák a grafikon alatt jelennek meg, elég csak a nem megfelelő forgalomhoz klikkelni. A hiba lehet egy másik kiegészítés vagy kód, oldjuk meg a problémát és ellenőrizzük újra az oldalt.

Összegzés

Kész is az AMP-honlap! Ha nem WordPresst használunk, érdemes átböngészni az Accelerated Mobile Pages Project honlapját, ahol útmutatót találunk az AMP telepítéséhez. A folyamat valamivel bonyolultabb, de mindenképpen megéri!

Közzététel dátuma: