Kaj morate nujno preveriti ob lansiranju spletne trgovine?

Rok Meglič20.09.2016Spletne trgovine

Veliko trgovcev se ne zaveda, da je spletna trgovina kompleksen projekt, kjer je združenih čuda tehničnih zadev, poslovnih pravil / pogojev poslovanja, plačil, dostave, različne države, prevodi, ceniki in tako dalje. Najbolj kompleksne spletne trgovine, ki temeljijo na spletni platformi Magento, potrebujejo dodatni pregled, ki zagotovi optimalno spletno trgovino.

Vaš odziv na bug?

Če niste manager, si želite, da manager ne bo imel takega izraza na obrazu. Z dobrim testiranjem zagotovite nasmešek pri vašem šefu oz. naročniku.

Različni odzivi na bug

1928876_10153363197786837_2987585918568042875_n

Besedilo in funkcionalnost

Vse preberite še enkrat. Če ste to storili že 10x, prosite nekoga drugega, da to naredi namesto vas. Ko vsak dan razvijaš in gledaš določeno spletno trgovino, postaneš imun na pogled iz širšega vidika. Osredotočen si na točno določeno stvar, ki jo v tistem trenutku testiraš. Pomembno je, da spletno trgovino pregleda tudi nekdo, ki ni tehnično podkovan, da preveri, ali je funkcionalnost prijazna uporabniku oz. sploh deluje. Najbolje je, da pri uporabi spletne trgovine opazujemo nekoga, ki je dejansko obiskovalec/kupec iz našega ciljnega trga.

Kaj se zgodi, če ima obiskovalec onemogočen Javascript?

Če vaša spletna trgovina za delovanje potrebuje določene tehnologije, npr. Javascript, je zelo dobro preveriti, ali obiskovalcu povemo, da za normalno delovanje spletne trgovine potrebuje vključeno Javascript tehnologijo. Vaš kontaktni obrazec deluje, če je Javascript izklopljen? Osnovne funkcionalnosti je dobro preveriti, če delujejo v degradiranem načinu delovanju.

Opozorilo – Javascript tehnologija je izklopljena

Sitemap

V Magento -> Google Sitemap moramo za vse različne poglede/jezike spletne trgovine pregledati ali imamo definiran sitemap. Vse sitemap datoteke, ki jih generiramo, moramo vnesti tudi v robots.txt. Glejte naslednjo točko.

Magento Google Sitemap

SEO – sitemap

Pomembno je, da imate nastavljene Use Canonical Link Meta Tag For Categories / Products. V primeru, da imate veliko število artiklov (nujno nad 50.000, priporočeno pa nad 30.000), je treba namestiti dodaten modul, ki sitemap.xml razdeli na več delov – v nasprotnem primeru Google ne poindeksira vseh linkov v sitemapih. Preverite Google Webmasters orodje za več informacij.

Priporočamo Magento modul XML Sitemap PLUS Generator & Splitter.

SEO – sitemap nastavitve

Robots.txt

Običajno je za popularne open-source platforme (Magento, Woocommerce) mogoče najti pred-pripravljen robots.txt. Enega izmed takih predlogov najdete tudi na eni izmed Optiweb spletnih trgovin. Bodite pozorni, da v robots.txt definirate vse sitemap.xml datoteke, ki jih imate. Npr. različni jeziki in različni pogledi spletnih trgovin imajo običajno svoj XML.

Magento – robots – multi store – multi sitemap.xml

Index, Follow

Prepričajte se, da imate nastavljeno “Index, Follow” nastavitev v Configuration -> Design -> Default Robots. To je osnovna SEO nastavitev, ki iskalnikom dovoli vstop v spletno trgovino ter indeksiranje celotne vsebine.

Index, Follow – Defaults Robots nastavitev

Moj račun, prijava, moja naročila, pozabljeno geslo …

Obvezno je treba preveriti, ali vse zelo pogoste operacije delujejo. Moj račun, prijava, moja naročila, pozabljeno geslo. Treba je preveriti tudi hitro prijavo, ko smo na zaključku naročila, če uporabljamo One Step Checkout modul. Preveriti je treba tudi pozicijo tabel oz. širino posameznih stolpcev na naročilih pri posameznih statusih. Lahko se zgodi, da zaradi dolžine besedila, status pade v dve vrstici. Malenkost, vendar pomembna za dodelan videz spletne trgovine.

