Intuitivan UX/UI design, kvalitetan content i dobra SEO optimizacija temelj su korisničkog iskustva najboljih web stranica. To su ključni elementi koje treba sadržavati dobra web stranica.

 kvalitetna web stranica

Znate li da oko 60% današnjih kupaca, čim sazna za zanimljiv proizvod ili brand, odmah o njemu traži informaciju na internetu? Upravo je stoga važno imati kvalitetnu web stranicu koja će korisnike informirati o vašim uslugama i osobnosti vašeg branda te ih potaknuti na interakciju.

Ako već imate web stranicu, prođite kroz našu listu 7 esencijalnih elemenata dobre web stranice te saznajte imate li stranicu koja je dizajnirana za uspjeh. A ako tek planirate krenuti u izradu svojeg weba, poslužite se ovim člankom kao korisnim vodičem ili kontaktirajte naše stručnjake za izradu web stranice koji će vam pomoći kod njenog osmišljavanja i dizajna.

Također, prije nego što krenete s izradom, važno je da uspostavite odličnu suradnju i koordinaciju između vaših stučnjaka za UX/UI design, kreatora contenta te specijalista za SEO optimizaciju web stranice.

#1 Pregledna i intuitivna navigacija

Prvi dojam je najvažniji. Procjene stručnjaka kažu da je posjetitejima potrebno samo tri do petnaest sekundi da odluče sviđa li im se neka web stranica te žele li ostati na njoj.
Zato je važno da navigacijski meni na vašoj web stranici učinite dizajnerski preglednim te jednostavnim za rukovanje. Klasični meni s rubrikama koje se nalaze u gornjem dijelu web stranice dobro je rješenje.

Takav meni sadržaje čini preglednim te daje osnovnu orijentaciju korisniku. No takav dizajn može progutati prostor na web stranici i postati nezgrapan, posebice ako korisnici vašoj web stranici pristupaju putem mobitela.

Dobro rješenje je tzv. harmonika koja u vidu elegantne interaktivne ikone sažima u sebi sve rubrike vaše stranice. Kada se ekspandira, harmonika daje dojam visoke organiziranosti, pa je koristite kada god to možete. Harmonika se u engleskoj terminologii naziva hamburger, a na sljedećoj slici vidimo neke njene dizajnerske varijacije:

 web 002

Izvor: 10+ Hamburger Menu Examples [CSS Only] (alvarotrigo.com)

Dobra intuitivna navigacija podrazumijeva jasnu preglednost te omogućava spontano kretanje korisnika kroz web stanicu. Stoga sve rubrike vašeg weba organizirajte hijerarhijski kako bi korisnici znali gdje se što nalazi. Kako savjetuje Nate McGuire na Mayven blogu: “Zapamtite da korisnici očekuju samo nekoliko stvari od dobre web navigacije: znanje o tome gdje se nalaze na web stranici, put za povratak i smjerove u kojima se mogu kretati”.

Odličan dodatak glavnom meniju je i prozorčić za pretraživanje sadržaja koji svakako uključite kako bi korisnici pronašli prečicu do traženog sadržaja na webu.

Još jedan bonus savjet: koristite pravilo 3 klika, tj. načelo po kojem korisnik traženu informaciju na vašem sajtu može pronaći u svega tri klika mišem. Sve više od toga opterećuje korisničko iskustvo te uzrokuje povećanje bounce ratea vaše stranice (tj. mjere koja u postocima izražava stupanj odlaska s web stranice). 

#2 Glavni headline stranice, naslovna fotografija ili video

Već smo istaknuli važnost prvog dojma, a uvodni headline te naslovna fotografija ili video na web stranici najjače su oružje kojim ćete zadržati pažnju vaših posjetitelja.

Dobar glavni headline jasno će prenijeti informaciju o vašoj djelatnosti i o tome što nudite kupcu. Headline treba biti istaknut velikim fontom na što čišćoj pozadini kako bi bio uočljiv, a može ga podupirati kraći subline koji će donijeti dodatni opis onoga što nudite ili radite, koji su vaši proizvodi ili usluge te njihove prednosti za kupca.

 web 005

Izvor: Bedding, Bath Towels, Home Essentials & More | Miracle Made – Miracle Brand

Odličan primjer dobrog naslovnog headlinea i fotografije je web stranica branda Miracle koji prodaje atibakterijsku posteljinu i ručnike izrađene od specijalnih srebrnih niti. Jednostavnom, a snažnom prodajnom porukom “Oprostite se od prljavih plahti i ručnika” brand poručuje kupcima koji je glavni benefit njihova branda, a dodatnim sublineom pojašanjavaju kako njihova antibakterijska posteljina uklanja neugodne mirise te zahtijeva tri puta manje pranja nego obična. Naslovna fotografija s prizorom zadovoljne žene koja uživa u svježini Miracle ručnika podupire glavni headline.

