Responsive dizajn je pristup gdje se web stranica automatski prilagođava veličini ekrana na kojem se gleda — mobitel, tablet, laptop, desktop. Jedan kod, sve veličine.
Zašto je standard u 2026
- 60%+ globalnog prometa je mobilni (za lokalne usluge 75%+)
- Google koristi mobile-first indexing — rangira na temelju mobilne verzije
- Korisnici napuštaju stranice koje traže zoom i horizontalni scroll
Što čini stranicu responsive
- Fluid grid — elementi se prilagođavaju u postocima, ne fiksnim pikselima
- Flexible slike — skaliraju se s ekranom
- Media queries — različiti stilovi za različite veličine
- Viewport meta tag — govori pregledniku da prilagodi
Mobile-first pristup
U 2026. dizajnira se prvo za mobitel, pa se širi prema desktopu — ne obrnuto. Razlog: većina korisnika dolazi s mobitela, a Google rangira mobilnu verziju.
Što provjeriti na mobitelu
- Tap targets minimum 48×48px (gumbi dovoljno veliki za prst)
- Font minimum 16px (bez potrebe za zoom)
- Bez horizontalnog scrolla
- CTA i telefon vidljivi iznad fold-a
- Brzina (Core Web Vitals) — mobitel je stroži
Responsive nije isto što i brzo
Stranica može biti responsive ali spora. Oba su potrebna — responsive za prilagodbu, Core Web Vitals za brzinu. Zajedno čine dobar mobilni SEO.
Povezani pojmovi
Core Web Vitals
Googleov set metrika koje mjere brzinu i stabilnost stranice (LCP, INP, CLS). Direktan faktor rangiranja — spora stranica gubi SEO i konverzije.
SEO
Optimizacija za tražilice — skup tehnika kojima web stranica postiže bolju vidljivost u organskim (neplaćenim) rezultatima Googlea.
Landing page
Namjenska stranica dizajnirana za jedan cilj — konverziju posjetitelja u lead ili kupca. Bez distrakcija, s jasnim pozivom na akciju.
Bounce rate
Postotak posjetitelja koji napuste stranicu bez ikakve interakcije. Visok bounce rate može signalizirati nerelevantan sadržaj ili lošu korisničku stranicu.
UX dizajn
Oblikovanje iskustva korisnika na stranici ili u aplikaciji: koliko brzo nađe ono što traži, razumije li ponudu i može li završiti zadatak bez zapinjanja.