Prednosti i nedostaci upotrebe vrtuljka

Pregled sadržaja

Surfajući web stranicama sigurno ste naišli na stotine raznih vrtuljaka koji vam žele prezentirati najbolju ponudu i usluge. Vrlo vjerojatno su vam se i svidjeli. To je nešto što pretvara dosadne stranice u zanimljive i cool jer se nešto događa, animira, stvara se upečatljiv dojam kod posjetitelja. Vrtuljci su izuzetno popularni i doživjeli su pravi procvat krajem prošlog desetljeća. Ali oni ipak nisu posve najbolje rješenje u svakom slučaju. U članku ćemo pokušati razjasniti koje su njihove prednosti i nedostaci te kako napraviti rješenje koje će obuhvatiti najbolju praksu njihovog korištenja.

Što je vrtuljak

Vrtuljak ili eng. carousel, slider je vrsta interaktivne komponente koja animira pregled nekoliko elementa na manjem prostoru. Unutar njegovog modula najčešće je vidljiv samo jedan element a na neku interakciju korisnika (klik gumba u obliku strelice ili brojeva paginacije) na isto mjestu pojavi se idući element a prethodni se sakrije. Vrtuljci su često mjesta za animacije i efekte te postižu određeni “wow” efekt zbog čega ih rado vole autori postavljati na web stranicama.

Sama riječ vrtuljak možda neobično zvuči ali tako se službeno prevodi, definiciju vrtuljka koju možemo pronaći na Hrvatskom jezičnom portalu te glasi: “uređaj sa sjedalima, običnima i u obliku životinja itd., koji se okreće na mjestima određenima za zabavu; ringlšpil”. Drugi hrvatski naziv za vrtuljak može biti i klizač a često je i u upotrebi riječ “slajder” (eng. slider).

Vrtuljak nam omogućuje da na jednom mjestu postavimo veću količinu informacija. Najčešća pozicija je uvodni dio stranice, iznad prijeloma stranice a posebice na početnoj stranici. Služi prvenstveno da bi privukao pažnju korisnika na način koji je vizualno primamljiv ali njegova upotreba nosi također i jedan niz negativnosti. Negativna strana upotrebe vrtuljka je da njegove stope konverzije su vrlo niske. Malen postotak korisnika klika za pregled drugih artikla unutar vrtuljka.

Prednosti vrtuljka

Prednost vrtuljka je stvaranje dobrog vizualnog dojma kod korisnika. Nešto se događa, slike se mijenjaju animacijom, tekst se pojavljuje i nestaje pomoću glatke tranzicije blijeđenja. Dobro ih je postaviti tamo gdje ih ljudi očekuju.

Vrtuljci su ok za sadržaj koji je vizualan, dakle, kada ne sadrži informacije i detalje koji su potrebni korisniku već se samo želi postići dobar vizualni dojam za prosječnog posjetitelja. Mogu biti dobri za web stranice koje su orijentirane na dnevne vijesti dok stranice orijentirane na prodaju neće imati puno koristi.

Dizajn vrtuljka ne treba biti loše rješenje ako se koristi na ispravan način i na dobrom mjestu.

Nedostaci vrtuljka

Vidjeli smo neke prednosti pa nam se stvara pitanje, koje su im mane? Iako su iznimno popularni, vrtuljci ne dolaze bez nedostataka koji, ovisno o situaciji, mogu biti prijelomni za odluku.

  • može izgledati kao da je oglas što dovodi do toga da ga korisnici ignoriraju
  • vrtuljci mogu biti negativno utjecati na digitalnu pristupačnost, posebno u slučajevima kada korisnici imaju problema s motoričkim vještinama ili kod poteškoća čitanja
  • često je da se vrtuljak automatski promijeni nakon kraćeg vremena što znači da se pomakne prije nego korisnik stigne pročitati ono što piše
  • s obzirom na to da su elementi sakriveni, korisnik lako može propustiti sadržaj

Što ako je vrtuljak loše rješenje ali klijent ipak ustraje na njemu? Jedan način je odgovoriti klijenta od takve implementacije a drugi način je dizajnirati i programirati ga tako da neće pokvariti korisničko sučelje. Ako vrtuljak ne ostvaruje klikove, što možemo pratiti različitim tehnikama, imamo argumente za njihovu zamjenu za nešto drugo.

Vrtuljci su često na samom vrhu uvodnih sekcija koje su iznimno bitne radi stvaranja početnog visokog pozitivnog dojma o web stranici (a time i o tvrtki) no njihova ideja može stvarati zbunjenost. Obično bi na početku trebalo imati jednu jasnu poruku koju bi ciljana publika trebala lako shvatiti. Ako na ovo mjesto dođe mnoštvo različitih elemenata unutar vrtuljka, shodno time sekcija postane natrpana s različitim idejama, povećava se vjerojatno da korisnici neće razumijeti što tvrtka radi a kako smo spomenuli i gore, stope konverzije neće biti toliko efikasne.

