Mit értünk a gyorsított mobiloldalak, azaz AMP alatt?
Az Accelerated Mobil Pages (AMP) vagy gyorsított mobiloldalak egy nyílt forráskódú keretrendszer, melynek célja a mobilwebhelyek betöltési sebességének gyorsítása. Alábbiakban bemutatjuk, mit jelent az AMP, miért és hogyan alakult ki, hogyan működik, illetve azt, hogy milyen előnyökkel jár.
Mi az AMP?
Egy nyílt forráskódú keretrendszer, amely a Google és több más technológiai cég közös kezdeményezéseként jött létre. Az AMP segítségével szinte azonnal betöltődő mobilwebhelyek hozhatók létre. Az AMP jellegzetessége a JavaScript és CSS elemek csökkentett száma és a Content Delivery Network (kb. tartalomelosztó hálózat) használata.
Miért fontos?
Az okostelefon szerepe az internetelérésben évről évre növekszik, a számítógépé pedig évről évre csökken. Vagyis egyre inkább telefon segítségével keresnek az emberek termékeket, szolgáltatásokat, illetve vásárolnak, olvasnak, mint számítógépen keresztül. A mobilfelhasználók számára pedig különösen fontos, hogy a webhelyek gyorsan betöltődjenek. A kritikus határérték kb. három másodpercnél van. Ha egy webhely betöltése ennél tovább tart, akkor a mobilos felhasználók többsége „lepattan”, vagyis elhagyja az oldalt. Tehát a céloldal betöltési sebessége döntő tényező abban, hogy a látogató konverzióra lép-e a webhelyen.
Az AMP-t használó honlapok tehát versenyelőnyben vannak az AMP-t nem használó oldalakkal szemben. A gyors letöltési sebesség nemcsak a felhasználók érdekeit szolgálja, hanem a tartalomközlők, hirdetők számára is előnyös.
Mikor és hogyan alakult ki?
Az AMP projektet 2015-ben indította útjára a Google, a WordPress és az Adobe, de kezdettől fogva több nemzetközi hírportál is részt vesz benne. Első felhasználói között található a Guardian, The Washington Post, Buzzfeed, Frankfurter Allgemeine Zeitung, Die Zeit, és az El Pais (Spanyolország). A Twitter és a LinkedIn szintén kezdettől fogva részt vesz a projektben.
Ma már szinte az összes nagy online média platform AMP technológiát használ, mert a gyorsan, gördülékenyen betöltő mobilwebhelyek hatalmas értéket képviselnek. A WordPress kínál beépített AMP-t, ugyanakkor kereskedelmi változatban egyelőre még nem érhető el a keretrendszer.
Probléma: Web… helyek…, amelyek… túl… lassan… töltődnek… be
A netes tartalmak betöltésének gyorsasága az internetkapcsolat sebességétől és a webhely méretétől is függ. Egyes oldalak lassan töltődnek be, mert hiába gyors a netkapcsolat, ha a letöltendő fájlok mennyisége túl nagy, a honlap lassú lesz. Ugyanakkor egy műszakilag megfelelően optimalizált oldal is lassan töltődik be, ha a netkapcsolat amúgy lassú.
Megoldás: AMP
Mivel az internet elérés sebessége adott, vagyis az fejlesztői oldalról nem gyorsítható, az AMP a webhelyek technikai részleteire összpontosít. Az AMP lényege a betöltendő fájlok számának és mennyiségének csökkentésében, vagyis a szükséges JavaScript és CSS elemek számnak korlátozásában rejlik. Így kevesebb erőforrás is elég adott oldal gyors letöltéshez. Ráadásul a rendszer a Google AMP gyorsítótárból szolgálja ki az AMP oldalakat, ami szintén jó hatással van a sebességre.
Az AMP forráskód
Mivel az AMP forráskód jól ismert szkripteken alapul, az összes szerver képes ezeket az oldalakat kiszolgálni. Az alábbi 3 elem a legfontosabb az AMP oldalakon.
- AMP HTML: Az AMP HTML-kód lényege, hogy csak az alapvető elemekre koncentrál, valamint az, hogy az oldal betöltésekor csak egy http-kérés kerül elküldésre.
- AMP JavaScript: Az AMP aszinkron JavaScript kódot használ, ami lehetővé teszi, hogy már az oldalon lévő JS elemek betöltése előtt kezdetét vehesse az oldal letöltése.
- AMP CDN: Az AMP weboldalak gyorsítótára különböző szervereken van, így a tartalmat a lehető legrövidebb úton lehet eljuttatni a felhasználóhoz egy tartalomelosztó hálózat segítségével.
Milyen módosításokat kell végrehajtani a HTML-kódon az AMP megvalósításához?
A webhely HTML-jének számos speciális kiegészítőelemmel kell rendelkeznie ahhoz, hogy az AMP-n futhasson. Például minden audiovizuális médiatartalmat AMP-címkével kell megjelölni (amp-img, amp-video, amp-audio vagy amp-iframe). Ugyanakkor számos további elemet, címkét is tartalmaznia kell az adott weboldalnak, hogy megfelelően megjeleníthető legyen az AMP használatával.
Az AMP legfontosabb előnyei
- Hirdetők számára: Mivel a hirdetési tartalmak is aszinkron módon töltődnek le, nem lassítják az oldal letöltési sebességét. Vagyis több reklámot lehet elhelyezni az oldalakon anélkül, hogy a felhasználók a sebességcsökkenés miatt lepattannának.
- Tartalomgyártók számára: Az AMP-oldalak gyors letöltődése hozzájárul a felhasználói élmény fokozásához, ami növeli a felhasználók elköteleződését adott weboldalon lévő tartalmak irányába is.
- Felhasználók számára: Mivel az AMP weboldalak pillanatok alatt letöltődnek, a felhasználóknak nem kell várakozniuk – akkor sem, ha csak lassú internet eléréssel rendelkeznek.
Mivel ma már többen neteznek mobilról, mint számítógépről, a mobilbarát honlapokat kiemelten nagyra értékeli a Google. Könnyen lehet, hogy a Mobil First Indexing az első lesz a rangsorolási tényezők között a közeljövőben. Így a mobiloptimalizálási stratégiák, köztük a reszponzív webdizájn, a dinamikus kiszolgálás és az AMP jelentősége várhatóan tovább nő.