Hogyan javítsd weboldalaid sebességét (és ezzel rangsorolásodat a Google szemében)
Hogyan javítsd weboldalaid sebességét (és ezzel rangsorolásodat a Google szemében)
A weboldal sebessége egy fontos rangsorolási szempont a Google szemében. Megmutatjuk, mit mond honlapkészítődnek, mit kell tennie, hogy honlapod megfelelően gyors legyen!
Mielőtt fejest ugranánk az oldalsebesség javításának rejtelmeibe, első körben jobb, ha tisztázzuk, hogy mi is áll pontosan a fogalom mögött, mert meglepően sokan értik félre.
Az oldalsebességet gyakran keverik a webhelysebességgel, de fontos észben tartani, hogy egy webhely több weboldalból áll (ezt a két kifejezést szintén gyakran keverik), és a webhelysebességet több oldal sebessége alapján számíthatjuk ki.
Az oldalsebesség két dolgot jelenthet:
- Oldal betöltési ideje: Mennyi időre van szükség, hogy az adott oldal tartalma teljes egészében megjelenjen?
- Első bájtig eltelt idő: Mennyi időbe telik, hogy a böngésző szoftver megkapja az első bájtnyi információt a webszervertől?
Egy-egy oldalad sebességét a Google PageSpeed Insights eszközével ellenőrizheted. Ez az eszköz az úgynevezett CrUX adatokat (az olyan felhasználóktól gyűjtött adatokat, akik a Chrome böngészőt használják) használja fel, hogy felmérje a megadott oldal sebességét, ami alapján két fontos mutatót jelenít meg:
- Első vizuális tartalomválasz (First Contentful Paint – FCP)
- A betöltött DOM tartalmak (DOM Content Loaded – DCL)
Miért olyan fontos az oldalsebesség?
A SEO közösségben alapvető ténynek számít, hogy a Google rangsorolási szempontnak használja a webhely sebességét, így ebből következik, hogy az egyenkénti weboldalak sebessége is fontos (hiszen ezek határozzák meg a webhely általános sebességét). A felmérések szerint a Google az első betöltött bájtig eltelt időt veszi figyelembe az oldalak sebességének mérésekor.
Egy lassú oldalsebességnek számos hátránya van. Az egyik jelentős negatívum, hogy az oldalakat átvizsgáló robotoknak (amiket a keresőmotorok használnak a webhelyek feltérképezésére) csak korlátozott mennyiségű oldalt képesek ellenőrizni egy-egy vizsgálat során, ami rossz hatással lehet oldalaid (és egész webhelyed) indexelésére.
Az oldalsebesség továbbá fontos a felhasználói élmény szempontjából is. Egy lassan betöltő oldalról sokan fognak visszafordulni, és kevesebb látogatónak lesz türelme kivárni, míg egy-egy oldalad megjelenik böngészőjében. Ezzel rengeteg látogatót forgalmat veszíthetsz el, akik egyébként lehet, hogy ügyfelekké konvertáltak volna.
Hogyan javíthatod weboldalaid sebességét?
Fontos megjegyezni, hogy miután ellenőrizteted oldaladat a Google PageSpeed Insights-szal, az eszköz számos javasolt lépést ajánl, amelyekkel felgyorsíthatnád az adott oldalt – érdemes odafigyelni ezekre!
Íme néhány módszer weboldalaid sebességének fellendítésére.
Használj tömörítést
A nagyméretű CSS, HTML, és JS fájlok lassíthatják oldalaidat, ezért érdemes tömöríteni őket. A Gzip (https://www.gnu.org/software/gzip/) segítségével minden olyan script és stílusfájlodat tömörítheted, amelyek meghaladják a 150 bájtos méretet.
Fontos, hogy a képeket más, egy erre alkalmas szoftver segítségével tömörítsd, és ne néhány bájtosra – próbáld beállítani azt a legkisebb fájlméretet, ami mellett még tűrhető minőségű marad a kép.
Töröld a felesleges kódrészleteket
Érdemes rendszeresen ellenőrizni – vagy legalább is minden változtatás után – hogy webhelyed forráskódja optimalizált-e. Az optimalizálás itt a felesleges szóközök, vesszők, és egyéb felesleges karakterek, illetve a megjegyzések, és felesleges kódrészletek törlését jelenti. Meglepően sokat gyorsíthatsz webhelyeden, ha odafigyelsz ezekre.
A Google útmutatójában a következő eszközöket javasolja erre a célra:
- HTML: HTMLMinifier (https://github.com/kangax/html-minifier)
- CSS: CSSNano (https://github.com/cssnano/cssnano), vagy ccso (https://github.com/css/csso)
- JavaScript: UglifyJS (https://github.com/mishoo/UglifyJS2), vagy Closure Compiler (https://developers.google.com/closure/compiler/)
Kerüld a többlépéses átirányításokat
Valahányszor egy oldal átirányítja a felhasználót egy másik címre, a felhasználó egy lassabb oldalbetöltést tapasztal majd. Minél több lépésből áll egy átirányítás, annál több időbe telik, míg a végleges tartalom megjelenik a böngészőben. Lehetőség szerint csak egyetlen átirányítást használj, valahányszor szükséged van erre. Ha kell, térj vissza korábbi oldalaidhoz és csökkentsd az ugrások számát.
Töröld a megjelenítést gátló JavaScripteket
A böngészőknek egy úgynevezett DOM fát kell felépíteniük a HTML átvizsgálásakor, mielőtt megjeleníthetik az oldal tartalmát. Ha a böngésző egy JavaScriptet talál e folyamat során, akkor meg kell állnia, amíg lefuttatja azt, és csak utána folytatja majd a DOM fa elkészítését.
Igyekezz tehát minél kevesebb olyan JavaScripteket használni, amelyek lelassíthatják ezt a folyamatot.
Használd ki a böngészők gyorsítótárazását
A böngészők rengeteg információt (stíluslapok, képek, JS fájlok, stb.) gyorsítótáraznak, hogy később, amikor a felhasználó visszatér webhelyedre, akkor ne kelljen mindent újratöltenie, és a korábban már megtekintett oldalak sokkal gyorsabban megjelenjenek.
Érdemes ellenőrizni, hogy mikorra van beállítva gyorsítótárad lejárati dátuma, majd állítsd be az „expires” (lejár) headert arra az időtartamra, ameddig szeretnéd, hogy gyorsítótárad aktuális maradjon. Hacsak webhelyed nem változik gyakran, egy év általában elegendő.
Javítsd a szerver válaszidejét
Szervered válaszidejét többek között az is befolyásolja, hogy mekkora mennyiségű forgalom érkezik webhelyedre, hogy mennyi erőforrást használ egy-egy lap, hogy milyen szoftverrel fut a szervered, illetve a webtárhely szolgáltatójától is.
Ha gyorsabb válaszidőt szeretnél kihozni szerveredből, akkor próbáld azonosítani azokat a lehetséges pontokat, amelyek lassíthatják a folyamatot – ilyenek például a lassú adatbázis-lekérdezések, vagy a memóriahiány. Ezeket a problémákat kell megoldanod. Az ideális szerver válaszidő 200ms alatt van.
Használj tartalomelosztó hálózatot
A tartalommegosztó hálózatok (content distribution network, röviden CDN) összekapcsolt szerverek hálózatai, amelyek szétosztják egymás között tartalmaid kiszolgálását a felhasználóknak. Lényegében arról van szó, hogy webhelyedről több másolat készül, ami a világ több pontján elhelyezett adatközpontban kerül eltárolásra, ahonnan a helyi felhasználók sokkal gyorsabban lekérhetik őket böngészés közben.
Optimalizáld a képeket
Ahogy már fent említettük, érdemes megkeresni a legjobb minőség/méret arányt képeid feltöltésekor. A logók és grafikák esetén, amelyek nem használnak 16 színnél többet a PNG formátumot ajánlott használni (ez a formátum támogatja az átlátszó pixeleket is, így sok logóhoz mindenképpen ezt kell majd használni). A fotók, és összetettebb képek esetén a JPEG formátummal érhetsz el jó minőség/méret arányt – a JPEG formátum azonban nem támogatja az átlátszó pixeleket.
Készíts egy sablont gyakran használt képeidnek (pl. gombok, ikonok) CSS sprite-ok segítségével. A CSS sprite-ok egy nagy képpé kombinálják képeidet, így egyszerre töltődnek majd be (ezzel kevesebb HTTP kérést kell végrehajtani), és csak azokat a részeiket kell megjelenítened, amelyeket szeretnéd.
Tartalomjegyzék
Miért olyan fontos az oldalsebesség?Hogyan javíthatod weboldalaid sebességét?
Használj tömörítést
Töröld a felesleges kódrészleteket
Töröld a megjelenítést gátló JavaScripteket
Használd ki a böngészők gyorsítótárazását
Javítsd a szerver válaszidejét
Használj tartalomelosztó hálózatot
Optimalizáld a képeket
MARKETING SZÓTÁR
Online marketing tanácsadó 1998-óta
Diplomáim megszerzése után nem tudtam eldönteni, hogy a tudományos pályán maradjak, vagy helyezzem marketing iránti érdeklődésemet üzleti alapokra. Legyen hát a kettő együtt, gondoltam. Levelezőn kezdtem neki a marketing doktori elvégzésének, oktattam az egyetemen, közben megalapítottam a Marketing Professzorok online marketing ügynökséget. Az eltelt időszakban több, mint 500 KKV és több tucat nagyvállalat marketing kommunikációjában játszottam szerepet, mint online marketing tanácsadó. A kutatást sem adtam fel, csapatommal egy olyan marketing kommunikációs stratégiát építettünk fel, mely keresőoptimalizálás (SEO), Social Media Marketing és tartalommarketing (publishing) alapokon szinte minden iparágban eredményesen és költséghatékonyan bevethető. Amennyiben eljutottál már oda, hogy tudod, a Ti cégeteknél is egy ilyen hatékony marketing kommunikációs stratégiára van szükséged, kérd ajánlatunkat! Ha még nem érzed az Internet elsöprő erejét, olvasgasd cikkeinket - de tudom, egyszer így is eljön a Te időd!
Online marketing tanácsadás
Az online marketing nem egyezik meg az offline marketinggel. Egészen másak a reakcióidők, a reakciók, az eszközök. Legyen szó kisvállalkozásról vagy egy gyógyszergyár több brandjéről, az eddig bevált sales és marketing nem adaptálható az online világra. Nem elég egy cégbemutatkozó, sőt nem elég egy jól megírt marketing szöveg sem. Az Interneten nem csak a potenciális vevőknek írunk, a keresőmotorokat és az Internetezők szokásait is figyelembe kell vennünk. Ha viszont ezeket eltaláljuk, elkapunk egy fonalat mely akár olyan ingyenes reklámot hozhat cégünknek, amely annyi emberhez jut el, amennyit a hagyományos eszközök segítségével nem is remélhetünk. Mi kell ehhez? Keresőoptimalizálás? Közösségi média marketing? Tartalommarketing? Egy kreatív ötlet és sok-sok tapasztalat, na és mindenek előtt egy jól kidolgozott marketing stratégia!
Online PR és Publishing
Az online marketing mellett a Publishing és az online PR is része egy komplex marketing stratégiának. Gyógyszergyáraknál dolgozva megtanultam, mi az, ha az embert nem csak a kőkemény és tőkeerős konkurencia akarja megfektetni, feljelenteni, elgáncsolni, hanem a hatóságokkal és a média ellenszelével is harcolni kell. Sok olyan projektben vettem rész, ahol még csak látszódnia sem szabadott annak, hogy mit akarunk eladni, mégis konkrét eladási számokat vártak a multinacionális vállalat központjában az online PR vagy a Publishing hatására. Hibázni nem lehet, mert a konkurencia és a hatóságok szeme ránk szegeződik, a legkisebb félrelépésre is milliós büntetéseket várhatunk. Mégis rekordokat döntöttek az eladás-növekedési számok!
Online marketing előadások, oktatás és kutatás
A Gödöllői Szent István Egyetem Marketing Intézetének oktatójaként nem csak a diákok képzésében, de az elméleti kutatásokban is részt veszek. Doktori (PHD) munkám is online marketing témában készül. Az egyetemi kutató munka és a Marketing Professzorok Kft. mindennapi éles gyakorlati munkája során olyan tapasztalatokat szerezhetek, amelyet kevesen ma Magyarországon. Az élvonalbeli, EU-s forrásokból is támogatott elméleti egyetemi kutatás és az üzleti élet könyörtelen kihívásainak kombinációja hatékony és a konkurencia előtt járó tudást ad. Ezeket nem csak diákjaimnak, hanem nemzetközi marketing konferenciákon kutató társaimnak is igyekszem átadni, de ügyfeleimnél a mindennapi gyakorlatban is sikerrel alkalmazom. Keresőoptimalizálás, Facebook marketing, AdWords kampányok, LinkedIn és sorolhatnám azokat a vállalati tanfolyamokat, amelyeket tartottam az elmúlt években, kihelyezve vállalatoknál.
SEO tanácsadás, saját kutatás alapján
A SEO a komplex online marketing leghatékonyabb eszköze. A keresőoptimalizálás megítélése egy kis időre megrendült a közösségi média marketing felületek kialakulásával, amióta azonban azokon egyre inkább csak fizetett hirdetésekkel lehet nagy eléréseket produkálni, a SEO ismét vezeti a költséghatékony online marketing eszközök listáját. A keresőoptimalizálás azonban nem egy állandó rendszer, a Google algoritmusainak folyamatos változása a korábban jól prosperáló weblapok látogatottságát dönti rommá. Ahhoz, hogy naprakészek legyünk a SEO minden kis trükkjével, folyamatosan figyelnünk kell a nemzetközi irodalmat, valamint saját kísérleteket beállítva ellenőrizzük - vagy megdöntjük az onnan származó állításokat. A megszerzett tudást keresőoptimalizálási tanácsadásunk során alkalmazzuk ügyfeleink weboldalain.