Suosnivač Smashing Magazinea: Kreirajte responzivne stranice koje mogu trajati godinama

Suosnivač Smashing Magazinea: Kreirajte responzivne stranice koje mogu trajati godinama

Vitaly Friedman, suosnivač Smashing Magazinea, govorio je o responzivnom dizajnu na FFWD.PRO
Vitaly Friedman, suosnivač Smashing Magazinea, govorio je o responzivnom dizajnu na FFWD.PRO (fotografija: Mirko Beović)

Responzivan dizajn. Pojam je to o kojemu u posljednje vrijeme dosta slušamo. Naime, kako internetskim stranicama pristupamo sa sve više različitih uređaja, koji imaju različite veličine i vrste ekrana, iznimno je bitno da iskustvo korištenja bude ujednačeno na svim uređajima. O trikovima i idejama što funkcionira u ovoj vrsti dizajna na konferenciji FFWD.PRO govorio je Vitaly Friedman, suosnivač Smashing Magazinea.

Kako kaže, responzivan dizajn tjera web dizajnere da prihvate novi mentalni sklop za proces dizajniranja, ali i nove tehnike koje koriste u dizajniranju i kodiranju. Osvrnuo se i na tvrdnje da je ova vrsta dizajna pogrešna – upitao se: Kako može biti pogrešna, ako je tu riječ samo o alatu?

To je samo prigodan alat za kaotičan, fluidan web. Možda nije najbolji, ali je najbolji koji za sada postoji. To je novi mentalni sklop koji nas tjera da ponovno razmislimo o svemu i promijenimo naše navike.

Friedman je na praktičnim primjerima pokazao neke od glavnih problema responzivnog dizajna i načine na koje se oni mogu riješiti. Jedan od problema predstavljaju fotografije i ilustracije. Primjerice, kako bi se pravilno prikazivale na zaslonima visoke gustoće, ne trebaju nam slike visoke razlučivosti – bila je to njegova hrabra izjava koja je izazvala iznenađenje u publici, ali je na praktičnim primjerima pokazano kako se to može postići.

Za optimiziranje vizuala mogu se koristiti alati kao što su TinyPNG ili JPEGMini. Osobno smatram da je ova vrsta kompresije značajnija od kompresije HTML ili CSS dokumenata.

Isto tako, napomenuo je kako nema čarobnog trika za postizanje responzivnosti slika, ali preporučio je pristupe kao što je Picturefill.

Prvo tekst, onda slike?

Dotaknuo se i uvjetovanog učitavanja u sklopu kojega se od internetskih preglednika traži da učitava elemente progresivno, osiguravajući na taj način brzo i funkcionalno iskustvo pristupa osnovnim sadržajima stranice. Kao dobar primjer, izdvojio je stranicu od  The Guardiana, odnosno, način na koje ona učitava podatke. Prvo ide osnovni sadržaj (core content), naglašeni sadržaj (enhancement) i ostali dijelovi za koje korisnici najmanje mare (leftovers, kao što su analitike, oglasi i sadržaj trećih strana).

Najbolje bi bilo kada bi se prvo učitavao tekst, a nakon toga slike. Naime, ako na stranicu dolazi korisnik putem mobitela s lošim signalom, recimo, EDGE, dok čeka da se stranica učita, barem može čitati tekst. Korisnici na stranice ionako dolaze zbog sadržaja, a na ovaj način ga mogu odmah početi konzumirati dok čekaju na potpuno učitavanje.

Dao je i savjet da se prilikom planiranja projekta predvide i ciljevi koji se žele ispuniti, odnosno ograničenja koja se ne smiju prijeći, kad je riječ o brzini učitavanja stranice na lošoj internetskoj vezi, te da se na taj način prioretizira ono što je bitno. To će svim članovima tima pomoći prilikom procesa gradnje stranice i dizajna, jer sve što se naknadno dodaje imat će posljedice na brzinu učitavanja.

Fotografija: Mirko Beović
Fotografija: Mirko Beović

Smashing Magazine i web shop

Friedman je prezentirao i način na koji će Smashing Magazine redizajnirati svoj web shop kako bi bio pristupačan (responzivan) za razne tipove uređaja poput mobitela i tableta. Prilikom redizajna počeli su prvo s mobilnim rješenjem, a kako bi olakšali korisnicima na mobitelima kupovinu, osmislili su i testirali niz funkcionalnosti.

Najviše smo pažnje posvetili košarici, gdje se putem lokacije procijeni gdje se osoba nalazi, kako bi se odmah moglo odrediti u kojem će vremenu knjiga, ako je riječ o tiskanom izdanju, stići na kućnu adresu, što se odmah i prikaže kupcu. Također, prilikom upisa adrese, prvo se upisuje poštanski broj, prema kojemu se predviđa o kojem se gradu ili državi radi.

Sve se to radilo sa ciljem da korisnici na mobilnim uređajima moraju što manje stvari upisivati. Isto se odnosi i na odabir metode plaćanja, stoga su osmislili sustav Better Payment – u istome se polju, odvojeni samo zarezima, upisuju broj kartice, datum isteka i sigurnosni kod, a sustav prilikom upisivanja odmah provjerava jesu li podatci točni ili ne. No, iako je ova funkcionalnost izazvala odobravanje publike na konferenciji FFWD.PRO, Friedman je istaknuo kako su prema istraživanju zaključili da je određen dio korisnika smatrao kako takva forma nije ulijeva dovoljno sigurnosti kao standardna, stoga će za njih biti potreban period navikavanja na ovaj zanimljiv pristup.