Prijava, košarica, moj račun

Moja naročila

Iskalnik

Treba je preveriti, ali iskalnik vrne pravilne zadetke ter, če so v rezultatih prisotni vsi artikli. Opozorilo. Magento ima v Community verziji (brezplačna verzija) zelo slab iskalnik. Priporočamo Spinx modul, ki ga lahko preverite na ekwb.com/shop, grosbasket.com ali pricaraj.si.

Iskalnik – Spinx – Magento

404 – not found – stran ne obstaja več

Preverite slovnične napake na 404 strani. Možno je tudi, da vašo 404 spletno stran naredite bolj zanimivo, spodaj primer stadionshop.si.

Stadionshop – 404 spletna stran

Obvestilo o napakah – error checker

Spletna platforma Magento ima možnost, da vsako napako sporoči administratorju (oz. definiran email). Prav tako je možno izbrati ali naj se informacije o napakah prikažejo javno ali naj se zadeva shrani v datoteko na strežniku.

Magento – poročilo o napaki – konfiguracija

Magento – poročilo o napaki

Testiranje vseh plačil – live/sandbox nastavitve (Braintree / kreditne kartice/ paypal)

Veliko ponudnikov plačilnih sistemov ponuja sandbox način, ki omogoča razvoj in testiranje plačilnih sistemov brez uporabe pravih kreditnih kartic ali PayPal računa. Po končanem razvoju je treba preveriti, če smo vse nastavitve glede plačevanja spremenili iz sandbox načina na LIVE. Običajno gre za PayPal in kreditne kartice.

Braintree – Magento – osnovna konfiguracija

Testiranje naročil – povezava z računovodskim programom / CRM

Določena podjetja imajo zelo stroga pravila glede številke naročila. Zato je treba po testiranju naročil števec postaviti na številko, ki je usklajena z računovodskim programom stranke. Preverite tudi ali je sinhronizacija na računovodski program povezana na testno ali LIVE podatkovno bazo.

Shoppimon.com – orodje za testiranje spletne trgovine

Izredno priporočamo orodje shoppimon.com, ki redno testira različne scenarije na spletni trgovini. Iskanje, dodajanje v košarico, prijavo in tako dalje. Spremlja tudi hitrost spletne trgovine in o vsem tem lastnike spletne trgovine prijazno obvešča preko emaila.

Shoppimon.com – primer spletne trgovine

Shoppimon.com – Shopping Scenarios

WWW – non www | http in https

Zelo pomembno je, da so vse možne povezave preusmerjene na enotno domeno. Tako je vseeno, ali stranka zapiše http://grosbasket.com ali https://grosbasket.com, enako velja za www.grosbasket.com ali http://www.grosbasket.com oz. v primeru secure, https://www.grosbasket.com. Bodite pozorni, da izbrano shemo URL-ja uporabite tudi v ostalih povezanih datotekah / orodjih, npr. robots.txt, webmasters, shoppimon.com. Pri Magento je bug, kjer preusmeritev naredi preko 302 headerja in ne 301. Na sliki spodaj rešitev, ki jo je treba dodati v .htacess.

Magento – 302 – 301 bug – fix

Avtomatska preusmeritev www – non www

Preverite prisotnost Google Analytics ter ustvarite filtre za različne jezike

V Magento je potrebno vnesti le Google ID oz. UA kodo. S tem se avtomatsko vklopi Google Analytics + Ecommerce sledenje. Pomembno je, da se v analitiki vzpostavi pravilne filtre za različne države.

Google Analytics – Ecommerce – Magento

Obvestilo glede davčnih blagajn

Priporočamo, da obvestilo glede davčnih blagajn prikažete pri obvestilu o uspešni oddaji naročila. Več o davčnih blagajnah si lahko preberete tudi v našem blogu članku.

Obvestilo glede davčne blagajne

Preveriti Newsletter (mailchimp) povezavo

