Köztudott, hogy az oldalbetöltési sebesség jelentősen befolyásolja a felhasználói élményt. Már az is számottevő konverzióromlást eredményez, ha egy másodperccel lassabban tölt be az oldalunk. De mégis hogyan kapcsolódik mindez a keresőoptimalizáláshoz és hogyan javíthatunk rajta?

Az oldalbetöltési sebesség szerepe

Modern, felgyorsult világunkban természetessé vált, hogy ha információra van szükségünk, azt azonnal szeretnénk megkapni. A felhasználók nem kedvelik azokat az oldalakat, melyek betöltődésére sokat kell várni. Bizonyos kutatások szerint a türelmi idő jelenleg 5-7 másodperc körül mozog, de ha igazán versenyképesek (a legjobbak) szeretnénk lenni, akkor ez az érték jóval kevesebb kell, hogy legyen.

2010-óta az oldalbetöltési sebesség rangsorolási tényező a Google algoritmusában, az okostelefonok elterjedése következtében pedig mára kiemelt szerepet játszik a keresőoptimalizálásban. A Google egyik szakembere, Jonh Mueller 2016 decemberében azt mondta, hogy a HTTP ideális betöltődési sebessége jelenleg 2-3 másodperc. Ezt a sebességet a valóságban még sok esetben nem sikerül megvalósítani, azonban mindenképpen tanácsos törekedni a felhasználó várakozási idejének minimalizálására. Hiszen lehet akármilyen dizájnos a honlapunk, és lehet akármennyire kiemelkedő a kínálatunk, ha túl lassúak vagyunk, az érdeklődők ott fogják hagyni az oldalunkat, még mielőtt az betöltődne.

A Google azokat az oldalakat kedveli és rangsorolja előrébb, melyek betöltési sebessége nem csupán az abszolút értéket tekintve jó, hanem amelyeknek a relatív skálán mért értéke is számottevő. Ez azt jelenti, hogy a versenytársak eredményeihez viszonyítottan is kiemelkedően kell szerepelni.

Hogyan tesztelhető az oldalbetöltési sebesség?

Az oldalbetöltési sebesség teszteléséhez számos eszköz közül választhatunk, ilyen például a GTmetrix, melynek létezik ingyenes és fizetős verziója is. Ez az eszköz azért közkedvelt, mert az oldalára látogatva nemcsak azt mutatja meg, hogy milyen sebességgel töltődik be az oldal, hanem javaslatokat is kapunk az optimalizálásra vonatkozóan. Nincs más dolgunk, mint hogy megadjuk a weboldalunk URL-jét és hogy megnézzük az értékeket, majd elemezzük, hogy melyik kategóriában hogyan teljesítünk. Ha megtaláltuk a gyenge pontokat, akkor amennyiben technikai tudásunk elég hozzá saját magunk is javíthatjuk ezeket. Ha komolyabb feladatról van szó, akkor érdemes felkeresni egy jó szakembert.

A GTmetrix felhasználói felülete áttekinthető és riportja sokat elárul a weboldal teljesítményéről. Az eszköz legnagyobb előnye éppen ez, hiszen az ingyenes verzió egy kanadai szervert használ. Ebből kifolyólag az itt kapott betöltési idő akkor lenne teljesen pontos, ha a szerverünk Kanadában lenne, a felhasználó pedig innen Magyarországról próbálná betölteni az oldalt. Bár ez torzít a kapott időeredményen, a GTmetrix a hibákat reálisan jelzi, megmutatja, hogy miket érdemes javítani.

Miket lehet kideríteni a GTmetrix használata során?

Az alábbi screenshoton látható, hogy az eszköz konkrét értékeket ad:

a Google PageSpeedre (%)
a Yahoo! YSlow score-ra (%)
a betöltési időre (mp)
az oldal méretére (KB)
és jelzi a HTTP requestek számára is
Oldalbetöltési sebesség

A riportban 5 különböző területre (PageSpeed, Yslow, Waterfall, Video, History) lebontva találjuk a részletesebb információkat. A megértést segíti, hogy az elemzés grafikonokkal is illusztrálva van, illetve az eredmények színekkel is értékeltek. A zöld azt mutatja, hogy mi a jó, a narancssárga közepeset jelent, a piros pedig a fejlesztendő területekre hívja fel a figyelmet.

Ötletek a 7 leggyakoribb hiba megoldására

1. Kevesebb adat, gyorsabb letöltés