Što reći za glavni vizual web stranice? Važno je da glavna fotografija bude što veća i upečatljivija. Ona treba ostavljati snažan dojam, potaknuti emocionalnu reakciju ili jasno prenijeti vrijednosti branda. Odlična opcija je i atraktivni video u pozadini ili motion graphic animacija koja se vrti u loopu te galerija izmjenjujućih fotografija.

Ne zaboravite opremiti sve fotografije na vašoj web stranici, uključujući i onu naslovnu, alt-text naslovima kako biste sadržaj dodatno SEO optimizirali za bolje rezultate pretrage na Google tražilici.

#3 Stranica “O nama” s podacima o vašem brandu i proizvodima

Priznajte koliko ste do sada pročitali stranica s naslovom “O nama”? Vjerojatno vrlo mali broj. Razlog? Njihova duljina, prevelika količina teksta i suhoparan stil opisivanja branda te njegovih usluga.
Nasuprot tome, pogledajte primjer američke web stranice Wild Fork koja na intrigantan način opisuje smrznuto meso kojeg imaju u svojoj ponudi:

web 001

Izvor: Our Story – Wild Fork Foods

Lekcija koju možemo naučiti od Wild Forka je sljedeća: opišite svoj brand i vašu djelatnost intrigantnim riječima (oni su se poslužili efektnim izrazom “blast freezing” i time se odmaknuli od konkurencije).

Također, opremite stranicu upečatljivim vizualnim stilom. Uključite efektne ilustracije i infografike, dodajte stranici video sadržaje i zanimjive brojčane pokazatelje.

Prenesite osobnost branda, zadovoljstvo vaših zaposlenika što rade u vašoj tvrtki, istaknite sve vaše posebnosti sa što manje dosadnih sadržaja, ali sa što više stila.

Zaboravite na rečenice tipa: “Osnovani smo te i te godine, s jasnom misijom da…” Kupce ne zanima vaša misija i vizija ako to ne možete demonstrirati neposredno i bez suvišnog propovijedanja.

#4 Poziv na interakciju preko CTA gumba

Glavni smisao vaše web stranice nije samo informiranje kupca o brandu ili proizvodima, nego i poticaj na (inter)akciju, pogotovo ako je vaša web stranica ujedno i web shop. A da biste postigli željenu interakciju s kupcem ili zaključili prodaju, obavezno postavite call to action, odnosno CTA gumb, na vašu stranicu.

To može biti zgodan, grafički uokviren, klikabilni gumb s pozivima tipa “Saznajte više”, “Kontaktirajte nas”, “Naručite besplatni uzorak”, “Ostvarite popust”.

Prema nekim stručnjacima za digitalni marketing u headeru vaše web stranice svakako trebate imati jedan CTA gumb (npr. onaj za uspostavu kontakta ili postavljanje pitanja), te dodatni u donjem dijelu stranice (footeru) kako biste još jednom potaknuli posjetitelja na interakciju dok skrola po vašoj stranici.

Nastojte i kod kreiranja akcijskog CTA gumba biti originalni kako biste ostvarili interakciju. Ako na primjer želite pozvati posjetitelje vašeg sajta da se pretplate na vaš newsletter, to vam neće biti jednostavno, budući da su korisnici zatrpani takvim pozivima. No malo originalnosti izdvojit će vas od drugih.

web inline 3

Izvor: 50 Call-to-Action Examples You Can't Help But Click (hubspot.com)

Ugledajte se na kreativni primjer branda za kozmetiku Glossier. Umjesto klasičnog CTA gumba “Pretplatite se”, oni su kao poziv na pretplatu na njihov newsletter kreirali headline s natpisom: “Ubacite ovo u vaš inbox”, a na sam CTA gumb postavili su izraz “Ja sam za” koji je ostvario veliki broj klikova posjetitelja baš zaslugom nekonvencionalnijeg jezika i ležernijeg pristupa.

Gornji primjer pokazje da CTA gumb treba biti uočljiv i klikabilan, okružen praznim prostorom te biti u kontrastnoj boji u odnosu na okolne grafičke elemente.

#5 Istaknite benefite vaših proizvoda i preporuke kupaca

Vaša web stranica glavno je mjesto za informiranje kupaca o vašim proizvodima te njihovim prednostima. Ne oklijevajte ih istaknuti! Ako su primjerice vaši proizvodi ekološki ili su osmišljeni bez testiranja na životinjama, obavezno to istaknite. U jednom od naših prijašnjih Blogic članaka dali smo savjete o metodama za pisanje dobrih opisa proizvoda, pa primijenite i ta saznanja u vašoj praksi.