Najbolj popularna izbira za Newsletter orodje je Mailchimp. Magento omogoča sinhronizacijo za prijavo, odjavo. Magento omogoča tudi prijavo na e-novice ob oddaji naročila, kjer je možnost, da je kljukica za prijavo že obkljukana. Preverite pogoje poslovanja in trenutna pravila glede prijave na e-novice, ki se stalno spreminjajo.

Če imate različne jezike, je treba te jezike povezati na različne liste.

Prijava na e-novice

Mailchimp – različne liste – različni jeziki

Obvestilo o piškotkih

Preverite, ali se prikaže obvestilo o piškotkih ter ali je možno, da je do spletne strani, kjer so piškotki obrazloženi, možno dostopati tudi izven obvestila. Preverite tudi prevode za različne jezike, če jih imate.

Piškotki – dostop v nogi

Cookies – CMS Pages

Preverite različne jezike / dostave / plačila

Za vsak jezik / državo je običajno določena drugačna poštnina, ime pošte/dostave. Enako velja tudi za plačila. Preverite, če so vsi prevodi OK ter če je cenik za dostavo pravilen za vse države in robne primere znotraj držav, npr. otoki na Hrvaškem, Italiji. Preverite tudi brezplačno dostavo, če jo imate. Običajno se višina zneska za brezplačno dostavo razlikuje glede na jezik oz. izbrano državo.

Npr. če je izbrana druga država kot Slovenija in Hrvaška, ni izpolnjen pogoj za plačilo po povzetju in zato ta možnost ne sme biti na voljo. Običajno je cena dostave za poštne številke s hrvaških otokov višja.

Različne dostave – prevodi glede na jezik

Uvoz – izvoz cenika za dostavo – različne države

Pregled emailov – konfiguracije

Preverite, kam gredo emaili za nova naročila, odprtje računa, kontakt in tako dalje. Če ste zamenjali ponudnika in ohranili prejšnjo konfiguracijo oz. ste konfiguracijo uvozili iz prejšnje trgovine, preverite, da ni v konfiguraciji ostal še kakšen email iz bivšega ponudnika spletne trgovine.

Nastavitve za pošiljanje emailov

Hitrost spletne trgovine

Preverite hitrost spletne trgovine, Cache / Indexing ter .htacess nastavitve. Ali je omogočen gzip, css compression (JS ne priporočamo!)? Testirajte Google Page Speed ter Gtmetrix. Kako optimizirati Magento, lahko preberete v našem blog članku Optimizacija hitrosti spletne trgovine na Magento Community platformi (front-end in administracija).

Grosbasket.com – optimizirane slike

google-analytics-grosbasket.com_-1024x696

Mirasvit čas shranjevanja produkta

mirasvit-asynchronous-reindex-čas-shranjevanja-produkta

Povezanost orodij

Google Analytics je le začetek. Preverite, ali je povezan Google Webmaster tool, prisotna FB pixel skripta (če oglašujete na FB) ter Google Tags oz. Adwords conversion page. Več o analitiki si lahko preberete Je bolje imeti tehnično dovršeno spletno trgovino ali vpogled v analitiko/statistiko v spletni trgovini?

Google Conversion Code

Funnel Visualization

Preverite statuse glede na stanje naročila

Preverite, kakšni emaili pridejo do strank. Npr. ob kreiranju računa (my account), pozabljeno geslo, novo naročilo, posodobljeno naročilo s statusom. Emaile je treba preveriti tudi za ostale jezike, ki jih imate na spletni trgovini.

Primer emaila – novo naročilo

Primer emaila – potrditev naročila

Različni statusi glede na stanje naročila

GEOIP – preusmeritev obiskovalcev glede na IP

Če imate urejen GEOIP modul, ki preusmeri obiskovalce na pravilno državo/jezik oz. spletno trgovino (store view v Magento), je pomembno, da testirate različne IP-je ter kako delujejo preusmeritve. Preverite tudi, kaj se zgodi, če slovenski link (povezavo) pošljete nekomu na Hrvaškem. Treba je testirati tudi http://www.naslov brez jezika (npr. le ekwb.com/shop brez /en na koncu URL-ja)

