Kad naručuješ web stranicu, dizajner će ti prije ili kasnije reći nešto poput \u201cstavimo CTA above the fold\u201d ili \u201ckoristimo skeleton loading dok se sadržaj učitava\u201d - i ako to ne razumiješ, teško možeš procijeniti ima li smisla ili ne. Evo pet pojmova koja se pojavljuju u gotovo svakom razgovoru o webu, objašnjena bez žargona.
Above the fold - ono što se vidi bez skrolanja
Above the fold je sve što posjetitelj vidi na ekranu čim otvori stranicu, prije nego išta skrola prstom ili mišem - naziv dolazi iz novina, gdje je \u201cfold\u201d bila linija presavijanja pa se najvažnija vijest stavljala iznad nje.
Na webu to znači da naslov, kratko objašnjenje čime se baviš i glavni gumb za akciju (poziv, kontakt, rezervacija) moraju stati u taj prvi pogled - istraživanja pokazuju da posjetitelji čak 57% vremena na stranici provedu gledajući baš taj dio, prije nego uopće odluče skrolati dalje.
Za tebe kao naručitelja to znači jednu konkretnu stvar: ako ti dizajner predloži da glavni poziv na akciju \u201cgurne\u201d niže na stranicu, pitaj zašto - u pravilu ga želiš gore.
Hero sekcija - tvojih prvih pet sekundi
Hero sekcija je veliki, upadljivi blok na samom vrhu stranice - obično slika ili video u pozadini, kratak naslov i jedan gumb. To je praktički isto što i \u201cabove the fold\u201d prostor, samo gledano kao dizajnerska cjelina, a ne kao mjerna jedinica.
Dobra hero sekcija u pet sekundi odgovara na tri pitanja posjetitelja: tko si, čime se baviš i što treba sljedeće kliknuti. Ako posjetitelj mora skrolati da bi shvatio o čemu se radi, hero sekcija nije odradila svoj posao.
F-pattern - kako oči stvarno čitaju stranicu
F-pattern (F-obrazac) opisuje kako ljudi pogledom prelaze preko stranice s puno teksta: prvo pročitaju cijeli vrh vodoravno, zatim malo niže još jednom vodoravno ali kraće, a onda pogled klizi okomito niz lijevu stranu, hvatajući samo početke redaka. Slovo koje ta putanja crta na ekranu doista podsjeća na slovo F.
"Zato su najvažnije riječi uvijek na početku rečenice ili naslova, nikad zakopane na kraju - jer velika je šansa da će posjetitelj pročitati baš taj prvi dio i preskočiti ostatak."
Praktična posljedica za tebe: kratki, jasni podnaslovi i naslovi koji sami po sebi nešto govore (ne \u201cNaše usluge\u201d nego \u201cIzrada web stranica za male obrte\u201d) rade puno bolje od dugih rečenica u kojima se poanta krije na kraju.
Hamburger meni - tri crte koje sve znaju
Hamburger meni je onaj simbol od tri vodoravne crte, obično u gornjem kutu stranice na mobitelu, koji kad klikneš otvori skriveni izbornik stranica. Ime je dobio jer tri crte podsjećaju na presjek hamburgera - kruh, nadjev, kruh.
Na mobitelu je gotovo neizbježan jer nema dovoljno prostora za sve stavke izbornika odjednom. Na desktopu (velikom ekranu) ga je bolje izbjegavati kad god ima mjesta za normalan, vidljiv izbornik - sakriveni meni na desktopu u pravilu smanjuje broj klikova na te stranice, jednostavno zato što ih posjetitelj ne vidi odmah.
Skeleton loading - sivi obrisi dok se stranica učitava
Skeleton loading je efekt gdje se, dok se stvarni sadržaj (slike, tekst, podaci) još učitava, na ekranu prikažu sivi pravokutnici i krugovi u obliku onoga što dolazi - pravokutnik gdje će biti tekst, krug gdje će biti profilna slika.
Svrha je psihološka, ne tehnička: prazan ekran ili klasični vrteći krug (spinner) djeluju kao da se ništa ne događa, dok skeleton prikaz stvara dojam da se stranica već gradi pred tobom. U testiranjima korisnici takav dojam čekanja doživljavaju i do 40% kraćim nego prazan ekran sa spinnerom.
Ako tvoja stranica učitava podatke sporije (npr. cjenik, raspored termina, rezultate pretrage), skeleton loading nije ukras nego alat koji sprječava da posjetitelj pomisli \u201covo je pokvareno\u201d i ode prije nego se sadržaj uopće pojavi.
Najčešća pitanja
Što znači above the fold?
To je dio stranice koji posjetitelj vidi odmah, bez skrolanja. Najvažnije informacije - naslov, kratak opis i glavni gumb za akciju - trebaju stati baš tu.
Je li hamburger meni loš za web stranicu?
Nije loš sam po sebi, ali na desktopu (velikom ekranu) skrivanje izbornika iza tri crte obično smanjuje broj klikova na te stranice jer ih posjetitelj ne vidi odmah. Na mobitelu je uobičajen i očekivan.
Zašto moj dizajner spominje F-pattern kad piše tekst za stranicu?
Jer istraživanja pokazivanja oka pokazuju da ljudi čitaju stranicu u obrascu sličnom slovu F - zato su najvažnije riječi uvijek na početku rečenice ili naslova, ne na kraju.
Treba li svaka stranica imati skeleton loading?
Ne, samo dijelovi koji se učitavaju sporije od trenutka - statičan tekst i male slike to ne trebaju. Korisno je za cjenike, rezultate pretrage, raspored termina i slične podatke koji dolaze s odgode.
Dora Šušković Stipanović radi kao specijalistica digitalnog marketinga u jednom od najvećih webshopova u Hrvatskoj, uz freelance projekte u marketingu i web dizajnu. Vodila je Canva AI edukacije za međunarodnu tvrtku i javnu instituciju, a kroz Kužiš dijeli praktične digitalne alate i AI savjete za male biznise i obrte.