Informirajte jasno vašeg kupca o najjačim stranama vašeg proizvoda ili usluge. Poslužite se i tzv. “okidačima za uvjeravanje”. Prodajete li na primjer knjige, takav okidač je efektan sticker s natpisom BESTSELLER koji će zaintrigirati druge kupce da provjere zašto je baš ta knjiga toliko popularna.

Na stranicu obavezno dodajte i preporuke ili testimoniale vaših kupaca. Time gradite povjerenje s posjetiteljima vaše stranice te im dajete osjećaj da su dio veće zajednice. Preporuke drugih kupaca ili korisnika vaše usluge jasan su znak da su se i drugi uvjerili u kvalitetu vašeg proizvoda te da nema bojazni da proizvod ne naruče baš od vas.

web inline 4

Izvor: Sales & Marketing Automation Software and CRM | Keap®

U idealnom slučaju preporuke, odnosno testimoniali, trebaju sadržavati stvarno ime i prezime vašeg kupca te efektan citat. A kako pokazuje gornji primjer CRM tvrtke Keap, dobro je koristiti grafičke ikonice s pet zvjezdica koje postaju dodatan “proof of value” o vašem proizvodu.

#6 Informacija o kontaktu

Iz prethodnih elemenata dobrog web dizajna, kupci će saznati tko ste, što nudi vaš brand i što drugi misle o vama. No pored toga, važno je da kupci mogu brzo s vama stupiti u kontakt kako bi vam poslali upit, narudžbu ili zatražili dodatnu inofrmaciju.
Nate McGuire stoga savjetuje da ugradite link za kontakt u header web stranice, tj uz glavni navigacijski meni u vidu CTA gumba “Kontaktirajte nas”. Osim ove opcije, možete imati i posebnu podstranicu za kontakt na kojoj ćete imati formular kojeg kupci mogu ispuniti i poslati vam poruku ili upit. Donosimo vam odličan primjer web stranice Hubspot:

web 007

Izvor: Contact Us | HubSpot

Postoji dakako i treća opcija: u footer vaše web stranice dodajte grafički istaknut odjeljak za kontakt s vašom adresom, brojem kontakt telefona, e-mail adresom i linkovima na vaše social media kanale kako bi vas kupci mogli kontaktirati putem medija koji im je najzgodniji.

#7 SEO optimizacija sadržaja na web stranici

Kada lansirate novu web stranicu, možda je najteži dio zadatka dovesti posjetitelje na nju. Osim digitalnog marketinga, koji vam u tome može pomoći, važna je i SEO optimizacija sadržaja stranice koja donosi organski promet posjetitelja.

Stoga treba imati na umu da samo dobro optimizirani sadržaji dovlače “spontano” kupce do vašeg proizvoda ili usluge. Moderni SEO i HTML alati nude vam za optimizaciju mnoštvo opcija: od meta tagova i alt-tekstova do optimizacije putem ključnih riječi. Primijenite ih sve kako bi što više ljudi organski došlo na vašu web stranicu. Savjete o kvalitetnoj SEO optimizaciji web sadržaja pročitajte na ovom linku.

Bonus za kraj

Lista ključnih elemenata dobre web stranice ne iscrpljuje se samo na ovih 7 komponenti koje smo opisali u članku. Osim njih svakako obratite pažnju i na sljedeće:

  • Responsive dizajn stranice za pregled na mobilnim uređajima – ne zaboravite da golema većina današnjih posjetitelja na webu sadržajima pristupa preko pametnih telefona. Dizajn i stil vašeg contenta trebaju biti “mobile-friendly”.
  • Dizajn stranice neka slijedi identitet vašeg branda – potrudite se da je izbor fontova i grafike u skladu s identiteom vašeg branda kako biste izgradili bolji awareness o njemu.
  • Omogućite user-friendly iskustvo – neka posjetitelji vašeg web sajta s lakoćom skrolaju sadržaje i bez problema pronađu ono što žele.
  • Brzo učitavanje sadržaja – potrudite se da vaši web developeri razviju takvu stranicu koja se bez problema učitava. Važno upozorenje: čak 53% posjetitelja napušta stranicu ako je to učitavanje predugo!

Upoznali smo vas s temeljnim elementima dobre web stranice te se nadamo da ste spremni za lansiranje svojeg weba. A za upit i suradnju spremni su i naši stručnjaci koji vam mogu biti dobra podrška u tome! 

Izvori:

10 Crucial Elements for Any Website Design - Top Digital Agency | San Francisco & Austin (mayvenstudios.com)
https://uxplanet.org/5-crucial-ui-ux-design-elements-for-homepages-2129c9bf9470
12 Critical Elements Every Website Homepage Must Have [Infographic] (hubspot.com)

Izbor radova