V primeru, da imate že v teku oglaševalske akcije in URL do trgovine, je treba urediti tudi povezave. Pri Magento je treba urediti preusmeritev iz default URL na URL od privzete trgovine (default store).

GEOIP – preusmeritev glede na IP – Canada

GEOIP – preusmeritev glede na IP

Bannerji – homepage

Še tako lepo spletno trgovino lahko slabi bannerji zelo pokvarijo. Investirajte v .psd banner template, ki vam ga pripravi vaš oblikovalec, in bo usklajen z obliko vaše spletne trgovine.

PSD Banner template

Kontaktni obrazec + ostali obrazci

Najbolj pomembno je, da je kontaktni obrazec pregleden in vsebuje vse potrebne informacije, ki jih stranka potrebuje, ko vas želi kontaktirati. Preverite tudi ostale obrazce, npr. Oddaj povpraševanje, če jih imate na svoji spletni trgovini. Najprej preverite vsebino in obliko ter nato pošljite testni email/povpraševanje. Je email prišel na pravi naslov?

Dodatni obrazec – preverite dobavljivost

Kontaktni obrazec

Links checker + image checker

Preverite, ali imate slike za npr. vse proizvajalce, barve ter za ostale atribute, ki jih vežemo na določeno sliko. Preko links checker lahko preverite, kateri linki ne delujejo. Priporočamo orodje Wc3 checklink.

Link checker

Preverite-vse-slike-vaših-proizvajalcev-1024x249

Favicon, wc3 html in css validacija ter pred-pripravljen css za tiskanje

Favicon (npr. EKWB favicon), wc3 html in css validacija ter pred-pripravljen css za tiskanje (minimalen videz – print style sheet link) so malenkosti, ki pa jih je dobro imeti urejene. Wc3 html validacija naj služi kot pregled najbolj kritičnih napak in ne obsesivno programiranje, dokler ne dosežete 0 (nič) errors / warnings.

Footer

Preverite, ali imate vse potrebne informacije podane v vaši nogi. Npr. ikone kreditnih kartic oz. možnih načinov plačila, pogoji poslovanja, kontakt ter o podjetju/o nas. Kako rešujete podporo, FAQ ter postopek vračila izdelkov (RMA)? Ste prisotnih na družabnih omrežjih (FB, Twitter, G+, …)? Ne pozabite na e-novice (prijava) ter kakšno spodbudo, npr. kupon za 10 € v primeru prijave.

Pricaraj.si footer

Grosbasket footer

EKWB Shop footer

PDF dokumenti – računi/predračuni/dobropis

Če uporabljate dokumente, ki jih kreira spletna trgovina, preglejte, ali ustrezajo vsem pravilom zakonodaje. Preverite, kako so videti, ko jih natisnete. Priporočamo Magestore PDF Invoice Plus.

Pregled tiskanja PDF dokumentov

Kontaktirajte nas – klepet v živo

Imate omogočen klepet v živo? Preverite, ali ima vaša podporna ekipa nameščene programe, ki so potrebni za vzpostavitev komunikacije med stranko (obiskovalec na spletni trgovini) in zaposlenim na podpori. Preverite, če je možno zgraditi FAQ bazo iz ponavljajočih se vprašanj. Preverite, kaj se zgodi, ko vaša podpora ni na voljo in ali vprašanje, ki ga obiskovalec pošlje, pride na pravi e-mail naslov.

Live Chat

EKWB – FAQ

Atributi – filtriranje in razvrščanje po

Preverite, ali je vrstni red atributov pri pasu za filtriranje ustrezen. Prav tako preverite, po katerih atributih je možno razvrščati. Pazite, da imate način poimenovanja atributov vedno enak (npr. Cena, Naziv, Hitrost in ne CENA, hitrost, naziv).

Nastavitev atributov

Atributi – razvrščanje po

Filtriranje – atributih

Blog dodatek

Imate blog? Ste preverili, da ste vnesli pravo vsebino? Dodelite nekoga, ki bo stalno skrbel za svežo vsebino, drugače je bolje, da blog ukinete, kot da je po 2 letih datum objave in število blog člankov enako, kot je bilo ob splavitvi spletne trgovine.