Sokat gyorsíthatunk a weblapunkon, ha beállítjuk a Gzip tömörítést. Ez egy olyan tömörítő alkalmazás, amelyet eredetileg Unix rendszerekre írtak, de ma már széles körben elterjedt. Nagyon leegyszerűsítve a program kevesebb adat gyorsabb letöltését teszi lehetővé, mégpedig úgy, hogy a szerveren betömöríti a weboldalt, ami utána tömörített formátumban töltődik le a felhasználó gépére. A Gzip-et különböző CMS-ek esetén másképpen kell beállítani, az interneten böngészve ezekről számos leírást találhatunk.

2. Válasszunk a célközönséghez közeli szervert

A szerver kiválasztása során fontos szempont, annak földrajzi közelsége a felhasználóink többségéhez. Ha például cégünk ékszerek exportálásával foglalkozik, és az elsődleges piacunknak Bécs számít, akkor jobban járunk, ha inkább egy európai szervert választunk egy amerikai helyett. Ha a szerverünk túl lassúnak bizonyul, annak az is lehet az oka, hogy a szolgáltatónk nem elég jó. Ilyenkor érdemes keresni egy megbízhatóbbat, amely földrajzilag is közelebb van a célközönségünkhöz.

3. Állítsuk be a cachelést

Amikor valaki ellátogat a honlapunkra, annak minden egyes alkalommal le kell töltenie a HTML, Javascript, CSS fájlokat a saját gépére. Még abban az esetben is, ha már egyszer letöltötte a böngészője. A cachelés beállításával elkerülhetjük, hogy minden oldalt újra le kelljen tölteni és ezzel jelentősen csökkenthetjük a betöltési időt. A webszerveren be lehet állítani, hogy a böngésző mely típusú fájlokat mennyi ideig tárolja a felhasználó gépén.

4. Akár több mint száz képet is optimalizálhatunk percek alatt

A képek optimalizálása azért lényeges, mert ha kisebb lesz a méretük, akkor sokkal gyorsabban be fognak töltődni. A veszteségmentes tömörítési megoldás lehetővé teszi, hogy az emberi szem által nem érzékelhető módon csökkentsük a méretet. Léteznek olyan alkalmazások, mint például a Pngyu (PNG formátumra) vagy a JPEGmini (JPEG formátumra), melyek felületére egész mappákat is behúzhatunk. Ennek nagy előnye, hogy rövid idő alatt egyszerre több képet is optimalizálhatunk.

5. Fele akkora felbontás, kisebb méret

Ha a honlapunkon alacsonyabb felbontásban jelennek meg a képek, mint ahogyan azok eredetileg feltöltésre kerültek, akkor érdemes egy skálázott képet használni, melynek a fizikai mérete kisebb. A képek átméretezéséhez szinte bármilyen képszerkesztő programot használhatunk.

6. Minimalizáljuk a HTTP requestek számát

A fájlok szerverekről való letöltéséhez a böngészők az úgynevezett HTTP-t (Hypertext Transfer Protocol) használják, ami egy kérés-válasz protokoll. Ha túl sok a HTTP request, akkor túl sokszor kell kommunikálni a szerverrel és a requestek között eltelt idő pedig növeli az oldalbetöltési sebességet. Érdemes a kérések számát minimalizálni, lehetőség szerint gyűjtsünk mindent egy fájlba. Létezik például egy új megoldás a cache nélküli szerver felé menő kérések kezelésére is, az MXHR (Multipart XMLHTTP Request) összegyűjti ezeket, majd egy HTTP kérésként küldi el a szervernek.

7. Minimalizáljuk a Javascriptet, a CSS-t és a HTML-t

Vegyük ki a felesleges szóközöket és tördeléseket ezekből a fájlokból. Bár az emberi szem számára így szinte olvashatatlanná válik a szöveg, az algoritmusnak csak feleannyi karaktert kell majd végignéznie ugyanannyi információért.

A GTmetrix rövid leírásai segítségével viszonylag egyszerűen kideríthetjük, hogy a mi oldalunk esetében a fenti gondok egyike lassítja a sebességet, vagy más probléma áll-e fenn. Rövid idő alatt akár mi magunk is ki tudjuk javítani ezeket a hibákat. Ha úgy döntünk, hogy szakértőhöz fordulunk, az is megtérülő befektetés, hiszen ezeket a beállításokat egyszer kell jól elvégezni és utána elég, ha bizonyos időközönként végzünk egy ellenőrzést.