Rastlinkovo · Meglévő webáruház optimalizálása
Egy már teljes üzemben működő webáruház optimalizálása.
A Rastlinkovót nem a nulláról építettük. A már működő WooCommerce-áruházban a teljesítményre, hibajavításokra és kiválasztott felületi finomításokra összpontosítottunk.
Vásárlási útvonal
A vásárlási útvonalat egyetlen összefüggő egészként optimalizáltuk.
A teljesítményt és a hibákat nem egyetlen képernyőn vizsgáltuk. Követtük az utat a belépéstől a katalóguson és keresésen át a termékadatlapig és a kosárig.
Görgesse vízszintesen a diagramot.
- 01
Kezdőlap
Belépés az áruházba és az első döntés a folytatásról.
- 02
Kategória
A kínálat böngészése, termékek összehasonlítása és továbblépés a részletekhez.
- 03
Keresés
Közvetlen út egy adott termékhez a kategóriák böngészése nélkül.
- 04
Termék
Információ, ár és vásárlási művelet az útvonal döntő pontján.
- 05
Kosár
A kiválasztott tételek ellenőrzése a rendelés folytatása előtt.
Információk
- Beavatkozás típusa
- Meglévő webáruház optimalizálása
- Platform
- Webes webshop
- A mi szerepünk
- A webshopot nem mi építettük. Egy működő WooCommerce boltba a teljesítmény miatt léptünk be, hibákat javítottunk, és a felület kiválasztott részeit igazítottuk.
- Környezet
- Működő áruház a beavatkozások alatt
Technológia
- WordPress
- WooCommerce
- PHP
- MySQL
Amit megtud
- 01Hogyan járjuk végig a teljes vásárlási útvonalat a kód módosítása előtt.
- 02Miért kell a teljesítményt a felület, a WooCommerce, a futtatókörnyezet és az adatok között vizsgálni.
- 03Hogyan rangsoroljuk a beavatkozásokat a felhasználói hatás, nem pedig a láthatóság alapján.
- 04Hogyan ellenőrizzünk egy kis módosítást a teljes érintett folyamatban mobilon és asztali gépen.
01
Előbb megérteni, aztán változtatni
A Rastlinkovo már működő áruház volt katalógussal, kereséssel, termékadatlapokkal és kosárral. Nem üres tervből indultunk. Végigjártuk a vásárlási útvonalat és reprodukáltuk a problémákat.
“Egy meglévő rendszer optimalizálásakor a kontextus a megoldás része.”
02
A teljesítmény az összekapcsolt rendszer kérdése
Egy lassú képernyő oka ritkán ott van, ahol látjuk. A felület, a WooCommerce logika, a PHP, a bővítmények, az integrációk és a MySQL egy lánc. Az optimalizálást a kérés útvonalára terveztük.
03
Rangsorolás a felhasználói hatás alapján
Legmagasabbra az került, ami megszakította a böngészést, vagy mobilon és asztali gépen egyaránt jelentkezett. Egy látványos részlet nem kapott elsőbbséget. A hatás és a kockázat döntött.
“Az optimalizálás sorrendjét a hatás, nem pedig a láthatóság adja.”
04
Optimalizálni, tesztelni, ellenőrizni
Minden beavatkozást a probléma reprodukálásával és világos hatókörrel kezdtünk. A kód vagy stílusok módosítása után ellenőriztük az érintett folyamatot és a reszponzív állapotokat. A pontosság szólt.
05
Javítás újraírás nélkül
Az érték a meglévő megoldás megértésében, a valódi hatású pontok megtalálásában és a teljesítmény, a viselkedés és egyes stílusok javításában volt. A bolt közben végig működött.
A meglévő rendszer architektúrája
A teljesítmény nem egyetlen rétegben dől el.
A Rastlinkovo egy meglévő WordPress- és WooCommerce-áruház. Az okok feltárásakor a felületet, a kereskedelmi logikát, a PHP futtatókörnyezetet, az integrációkat és az adatokat egy rendszernek néztük.
Hogyan találtuk meg az okot
Először reprodukáljuk
Végigjártuk a meglévő útvonalat és reprodukáltuk a konkrét hibát.
Mérés találgatás előtt
Megmértük a viselkedést, és elválasztottuk a tünetet a valószínű októl.
A hatás adta a sorrendet
A beavatkozásokat a vásárlási útvonalra gyakorolt hatás szerint rendeztük.
Kis, biztonságos módosítás
A legkisebb biztonságos módosítást választottuk a kódban vagy a stílusokban.
A teljes vásárlási folyamat
A változást a kapcsolódó folyamatban és különböző képernyőszélességeken teszteltük.
Ellenőrzés a kiadás után
A kiadás után élő környezetben ellenőriztük az eredményül kapott viselkedést.
Görgesse vízszintesen a diagramot.
- 01
Storefront
Téma, sablonok, katalógus és a közvetlenül érzékelhető felület.
- 02
Commerce
A WooCommerce összeköti a termékeket, a kosarat és a rendelési folyamatot.
- 03
Runtime
A PHP, a WordPress mag, a hookok és a bővítmények futtatják az alkalmazáslogikát.
- 04
Integrációk
A fizetés, a szállítás és az értesítések a kirakat felületén túlra terjesztik a folyamatot.
- 05
Adatok
A MySQL és a média tárolja a termék-, rendelés- és tartalmi állapotot.
Minőségellenőrzés
Kis módosítás, teljes ellenőrzési kör.
Egy működő áruházban nem elég egy sort kijavítani. A hatókört szűken tartottuk, de az eredményt az érintett útvonal egészén, mobilon és asztali gépen, a kiadás után is ellenőriztük.
Görgesse vízszintesen a diagramot.
- 01
Reprodukálás
Először a valós felhasználói útvonalon erősítjük meg az ismert hibát.
- 02
Hatókör
A legkisebb biztonságos változtatás kiválasztása felesleges mellékes beavatkozás nélkül.
- 03
Reszponzív
Az érintett útvonal ellenőrzése mobil és asztali elrendezésben.
- 04
Kiadás
A változtatás után még egyszer ellenőrizni az élő áruház viselkedését.
