Breadcrumbs în magazinul online
Afișăm breadcrumbs în magazinul online? Răspunsul pe scurt este DA. Este necesar să afișăm breadcrumbs atât pe desktop, cât și pe dispozitivele mobile. Citește în continuare articolul să afli ce sunt breadcrumbs și de ce sunt importante atât pentru experiența utilizatorilor în magazinul online, cât și pentru motoarele de căutare.
Cuprins:
- Ce sunt breadcrumbs
- De ce sunt importante breadcrumbs pentru UX (experiența utilizatorilor)
- Tipuri de breadcrumbs pentru pagina de produs
- Cum implementezi breadcrumbs în magazinul online pentru dispozitivele mobile
- De ce sunt importante breadcrumbs pentru SEO?
- Concluzie
1. Ce sunt breadcrumbs?
Breadcrumbs sunt elemente de navigație secundară care indică locația vizitatorului în site. Acestea ajută la crearea unui user experience mai bun, dar și la SEO.
Câteva dintre avantajele principale ale breadcrumbs sunt:
- Încurajează și facilitează navigarea în magazin
- Reduc rata de respingere (bounce)
- Ajută la orientarea utilizatorilor în site
- Google le iubește, deci te vor ajuta și la indexarea în motoarele de căutare
În magazinele online, acestea sunt afișate, în general, pe pagina de produs și, opțional, în paginile de categorie. Nu se afișează niciodată pe pagina principală.
Ele au aspectul unor linkuri afișate orizontal. Sunt plasate în partea superioară a paginii, sub meniu/header și înainte de alte elemente din pagină precum imaginea de produs, denumire sau descriere. Pentru pagina de produs a unui magazin online de fashion acestea ar putea arăta așa:
Home – Femei – Încălțăminte – Balerini – Balerini de piele Geox
Utilizatorul poate da click pe elementele afișate în breadcrumbs pentru a naviga la niveluri superioare ale catalogului de produse. În exemplul de mai sus, poate da click pe Balerini pentru a trece de la pagina de produs la subcategoria din acesta care face parte. Astfel va vedea rapid toată oferta disponibilă pentru tipul de produs care-l interesează.
2. De ce sunt importante breadcrumbs pentru UX (experiența utilizatorilor)
Chiar dacă poate până acum nu le-ai acordat atenție, trebuie să știi că implementarea breadcrumbs în magazinul online va avea impact asupra:
- ratei de respingere (bounce)
- uzabiltății
- satisfacției vizitatorilor
- modului în care un utilizator va naviga pe site-ul tău
Afișarea breadcrumbs oferă o experiență mai bună pentru utilizator deoarece îl ajută:
Să se orienteze mai bine în ierarhia site-ului
Utilizatorii urăsc să se simtă dezorientați sau rătăciți. Cu ajutorul breadcrumbs ei își vor da seama mai ușor unde se află în magazin și unde ar putea să navigheze în continuare pentru a găsi produse de interes. Asta este în special util pentru cei care ajung pe direct pe paginile de produs din surse externe (căutări pe Google, campanii marketing etc.).
Să navigheze mai ușor și repede în magazin și să găsească produse relevante
Navigarea prin breadcrumbs este mult mai rapidă și necesită mai puțin efort decât navigarea prin accesarea meniului sau prin funcția de căutare. Asta pentru că numărul de acțiuni pe care un user e nevoie să le facă pentru a ajunge la o pagină de nivel superior se reduce semnificativ. Navigarea prin meniu, de sus în jos, implică mult mai mult efort și mai multe clickuri din partea utilizatorului.
Să navigheze ușor la pașii anteriori
De exemplu, vizitatorul poate să meargă de pe pagina de produs înapoi la rezultatele unei căutări, dacă site-ul are implementat și breadcrumbs bazate pe istoricul de navigare.
Exemplu de utilizare breadcrumbs în magazinul online
Să luăm exemplul de breadcrumbs din magazinul de fashion:
Home – Femei – Încălțăminte – Balerini – Balerini de piele Geox
Să zicem că un utilizator ajunge direct pe pagina produsului dintr-o căutare pe Google, dar realizează că modelul nu este ceea ce îți dorește. Fiindcă magazinul are implementate breadcrumbs, el poate da rapid click pe categoria Balerini din cadrul lor pentru a vizualiza întreaga ofertă de balerini disponibilă în magazin.
Alternativa ar fi fost să acceseze meniul principal și să parcurgă navigația de sus în jos. În acest caz, ar fi trebuit să-și dea singur seama unde ar putea fi incluși balerinii în ierarhia site-ului. Poate în acest exemplu nu este atât de dificil să-și dai seama, dar deseori utilizatorii nu știu cum să localizeze anumite categorii de produse.
O altă variantă ar fi fost să folosească funcția de căutare a site-ului pentru a găsi categoria de produse dorită. Din păcate, funcția de căutare lasă de dorit pe multe dintre magazinele online și nu afișează aceleași produse precum pagina de categorie. De cele mai multe ori, pe pagina rezultatelor unei căutări nu sunt disponibile nici filtrele pe care le ai disponibile la nivel de categorie, fapt care are impact negativ asupra experienței utilizatorului.
Realitatea este că, deseori, utilizatorii nu sunt dispuși să investească energia necesară pentru a găsi produsele dorite. Navigarea prin breadcrumbs este mai la îndemână și rapidă decât cea prin meniul magazinului sau utilizarea funcției de căutare. Acest lucru este valabil în măsură și mai mare pentru userii care navighează de pe dispozitive mobile. Pe telefon e dificil să navighezi, meniul este ascuns, iar orientarea în site se face mult mai greu.
3. Tipuri de breadcrumbs pentru pagina de produs
Există două tipuri de breadcrumbs de care magazinele online au nevoie:
Breadcrumbs bazate pe ierarhia site-ului
Acestea arată calea de la pagina pe care userul o vizualizează, înapoi înspre pagina principală, bazându-se pe structura de categorii a site-ului.
Ex: Home – Categorie Principală – Categorie secundară – Subcategorie – Produs
Cea mai frecventă utilizare a breadcrumbs este de a naviga un nivel în sus, de la pagina de produs la categoria din care acesta face parte. Astfel vizitatorul poate vedea rapid produse similare cu cel pe a cărui pagină se află.
Dacă nu sunt afișate breadcrumbs pe pagina de produs, vizitatorilor le va fi mai greu să navigheze în site, iar probabilitatea de a abandona site-ul crește. În schimb, afișarea breadcrumbs încurajează navigarea în magazin și vizualizarea unor produse similare cu cele pentru care userul și-a manifestat interesul.
Breadcrumbs bazate pe istoricul de navigare
Uneori utilizatorii aplică filtre la o listă de produse sau fac anumite căutări pe site. În acest caz, afișarea breadcrumbs bazate pe istoricul de navigare, ajută userii să se întoarcă de la pagina de produs la lista de produse filtrate sau la rezultatele căutării.
Acest tip de breadcrumbs sunt afișate pe pagina de produs ca un link de tipul Înapoi și chiar funcționează ca butonul de Back. Ele pot fi introduse fie înainte de breadcrumbs bazate pe ierarhia site-ului, fie la finalul acestora sau în proximitate.
Atenție însă – unele magazine implementează doar acest tip de breadcrumbs, renunțând la cele bazate pe structura site-ului, ceea ce reprezintă o greșeală. Deși sunt utile, ele nu pot înlocui navigația prin breadcrumbs bazate pe ierarhia site-ului.
4. Cum implementezi breadcrumbs în magazinul online pentru dispozitivele mobile
Testele de uzabilitate arată că, pe mobil utilitatea afișării breadcrumbs este și mai mare decât pe desktop. Asta se întâmplă din mai multe motive:
- Utilizatorii se orientează mai greu pe mobil deoarece elementele care încap pe ecran sunt mai puține, iar meniul nu este vizibil.
- Navigarea la categoriile dorite este mai dificilă și necesită mai multe clickuri și efort.
- Pe mobil userii își pierd răbdarea mai repede. Orice click în plus înseamnă efort în plus și timp de așteptare suplimentar până se încarcă pagina.
Cu toate acestea, unele magazine aleg să nu afișeze aceste breadcrumbs pe dispozitivele mobile din cauză că aglomerează interfața. Unele, chiar dacă le includ, aleg să afișeze doar anumite categorii pentru a reduce lungimea lor (ex. Categoria părinte din care face parte produsul). Această implementare nu este ideală deoarece nu se aliniază nevoilor și așteptărilor utilizatorilor.
Nu este recomandat să renunți la afișarea breadcrumbs pe dispozitivele mobile. Pentru a le implementa cu succes, fără să aglomerezi interfața inutil, există câteva detalii de implementare prin care le poți scurta.
Cum poți scurta breadcrumbs pentru mobile?
- Exclude din breadcrumbs pagina principală a magazinului (home) și denumirea produsului pe pagina căruia se află userul. Pagina principală poate fi accesată oricum accesând logo-ul site-ului, iar pagina produsului nu ar fi fost oricum un link care să poată fi accesat. De exemplu, în loc de Home > Femei > Încălțăminte > Pantofi Sport > Teniți > Teniși de piele Tommy Hilfiger poți afișa doar Femei > Încălțăminte > Pantofi Sport > Teniși. Testele de uzabilitate desfășurate de Baymard Institute arată că aceast mod de a le scurta nu afectează performanța în mod negativ.
- Dacă denumirea este prea lungă și după implementarea de mai sus, poți opta să le faci glisabile (swipeable). Astfel userii vor putea da swipe, dacă sunt interesați să navigheze utilizând breadcrumbs. Testele arată că, în practică, această abordare funcționează bine și nu creează probleme.
- Evită supra-categorizarea în magazinul online – mai exact să creezi mai multe categorii de produse decât este cazul. Acest sfat te va ajuta pe mai multe planuri, nu doar în navigația prin breadcrumbs. În general, trebuie să eviți să creezi mai multe categorii sau subcategorii decât este necesar. În schimb, e indicat să folosești filtre pe care userii le pot aplica pentru a reduce lista de produse și a le găsi pe cele relevante pentru ei. De exemplu, în loc să ai o subcategorie Rochii de plajă, poți avea un filtru în categoria Rochii, unde userii pot selecta atributul de plajă.
5. De ce sunt importante breadcrumbs pentru SEO?
Breadcrumbs indică motoarelor de căutare cum este structurat site-ul. Google a schimbat recent modul cum afișează rezultatele căutării și acum arată în loc de url-ul paginilor, fragmente din breadcrumbs. Acestea oferă informații mai utile pentru utilizatori decât url-urile care nu indică întotdeauna modul în care o pagină se încadrează în ierarhia site-ului.
Din Centrul pentru Dezvoltatori aflăm că Google folosește marcajul pentru breadcrumbs pentru a clasifica informațiile din pagină în rezultatele căutării.
Chiar și în Google Search Console a apărut un raport de date structurate dedicat special pentru Breadcrumbs. Acesta ajută administratorii de magazine online să identifice dacă sunt implementate corect sau dacă există erori.
Pe scurt, Google iubește breadcrumbs și încurajează utilizarea lor.
6. Concluzie
În concluzie, implementarea breadcrumbs în magazinul online îți va aduce beneficii multiple atât în ceea ce privește experiența utilizatorilor, cât și din punct de vedere SEO. Afișarea lor este utilă pe desktop, dar mai ales pentru userii care accesează site-ul de pe telefon, unde navigarea se face cu mai mare dificultate. Așadar, afișează-le și pentru dispozitivele mobile. Pentru a le scurta, folosește sfaturile de implementare de mai sus.
Următorii pași pentru a îmbunătăți experiența utilizatorilor în magazinul tău online
Ai un magazin online și vrei să transformi mai mulți vizitatori în clienți?
Află cum poți îmbunătăți experiența în magazinul tău online! Solicită un Audit UX și vei primi:
- o analiză amănunțită a paginilor și funcționalităților magazinului tău
- recomandări concrete pe care să le implementezi pentru a îmbunătăți rata de conversie și experiența pe care o oferi vizitatorilor
