Nitko ne napušta vašu web stranicu misleći "korisničko iskustvo je bilo ispod standarda." Jednostavno odu. Kliknu dalje, odbiju se, odu konkurentu. A vaša analitika pokazuje liniju koja ide u krivom smjeru bez da vam govori zašto.
To je lukava stvar s UX-om. Kada je dobar, nitko ne primjećuje. Kada je loš, nitko vam ne kaže. Samo nestanu.
Što UX zaista znači (ne buzzword verzija)
Korisničko iskustvo nije o tome da stvari budu lijepe. Radi se o uklanjanju trenja između posjetitelja i onoga što je došao napraviti.
Netko dođe na vašu stranicu tražeći vaš telefonski broj. Može li ga pronaći za manje od 5 sekundi? To je UX. Netko želi kupiti proizvod. Koliko klikova je između "želim ovo" i "gotovo"? To je UX. Netko čita vašu stranicu usluga na mobitelu dok se vozi autobusom. Može li to zaista pročitati? I to je UX.
Svaki nepotreban klik, svaka zbunjujuća oznaka, svaka stranica koja se sporo učitava je mali porez koji naplaćujete posjetiteljima. Naplatite dovoljno poreza i odu.
Pravilo 3 sekunde
Posjetitelji formiraju prvi dojam o vašoj stranici u otprilike 3 sekunde. U tom prozoru odgovaraju na tri nesvjesna pitanja.
"Jesam li na pravom mjestu?" Vaš naslov, hero slika i ukupni raspored moraju trenutno potvrditi da je to ono što su tražili.
"Izgleda li ovo pouzdano?" Čist dizajn, dosljedan brending, profesionalne slike. Zastarjeli dizajn signalizira zastarjelu tvrtku. Pošteno ili ne, tako ljudi razmišljaju.
"Što da napravim sljedeće?" Ako posjetitelj mora smisliti kamo ići, već ste izgubili dio njih. Put naprijed bi trebao biti očigledan bez razmišljanja.
Ne prođete li bilo koji od ova tri testa, vaša stopa napuštanja raste.
Navigacija: kostur vaše stranice
Navigacija je najzanemareniji UX element. Također je onaj koji većina stranica pogriješi.
Držite je jednostavnom. Sedam glavnih navigacijskih stavki je praktičan limit. Više od toga prisiljavate posjetitelje da skeniraju i odlučuju umjesto da kliknu i nastave. Padajući izbornici bi trebali biti jednu razinu duboki. Mega izbornici s tri ugniježđene razine su labirint, ne izbornik.
Koristite riječi koje ljudi zaista koriste. "Naša ponuda" umjesto "Usluge." "Baza znanja" umjesto "Blog." Pametne oznake nisu pametne kada posjetitelji ne mogu pronaći ono što trebaju. Koristite najočitiju, najjasniju, najopisniju riječ za svaku stavku navigacije.
Neka trenutna lokacija bude očita. Posjetitelji bi uvijek trebali znati gdje se nalaze u strukturi vaše stranice. Aktivna stanja navigacije, breadcrumbs, jasni naslovi stranica. Izgubiti se na web stranici je najbrži put do napuštanja.
Stavite važne stvari na prvo mjesto. Studije praćenja oka dosljedno pokazuju da prva i posljednja stavka u navigacijskoj traci dobivaju najviše pažnje. Stavite vaše najvažnije stranice tamo.
Brzina je UX značajka
Stranica kojoj treba 4 sekunde za učitavanje već je pala na UX testu. Nije važno koliko je lijepa kada se konačno pojavi.
Svaka sekunda vremena učitavanja značajno povećava stopu napuštanja. Nakon 3 sekunde, više od polovice posjetitelja je otišlo. Nisu vidjeli vaš prekrasan hero. Nisu pročitali vaš uvjerljiv tekst. Vidjeli su spinner za učitavanje i pritisnuli tipku za nazad.
Optimizacija brzine stranice je UX poboljšanje s najvećim utjecajem koje većina stranica može napraviti. Komprimirajte slike. Minimizirajte JavaScript. Koristite CDN. Postavite Cloudflare. Ovo nisu otmjena nadogradnja. To je osnovna higijena.
Provjerite svoju stranicu kroz Google PageSpeed Insights odmah. Ako je vaš mobilni rezultat ispod 70, tu počinjete popravljati stvari. Ne s redizajnom. S performansama.
Mobilni UX nije desktop UX smanjen
Preko 60% web prometa dolazi s telefona. Ipak, većina stranica je i dalje dizajnirana na desktopu, a zatim nespretno stisnuta na manje ekrane.
Dizajn za mobilne uređaje znači preispitivanje sadržaja za palce, ne miševe. Evo kako to izgleda u praksi.
Dodirne mete trebaju biti minimalno 44x44 piksela. To je Appleova smjernica i postoji jer ljudski prsti nisu precizni instrumenti. Sitni linkovi poredani jedan do drugog su stroj za frustraciju.
Horizontalno pomicanje je zločin. Ako bilo koji element na vašoj stranici uzrokuje horizontalno pomicanje na mobitelu, popravite to odmah. Tablice, slike, ugrađeni sadržaj. Sve mora stati u viewport.
Obrasci moraju biti minimalni. Svako polje koje dodate u mobilni obrazac gubi vam prijave. Tražite apsolutni minimum. Ime, e-mail, poruka. To je to za kontakt obrazac. Ostalo možete pitati kasnije.
Testirajte na stvarnim uređajima. Razvojni alati preglednika su korisni za brze provjere. Ali ništa ne zamjenjuje držanje telefona u ruci i pokušaj korištenja stranice. Probleme ćete pronaći za 30 sekundi koje biste u simulatoru zauvijek propustili.
Hijerarhija sadržaja: vodite pogled
Vaši posjetitelji ne čitaju vašu web stranicu. Skeniraju je. Istraživanje praćenja oka pokazuje F-uzorak: preko vrha, niz lijevu stranu, s povremenim horizontalnim prelascima kroz sadržaj.
Dizajnirajte za skeniranje, ne za čitanje.
Koristite zaglavlja agresivno. Svako pomicanje trebalo bi otkriti novo zaglavlje koje skaneru govori o čemu je ta sekcija. Ako netko pročita samo vaša zaglavlja, trebao bi i dalje razumjeti vašu stranicu. Ovaj princip je središnji za to što web dizajn zaista jest i zašto nadilazi puko uljepšavanje.
Jedna ideja po odlomku. Dvije do tri rečenice. Zatim pauza. Dugački odlomci su zidovi od kojih se skeneri odbijaju. Kratki odlomci su odskočne daske koje vuku ljude kroz sadržaj.
Vizualna hijerarhija govori ljudima što je važno. Velik, podebljan tekst kaže "ovo je bitno." Manji, svjetliji tekst kaže "ovo je prateći detalj." Ako je sve iste veličine i težine, ništa se ne ističe i ništa se ne čita.
Koristite bijeli prostor velikodušno. Prostor između elemenata nije izgubljen prostor. To je prostor za disanje koji čini sadržaj probavljivim. Zbijeni rasporedi djeluju zatrpano čak i ako je sadržaj dobar.
Obrasci i CTA-ovi: gdje konverzije žive ili umiru
Svaki obrazac je pregovaranje. Tražite nečije vrijeme i informacije. Oni odlučuju je li ono što nudite vrijedno truda.
Smanjite polja na apsolutni minimum. Svako polje koje uklonite povećava stopu dovršetka. Trebate li zaista veličinu tvrtke na kontakt obrascu? Pitajte to na naknadnom pozivu.
Oznake idu iznad polja, ne unutar njih. Placeholder tekst koji nestaje kada kliknete stvara opterećenje za pamćenje. Posjetitelj upiše dva slova i zaboravi što je polje tražilo.
Poruke o greškama trebaju biti specifične i korisne. "Nevažeći unos" ne govori posjetitelju ništa. "E-mail adresa treba sadržavati @ simbol" govori im točno što popraviti. Pokažite greške pokraj polja koje ih je izazvalo, ne u traci na vrhu stranice.
CTA-ovi trebaju opisivati ishod. "Pošalji" je najlijeniji CTA na internetu. "Zatražite besplatnu ponudu" govori posjetitelju što se događa sljedeće. Dobre landing stranice žive i umiru po jasnoći svog CTA-a.
Kako mjeriti UX (bez pogađanja)
Ne trebate UX laboratorij. Trebate podatke i povremene provjere stvarnosti.
Google Analytics vam govori gdje ljudi odlaze. Visoke stope napuštanja na specifičnim stranicama ukazuju na UX probleme na tim stranicama. Kratko vrijeme na stranici znači da ljudi ne pronalaze ono što su očekivali.
Hotjar ili Microsoft Clarity (oboje imaju besplatne tierove) pokazuju vam toplinske karte i snimke sesija. Pogledajte 20 snimki stvarnih ljudi koji koriste vašu stranicu. Pronaći ćete probleme koje nikada niste zamislili.
Test od pet sekundi. Pokažite nekome svoju naslovnu stranicu 5 sekundi. Zatim pitajte: "Čime se ova stranica bavi?" i "Što biste prvo kliknuli?" Ako ne mogu odgovoriti na oboje, vaš UX treba rad.
Test bake. Može li netko s osnovnim računalnim vještinama navigirati vašom stranicom i ostvariti glavni cilj? Ako ne, previše je komplicirano. Ne radi se o pojednostavljivanju. Radi se o jasnoći. Ako vagete web dizajn nasuprot UI/UX poboljšanjima, ovaj test vam pomaže shvatiti koja disciplina treba više ulaganja.
UX kontrolna lista koja zaista vrijedi
Stanite prije sljedećeg redizajna i prvo revidirajte ove osnove.
Mogu li posjetitelji pronaći vaše kontakt podatke za manje od 5 sekundi? Učitava li se stranica za manje od 3 sekunde na mobitelu? Je li navigacija jasna i ograničena na 7 ili manje stavki? Imaju li svi gumbi i linkovi opisni tekst? Ima li svaka stranica jasnu svrhu i poziv na akciju? Može li se cijela stranica udobno koristiti na telefonu? Jesu li obrasci što kraći moguće? Ako želite strukturiran pristup reviziji ovih osnova, naša objava o 5 stvari koje svaka web stranica treba prolazi kroz svaku.
Ako ste na bilo što od ovoga odgovorili ne, popravite to prije nego dirnete bilo što drugo. Osnove pobjeđuju otmjene stvari svaki put.
Želite iskrenu procjenu korisničkog iskustva vaše stranice? Mi revidiramo web stranice i govorimo vam točno što funkcionira, što ne i što popraviti prvo. Počnite s besplatnom analizom web stranice.