Friedman je na kraju ohrabrio sudionike konferencije da pokušaju kreirati responzivne stranice, ali a pokušaju razmišljati na način kako bi one mogle dobro funkcionirati i za pet, šest ili sedam godina.

Pravila ponašanja

Na Netokraciji za vas stvaramo kvalitetan, autorski potpisan sadržaj i zaista se veselimo vašim kvalitetnim, kontruktivnim komentarima. Poštujmo stoga jedni druge prilikom komentiranja držeći se sljedećih pravila ponašanja:

  • Ne budite 💩: Nema vrijeđanja, diskriminiranja, ni psovanja (osim ako nije osobni izričaj, ali onda neka psovka bude općenita, a ne usmjerena prema nekome)
  • Samo kvalitetna rasprava, manje trolanja: Ne morate se ni sa kim slagati, ali budite konstruktivni i doprinesite raspravi! Svako trolanje, flameanje, koliko god "plesalo" na granici, leti van.
  • Imenom i prezimenom, nismo Anonymous 👤: Autor sadržaja stoji iza svog sadržaja, stoga stojite i vi iza svog komentara. Koristimo ime i prezime (Hrvoje Lončar) ili barem ime i inicijala (Hrvoje L.) te pravu email adresu. Kako koristimo podatke koje tamo ostavljate? Bacite oko na našu izjavu o privatnosti.

Sve ostale komentare ćemo s guštom spaliti, jer ne zaslužuju svoje mjesto na internetu.

Komentari

Odgovori

Tvoja e-mail adresa neće biti objavljena.

Popularno

Digitalni marketing

Stiže Nielsen ONE, Sveti gral mjerenja digitalnog i linearnog videa. Što to znači za agencije i klijente?

Ako ste dio marketinške industrije, vjerojatno znate da su digitalni i linearni svijet u potpunosti odvojeni - mjeriti ih i potom uspoređivati je trenutno doslovno nemoguće. Hoće li Nielsen svojim analitičkim alatom donijeti dugo iščekivano rješenje?

Društvene mreže

Rangiramo 5 najvećih komunikacijskih failova za kraj 2020. i početak 2021.

U kriznim situacijama veća je šansa da ćete pogriješiti u komunikaciji, ali veća je i šansa da će tu grešku netko primijetiti. Evo koje smo mi primijetili posljednjih tjedana…

Tehnologija

Može i bez tvornica: Hrvatska kao “meka” za R&D automobilske industrije!

2020. je za domaći IT donijela mnogo dobrih vijesti, a kakav potencijal naši stručnjaci donose za industriju automobila u 2021. i narednim godinama otkrili su nam Tomislav Car (Porsche Digital Croatia) i predstavnici dSPACE Engineeringa.

Što ste propustili

Novost

Denis Jašarević novi je predsjednik uprave tvrtke IN2

Dosadašnji Izvršni direktor IN2 grupe za Zdravstvo i javnu upravu Denis Jašarević postaje predsjednik Uprave ove domaće tehnološke tvrtke.

Startupi i poslovanje

AI: 2020. smo pokazali: “može se i iz Hrvatske”, 2021. to trebamo i dokazati!

Na početku 2020. pitali smo se može li se hrvatska AI priča pomaknuti s mrtve točke... Danas možemo reći da bez sumnje jest! Ali treba nam još bolja suradnja - i zajednice i akademije i države - kako se ne bi vratili na staro.

Digitalni marketing

Stiže Nielsen ONE, Sveti gral mjerenja digitalnog i linearnog videa. Što to znači za agencije i klijente?

Ako ste dio marketinške industrije, vjerojatno znate da su digitalni i linearni svijet u potpunosti odvojeni - mjeriti ih i potom uspoređivati je trenutno doslovno nemoguće. Hoće li Nielsen svojim analitičkim alatom donijeti dugo iščekivano rješenje?

Digitalni mediji

Facebook, Airbnb i druge platforme stisnule Trumpove pristaše pred inauguraciju

Donald Trump od danas više nije predsjednik SAD-a, a već danima prije leđa su njemu i njegovim pristašama okrenule gotovo sve tehnološke tvrtke i platforme.

Startupi i poslovanje

LAUNCHub je već investirao u hrvatske startupe, a sad su zatvorili fond od minimalno 44 milijuna eura!

LAUNCHub, bugarski VC koji je svojevremeno uz Eleven bio jedini early stage fond u Hrvatskoj i Srbiji, vraća se s podebljanim fondom za startupe u SEE i široj CEE regiji.

Kultura 2.0

Staro računalo i oprema vam skupljaju prašinu? Donirajte ih učenicima iz potresom pogođenih područja

Imate starije računalo koje još uvijek radi, ali baš pikirate nabaviti novo? Donirajte staro za školarce koji su zbog potresa ostali bez svojih školskih računala!