Weboldal betöltődési sebesség – miért fontos?
Online marketing tevékenységünk központi – és egyben kulcseleme – a weboldalunk. A weboldal minősége döntően befolyásolja fizetett online hirdetéseink teljesítményét, ezért valóban kiemelt fontosságú a minősége, több szempont szerint is:
- Konverzióra optimalizáltság (konverziós arány, CRO)
- Felhasználóbarát jelleg (usability szempontok)
- Betöltődési sebesség (webhelysebesség)
Valamennyi fenti szempontból optimálisnak kell lennie a weboldalunknak, illetve kampány landing oldalunknak ahhoz, hogy hozhassa nekünk a remélt érdeklődőket, illetve vásárlókat.
Ebben a blogcikkünkben a weboldal betöltődési sebességével foglalkozunk részletesen.
Mit jelent a weboldal betöltődési sebesség?
A weboldalunk betöltődési sebessége azt mutatja meg, hogy desktop- illetve mobileszközön hány másodperc alatt töltődik be a weboldalunk.
A Google jelenleg maximum 2 másodperces weboldal betöltődési időt javasol annak érdekében, hogy a legjobb teljesítményt érhessük el. Ha 3 mp-nél hosszabb idő alatt töltődik be az oldalunk, akkor minden egyes plusz másodperccel az egyébként elvárható konverziós arány felére csökken a várható weboldal konverziós arányunk. A konverziós arány pedig azt mutatja meg, hogy hány weboldal látogatásból lesz egy konverziónk (célteljesülésünk), vagyis üzletileg fontos eseményünk a weboldalon (pl. űrlap beküldés, vásárlás). Ez pedig amiatt fontos, hogy ha fizetett online hirdetéseket futtatunk, akkor minél kevesebb fizetett kattintásból szerezzük a lehető legtöbb kulcsfontosságú eredményt.
Nézzünk egy konkrét példát:
Weboldal betöltődés | Weboldal látogatás | Célteljesülés | Konverziós arány |
---|---|---|---|
2 mp | 100 | 1 db űrlap beküldés | 1% |
3 mp | 100 | 1 db űrlap beküldés | 1% |
4 mp | 200 | 1 db űrlap beküldés | 0,5% |
5 mp | 400 | 1 db űrlap beküldés | 0,25% |
6 mp | 800 | 1 db űrlap beküldés | 0,125% |
A fenti példában láthatjuk, hogy ha pl. 6 mp alatt töltődik be a weboldalunk, akkor – amellett, hogy a hirdetéseinkre kattintók nagy százaléka nem fogja megvárni a lassú weboldalunk betöltődését, elkattint és így meg sem fog érkezni a landoló oldalunkra – nyolcszor annyi kattintásért kell fizetnünk a hirdetések esetében ugyanahhoz az eredményhez, mint amit egy 2 mp alatt betöltődő weboldal esetében kellene a hirdetésekre fordítanunk.
A weboldal betöltődési sebessége így egyértelműen egy kulcstényező az online hirdetéseink eredményessége szempontjából.
A következőkben bemutatjuk azokat az ingyenes eszközöket, amelyekkel ellenőrizhetjük weboldalunk betőltődési sebességét és ahol konkrét javaslatokat kaphatunk a webhelysebesség javításához.
Google PageSpeed Insights
A PageSpeed Insights(PSI) elemzi a weboldal tartalmát mobil- és asztali nézeten, majd javaslatokat ad a weboldal gyorsabbá tételéhez. A részletes fejlesztői dokumentáció ide kattintva érhető el.
A Google PageSpeed Insights-on kívül egyéb mérőeszközök is elérhetőek a webfejlesztők számára, ezek listája itt található meg.
Első lépésként adjuk meg a weboldal url-jét, először a főoldalét! A PSI megkezdi az elemzést.
Elöljáróban néhány mítosz a felhasználói élmény méréséről:
- A felhasználói élmény mérhető egy egyszerű mérőszámmal.
A felhasználói élmény nem mérhető az idő egy pontjában. Leginkább a felhasználó látogatása során gyűjtött sarokpontok összessége. Fontos hogy nem minden mérőszám ugyanolyan fontos, nem ugyanannyit nyomnak a latba. - A felhasználói élmény tesztelhető egy tipikus felhasználóval.
A valós teljesítmény nagymértékben változó és függ a felhasználó eszközétől, hálózati kapcsolatától stb. Ezért érdemes több eszközön(asztali, mobil…) és hálózaton(3G, 4G) is tesztelni. - Ha nálam gyorsan tölt az oldal, másnál is úgy fog.
Azok az eszközök és hálózatok amiken mi tesztelünk általában sokkal jobb értékeket adnak, mint amit egy felhasználó tapasztal.
Az a kétfajta adattípus amit a PSI megjelenít, az úgynevezett “Lab data”-t és “Field data”-t.
A gyűjtött adatok fajtái
Lab data
Ezt az teljesítmény adatot irányított környezetben, előre meghatározott eszközökkel és hálózati beállításokkal gyűjti. Reprodukálható adatot biztosít ezzel segít feltérképezni és megoldani a teljesítményproblémákat. Hátránya hogy nem biztosít valós mérési adatokat, hiszen teszt környezetben zajlik.
Field data
Avagy “Real User Monitoring”. Ezt a teljesítmény adatot valós felhasználók általi oldalbetöltődésekből nyeri. Előnye hogy valós felhasználói élményt mér, hátránya hogy korlátozott méréssel rendelkezik.
A mérési eredmények értelmezése
Performance score – Teljesítményszám
Ezt láthatjuk azonnal az oldal tetején, ami (és ez fontos) ÖSSZESÍTI,az oldal teljesítményét.
Ha egy megadott url-ről átirányítás történik egy másik url-re, akkor ez a szám ennek az egy oldalnak az összesített teljesítményét jelzi. Fontos hogy ez nem az egész weboldal összesített pontszáma!
Ezt a teljesítményszámot a Lighthouse adja, ami összegyűjti és analizálja az oldal “Lab” adatait. Ez a szám 0 és 100 között mozog, 90 felett jó, 50-90 között javításra szorul, és 50 alatt rosszul teljesít az oldal. Nyilván egy 85-ös pontszámnál nem igazán érdemes aggódni, míg egy 55-ösnél már erősen ajánlott a javítás.
Real-World Field Data – Valós teljesítményadatok
Ezt a részt magán a google.hu-n érdemes szemléltetni, mivel itt minden adat megtalálható.
Mikor a PSI-nek megadunk egy URL-t, ő elkezdi megkeresni azt a Chrome User Experience Report (CrUX) adatbázisában. Ez lényegében egy olyan adatbázis, ami felhasználói élmény mérőszámokat ad arról a PSI-nek, hogy a valós Chrome felhasználók hogyan érzékelik a népszerű végpontokat a weboldalon.
Gyakran ezek az adatok nem elérhetőek, ezért is szemléltetem a google url linkjén, akkor a PSI megjeleníti nekünk a First Contentful Paint (FCP), First Input Delay (FID), Largest Contentful Paint (LCP), and Cumulative Layout Shift (CLS) mérőszámokat az adott oldalról és az adott oldalhoz tartozó eredetről megjelenített oldalakról összesítve is. Ha csak valamelyik mérőszám nem elérhető, helyettesíti egy másikkal. Azonban a fentiből 3 mérőszám (Core Web Vitals) az (FID, LCP, CLS,), amiket a 2021 májusi Google algoritmus frissítés még komolyabban fog venni a weboldalak értékelésekor.
Lab data – Tesztadatok
A PSI a LIghthouse-t használja hogy analizálja az URL-t, majd generál egy pontszámot ami megbecsüli az oldal teljesítményét, különböző méréseken alapulva (First Contentful Paint, Largest Contentful Paint, Speed Index, Cumulative Layout Shift, Time to Interactive, és Total Blocking Time). Zöld, sárga és piros jelzésekkel látja el őket, attól függően, hogy jók, javítandók, vagy gyengék.
Audit
A szöveges elemzést a PSI 3 részre osztja:
Lehetőségek
A PSI ajánlásokat tesz, amikkel lehet javítani a weboldal teljesítményén. Minden lehetőség mellett megjelenik egy becsült érték, ami azt mutatja, hogy a javasolt javítás elvégzésével, mennyit javíthatunk az oldal teljesítményén. A lehetőségek mellett habár azt látjuk, hogy a teljesítménypontszámra nincs közvetlen hatásuk, a mutatókra viszont igen, amikből a pontszám számítódik…
“In general, only metrics contribute to your Lighthouse Performance score, not the results of Opportunities or Diagnostics. That said, improving the opportunities and diagnostics likely improve the metric values, so there is an indirect relationship.”
Ha egy lehetőséget lenyitunk, további információt kaphatunk a problémáról.
Diagnosztika
Ebben a szekcióban arról kapunk információt, hogy a weboldal miként tartja be azokat a bevett/ajánlott gyakorlatokat, amelyeket a webfejlesztésben alkalmazunk.
Ezt is ha kinyitjuk, még több információt kapunk a lehetséges megoldásokról.
Sikeresen teljesített ellenőrzések
Ez a rész a sikeresen elvégzett javításokat tartalmazza.
A mobil- és asztali nézet webhelysebessége
Az oldal bal felső sarkában válthatunk mobil és asztali nézet között. A mobil nézet pontszáma szinte kivétel nélkül mindig alacsonyabb értelemszerűen, mivel a mobil nézet követelményeinek sokkal nehezebb megfelelni. A weboldalunk optimalizálásakor viszont vegyük figyelembe, hogy a felhasználók nagyobbik része már mobileszközről látogatja meg a weboldalakat, emiatt igenis kulcsfontosságú, hogy pl. A webshopunk mobileszközről is kiválóan használható legyen (a fizetési funkció is!).
Weboldal mobil sebesség ellenőrzése
A Google PageSpeed Insights mellett használható másik keszköz a Google szintén ingyenes Test My Site eszköze (figyeljünk oda, amikor rákeresünk a Google-ban, mert sok más weboldal másolja a nevet, amelyek fizetős eszközöket ajánlanak). Ezt ezen a linken érhetjük el. A weboldal domain beírását követően információt kapunk arról, hogy a kiválasztás szerinti 4G/5G mobileszközön hány másodperc alatt töltődik be a weboldalunk.
A Google PageSpeed Insights-hoz hasonlóan itt is kapunk részletes javaslatokat weboldalunk gyorsításához, pl.
Összefoglalásképpen
Bármilyen csatornákon is hirdetünk vagy jelenünk meg az online térben, kulcsfontosságú a weboldalunk minősége az optimális eredmények elérése érdekében.
Három másodpercnél lassabb betöltődés hátrányosan befolyásolja a várható konverziós arányunkat, amely a fizetett online hirdetéseink eredményességére is rányomhatja a bélyegét.
Fektessünk időt és energiát a weboldalunk gyorsításába, a Google ingyenes diagnosztikai eszközeinek felhasználásával!
Keressen minket bizalommal, ha online marketing aktivitásaihoz profi segítségre van szüksége!
Felhasznált források:
http://developers.google.com/speed/pagespeed/insights/