EKWB – primer dobrega bloga

Nakup za podjetja?

Želite omogočiti nakup za podjetja? Obvezno dodajte polja, ki so potrebna. V primeru, da imate prodajo v IT, je treba dodati ustrezno IVA polje (IT davčno polje). Preglejte zakonodajo, kako je glede poročanja davkov pri poslovanju z ostalimi državami (HR, IT). V primeru, da želite avtomatsko dodeljevanje strank v posebne skupine strank (ki imajo dodaten popust – npr. B2B) preverite TAX validation nastavitve.

Labels, tags in popusti

Preverite, ali so v trgovini prisotne vse značke, tags oz. vrste popustov, ki jih želite poudariti. Npr. produkt meseca, najbolj prodajano, novo, akcija in tako dalje.

Značke, labels, tags

Title, meta title, meta description …

Če imate v ponudbi zakupljeno tudi on-site SEO optimizacijo, bo večino dela opravila agencija. Skupaj preverite, ali je bilo delo opravljeno in tiste najbolj pomembne spletne strani (homepage, category page, product page) preverite skupaj.

Cross browser testiranje

Vsak razvijalec ima svoj izbrani brskalnik. Večino časa razvija in testira prav v svojem izbranem brskalniku. Zato je zelo pomembno, da spletno trgovino pregledamo tudi v vseh ostalih brskalnikih. Agencija Optiweb ima svoj interni testni proces, kjer preverimo delovanje v brskalnikih IE9, FF, Chrome, Safari in Opera.

Mobilna verzija

Preverite Mobile User Experience ter kako se zadeva prikazuje na različnih mobilnikih/tablicah. Če delate prenovo oz. imate vpogled v promet obiskovalcev, si s podatki z Google Analyticsa pomagajte, na katere vrste mobilnikov se še dodatno osredotočite. Če teh podatkov nimate, se osredotočite na glavne resolucije: 320px, 480px, 768px, 960px. Vsekakor vam ne priporočam obsesivnega testiranja vseh možnih variant, verzij in izpeljank mobilnikov, saj je tega preprosto preveč. Pomagajte si z aplikacijo MobileTest.me.

Mobile User Experience

Barve gumbov pomembnih CTA akcij

Oddaj naročilo, registracija in podobni glavni CTA gumbi naj bodo prijetno obarvani in dobro vidni.

Pomembni CTA gumbi

Specifične stvari, ki so vezane na projekt

Zgoraj naštete postavke so osnova za dobro spletno trgovino. Ostanejo vam še stvari, ki so vezane na projekt.

Pošiljate stranki tracking kodo, s katerim omogočite sledenje paketom?
Imate nastavljen minimalni znesek za naročilo? Preverite, ali deluje.
Imate Youtube oz. video vsebino, deluje?
Kako je z uvozi, so ročni ali avtomatski? Delujejo?
Ste preverili povezave z ostalimi sistemi, npr. ERP/računovodstvo? Ste “test” mode spremenili na “live”?
Ste glavnim artiklom dodali povezane artikle? Delate to ročno ali avtomatsko preko uvoza?
Preverite specifične Magento nastavitve – dober seznam najdete na IM forumu, @De_Tomaso avtor

Smo zaključili?

Ko smo spletno trgovino uspešno pre-testirali in objavili, gremo lahko na naslednji korak. Spremljanje analitike in marketing.

Bonbonček. Ne pozabite iskalnika povezati z Google Analytics ter čez čas preverite, kaj ljudje iščejo, katere iskalne rezultate lahko uporabite za sinonime. Več o tem preberite v ločenem blog članku.

Dodatne informacije o testiranju spletnih trgovin pa lahko najdete tudi na Googlu-u. Pre launch checklist.

Kot vsaka stvar, tudi testiranje lahko traja v neskončnost. Znotraj vsakega segmenta (CSS; Design, Navigacija) najdemo še ločene sezname kaj je dobro preveriti. Dober seznam seznamov najdemo na smashingmagazine.com.

Rok Meglič

You won’t find Rok in our offices anymore, but we know that no matter where he is now, he is doing a phenomenal job. We’ve kept a piece of them with us as a memory. :)