Svjedočili smo i pojavi trenda koji je diktirao postavljanje vrtuljka na web stranicu tako da se članak podijeli u nekoliko sekcija i korisnik treba kliknuti da bi čitao iduću. Takvim rješenjem nastojalo se korisnika duže zadržati na stranici i da rezultira većom stopom klika, međutim, konačan ishod je da stvara nepoterbno i mukotrpno korisničko iskustvo. Takva rješenja treba zaobilaziti u širokom luku. Uvijek treba dizajnirati i programirati za korisnika a ne za tvrtku koja želi da se radi web stranica. Korisnici, njihove želje, mogućnosti i interesi trebaju biti od najveće važnosti.

U konačnici, negativnih strana ima te se postavlja pitanje isplati li se koristiti ga. Upotreba vrtuljka znači i dodatne skripte koje preglednik treba preuzeti i procesuirati za rad što nam mrvicu može štetiti brzini otvaranja stranice i optimizacije.

Implementacija vrtuljka i najbolje prakse

Implementacija vrtuljka dolazi s nekim dobrim i lošim stranama na koje je potrebno obratitit pozornost. S jedne strane, potrebno je paziti da se komponenta odradi optimizirano kako ne bi usporila web stranicu elementima koji nisu vidljivi na ekranu ili značajnim skriptama koje korisnici moraju preuzeti na računalo i potom ih preglednik treba obraditi.

Potrebno je izbjeći automatsku reprodukciju

Veliki problemi kod vrtuljka proizlaze iz toga što je omogućena automatska reprodukcija na idući element nakon kratkog vremena. Studije Nielsen Norman grupe (koja je svjetski lider u istraživanjima korisničkog iskustva na web stranica) su pokazale da takva funkcionalnost nije poželjna na stranicama. Korisnik nema potpunu kontrolu i ako je krenuo gledati trenutno aktivni element vrlo vjerojatno ne želi da ga se ometa u tome promjenom na nešto drugo. Loše je i za osobe s motoričkim poteškoćama jer ne stignu reagirati u definirano vrijeme. Također, neki korisnici mogu pretpostavljati da se radi o reklami te čitavu sekciju naprosto ignoriraju.

Jedan od načina kojim se želi pribjeći tome je kada korisnik prijeđe mišem preko vrtuljka tada se reprodukcija pauzira. Takav način rada neće u potpunosti riješiti problem, dobar je jedino kada se web stranica gleda na stolnom računalu a dobrim dijelom korisnici niti ne prelaze mišem preko vrtuljka.

Stoga je jedino dobro rješenje isključiti automatsko pokretanje vrtuljka i prikazati iduće elemente samo kada ih korisnici zatraže. Ako se ipak koristi automatska reprodukcija, tekst treba biti izrazito kratak ili ga izostaviti.

Obavezno je korisniku potrebno omogućiti kontrolu

Nedostatak kontrole na bilokojem segmentu web stranice dolazi do frustracije korisnika. Dva su načina kojima dajemo kontrolu korisnicima a vrlo često koriste se oba:

Navigacija pomoću strelica

Strelice koje omogućuju kretanje elemenata naprijed-nazad. Klasičan način je da lijeva strelica ide prema zadnjim elementima a desnom strelicom kreta se prema naprijed. Ali nije nužno, vizualno se mogu pozicionirati kako se žele, mogu slobodno biti i jedna pored druge. Bitno je samo da strelice rade u zadanim pravcima dok je obrnuto za slučaj kada su web stranice rađene na stranim jezicima gdje se čita s desna na lijevo, poput hebrejskog ili arapskog.

Kada više nema elemenata a korisnik i dalje klika prema naprijed tada se obično vrtuljak resetira na početnu poziciju.

Navigacija pomoću odabira elementa

Odabir elementa može biti definiran na različite načine. Jedan je pomoću točkica, to su obično kružići kao redni brojevi i svaki kružić klikom fokusira element tog rednog broja. Red je da se aktivni element uvijek označi vizualno drugačije, primjerice, tako da se kružić ispuni dok su ostali kružići neispunjeni bojom tj. transparentni. Isti princip može se postaviti pomoću brojeva ili pomoću malih sličica (thumbnailova) ili naziva elementa, ovisno o grafičkom dizajnu i kreativnosti.

Vrtuljak mora biti prilagođen za uređaje na dodir

Prirodno je da se na vrtuljku može prijeći prstom prema lijevo ili desno kako bi se pokrenuo prethodni ili naredni slajd. Takva funkcionalnost obavezna je za mobilni i tablet uređaje ali kad je već tu, nije naodmet da postoji i na stolnim računalima.

SEO

Radi optimizacije web stranice za tražilice, treba obratiti pažnju na prikladnu upotrebu heading naslova te ako nam je početni slajd <h1> oznaka, tada treba učiniti da naredni slajdovi neće imati istu oznaku jer je potrebno da stranica ima unikatni primarni naslov.

Sažetak

Možemo se zapitati, želimo li kod korisnika postići jači vizualni efekt ili veću funkcionalnost i konverzije. U svakom slučaju, izbor nam je velik i web stranica može biti napravljena na razne načine. Trend u svijetu je da vrtuljci gube na važnosti i tvrtke kojima je stalo do dobrog korisničkog iskustva traže alternative. Kako je na vašoj web stranici i na stranicama koje posjećujete?