Martinnel Michálkem a Shoptet e-üzletek sebességéről

Milyen hatással van a sablonok és kiegészítők kiválasztása a websebességre? Mi az optimális arány a vonzó megjelenés és a webáruház teljesítménye között? És hogyan ismerhető fel egy minőségi szolgáltató?

Interjúnkban Martin részletesen leírja a leggyakoribb hibákat, felhívja a figyelmet a dizájnváltoztatások minőségi megvalósításának fontosságára, és bemutat egy sikeres webáruház optimalizálási példát a következővel: Denatura.cz.

Megtudhatja továbbá, hogy a sebesség monitorozása hogyan tudja lényegesen befolyásolni webáruházának teljesítményét és miért fontosabb a kommunikáció a partnerválasztás során, mint a technikai részletek.

Ami a Shoptetet illeti, maga a platform sebesség szempontjából rendkívül jól előkészített. A sablonok önmagukban általában nem okoznak nagyobb problémákat. Azonban, ahol a PageSpeed.cz gyakran problémát lát, az a dizájn átfogóbb változtatásai során felmerülő gondok. 

Az első probléma az, hogy az ügyfelek és dizájnerek gyakran nem veszik észre, hogy a klasszikus Shopteten a kódolóknak jelentős mennyiségű JavaScriptet kell használniuk a sablon eredeti megjelenésének átírásához, ami önmagában bonyodalmat jelent a webáruház teljesítménye szempontjából. Úgy gondolom, hogy már itt meg kellene állnia a webáruházak üzemeltetőinek, és beszélgetniük kellene arról, hogy milyen eredeti sablont válasszanak, és mennyire módosítsák annak megjelenését.

Egy másik probléma magának ezeknek a változtatásoknak a megvalósításában rejlik. A Shopteten dolgozó kódolók minősége nagyon változatos, a minőségi emberektől kezdve egészen azokig, akik megrekedtek 2010-ben, és valódi károkat okoznak a sablonokon. 

Mindenképpen ajánlott a minőségüket az ismerősök ajánlásai alapján megítélni, és nem csak a Shoptet partnerek ajánlatában lévő csillagok számán keresztül. Mi mindig nagyobb tapasztalattal rendelkezünk nagyobb szolgáltatókkal, mint például a Mime Digital, Able vagy dkLab. 

És mi a helyzet a kiegészítőkkel?

Általában ezek sem rontják automatikusan a sebességet. Figyelnék csak az INP metrikára, azaz az interakcióra adott válaszidő sebességére. Itt látunk romlást különféle javascript alapú kiegészítők miatt. A szokásos GTM vagy Google Analytics nem befolyásolja negatívan, de óvatosság javasolt a személyre szabási, hirdetési és A/B tesztelési kiegészítők, vagy pedig a vásárlási folyamatba címjavaslatokat hozzáadó kiegészítők esetében.

Ugyanakkor el kell mondani, hogy a PageSpeed.cz-nél számos Shoptetet használó webáruházzal működünk együtt, és bár a platformnak vannak korlátai, eddig szinte mindent sikerült megoldanunk. Zöld Core Web Vitals értéket a Shopteten is el tudunk érni.

Ha ajánlhatok egy alapvető dolgot, amit minden webáruház-tulajdonosnak a sebesség tekintetében meg kellene tennie, az a sebesség monitorozása. Erről később bővebben is beszélek majd.

Körülbelül 10-15 weboldal gyorsaságát optimalizáltuk Shopteten. Jelenleg a Denatura.cz weboldal esetleírását készítjük elő.

A Denaturán először a layout stabilitási metrikákat (CLS) és a betöltési sebességet (LCP) optimalizáltuk nagyon sikeresen. 

Amikor a Google új INP metrikával jött ki az interakciók sebességének mérésére, elkezdtük az optimalizálását. Részleges sikereket értünk el a JavaScript optimalizálásával közvetlenül a Denatura weboldalán, de idővel arra a következtetésre jutottunk, hogy közvetlenül a Shoptettel kell együttműködnünk.

Együttműködésünk a Shoptet fejlesztőkkel aztán javulást hozott az összes webáruháznak, a legtöbbjüket a Core Web Vitals zöld értékelési skálájának sorába emelve, és valószínűleg jobb helyezést a SEO szempontjából is.

Remélem, hogy ez az együttműködés folytatódni fog, mert a sebességoptimalizálás hatása a negyvenezer webáruház esetében óriási, és a PageSpeed.cz küldetése az, hogy minden webet gyorsabbá tegyen. A Denaturánál még nincsenek számaink, de úgy gondolom, hogy a sebesség optimalizálása hozzájárult a nagy éves növekedésükhöz. Úgy gondolom, hogy mindhárom fél elégedett lehet.

Mint már fentebb írtam. Nagyobb stúdiókat választanék, elkerülve az olcsó freelance kódolókat. Lehet, hogy meglepődik, de nem szükséges kifejezetten a technikai ismeretekre összpontosítani az adott személy vagy cég esetében.

Az alapja a kommunikáció. Nagyon gyakran előfordul, hogy az optimalizálás nem úgy halad, ahogyan azt szeretnénk, éppen a fejlesztők elégtelen kommunikációja miatt.

Olyan embereket válasszon, akik kommunikálnak, nyitottak és proaktívak. Ezt már a fejlesztés korai szakaszában felismeri majd.

Shoptet webáruház üzemeltetőjeként mindig törekednie kell a Core Web Vitals zöld értékeinek elérésére az egész domain vonatkozásában. A zöld azt jelenti, hogy minden legalább alapvetően rendben van.

A következő cél az, hogy a Google Search Console-ban a jelölt URL-csoportoknál zöld értékeket lássunk. E két forrást kombinálni kell.

A következő képen látható, hogy az egyes metrikák számára mely értékek tekinthetők optimálisnak.

Milyen értékek jellemzőek a Shoptet weboldalakra? Monitoringunk során néhányukat figyeljük és így festenek:

Mit tehet egy webáruház tulajdonosa saját maga a sebesség javítása érdekében, még technikai tudás nélkül is? Mik az első lépések az optimalizáláshoz?

Meglepően sok mindent, leginkább „soft” ismeretek szintjén.

A válaszomat egy ellenőrzőlista formájában fogom megadni:

1. Mérje a websebességet. Egyszeri tesztek PageSpeed Insights segítségével nem olyan jók, ezért bevezettük a PLUS monitoringot, amely követi a Google metrikákat, de minden nap szintetikus teszteket is futtat az Ön fontos oldalain. Egy kis változás, például egy kiegészítő hozzáadása is ronthatja a sebességet, ezért a monitoring kulcsfontosságú. A monitoring segítségével ellenőrizheti a kódolókat és más szállítókat is.
2. Válasszon egy jó webmódosító szállítót. Keressen megerősített, jól kommunikáló partnereket jó referenciákkal. Lásd az előző válaszokat. De még így is ellenőrizze a munkájukat monitorozással.
3. Mérlegelje minden új JavaScript komponens bevezetését. Lásd fent. Nincs probléma azzal, hogy bármi újat hoznak be a weboldalra, de győződjön meg róla, hogy méréseket végez, hogy megtudja, ha az új komponens ront valamely sebességi metrikán.
4. Legyen kapcsolatban a Shoptet támogatásával. Kérje meg őket, hogy állítsák be a képek tárolását WebP formátumban, ami sokkal adat-hatékonyabb.

Ha a sebesség nem javul, béreljen szakértőket.

A PageSpeed.cz már néhány óra tanácsadás után is eredményeket tud biztosítani.