“Odgovorni” WEB dizajn

Ovo je jedna neozbiljna beleška, čisto da vas obavesi o čemu se ovde radi, i šta ovde trenutno radim i usavršavam.

Ovoga puta “odgovorni” se ne odnosi na poštovanje rokova. Odgovorni je jer odgovara svim uređajima, ekranima, browserima, mobilnim telefonima, netbukovima, tablet računarima… Shvatili ste.

Skoro svi klijenti žele da im se sajtovi lepo vide na mobilnim uređajima. Osim što imamo tridesetoinčne monitore, imamo i BlackBerryje, iPhoneove, Kindleove, da ne pominjem megabajte koje trošimo preko 3Ga da bi pregledali sajtove…

Ovaj tip kodiranja omogućava da se jedan jedini (bez prefiksa m. i slično) sajt prikaže onako kako treba na svim urećajima. Sajt u koji trenutno gledate se sam prilagođava rezoluciji ekrana na kome ga vidite.

Ne verujete?

Menjajte veličinu prozora svog internet pregledača i pratite šta se dešava! A onda posetite istu ovu adresu preko bilo kog od svojih mobilnih uređaja!

Lepo, zar ne? Ova tehnika se u svetu primenjuje već neko vreme, ali na domaćem webu još uvek nisam primetio da neko na ovaj način vodi računa o svojim klijentima i/ili korisnicima.

Eto, možda sam, u neku ruku, pionir :)

Značilo bi mi da ostavite komentare sa svojim mišljenjem na temu, a ja ću, ukoliko budete bili zainteresovani, uskoro napisati opširan i detaljan članak. Ima još dosta toga da se radi, još ovo nije ni blizu savršenog, tako da mi svaka kritika znači. Dodajmo i to da nemam ni iPad niti smartphone da testiram to što sam upravo uradio, pa bih vas zamolio da to učinite umesto mene.

Hvala unapred!

11 komentara

  1. dečko – piši taj članak ;)

  2. Pošto kažeš da nemaš neki pametni uređaj da testiraš, eve ti screenshotova:
    http://images.dachaz.net/Screenshots/110330-Anarcoder-iPhone.png
    http://images.dachaz.net/Screenshots/110330-Anarcoder-iPad.png

    Uzgred, ne bi bilo zgoreg da staviš i “maximum-scale=1.0; user-scalable=0;” jer ovako ume da se zaglupi kad okrećeš uređaj pa je neophodno manuelno odzumirati.

  3. Radim trenutno na dizajnu gde koristim ove trikove, stim da se koristim i JS-om za detekciju širine browsera, pa na osnovu toga vučem CSS. Naravno, i ovakvo rešenje je krajnje jednostavno i vrlo lepo za videti. Čim završim prvu verziju dizajna postaviću link da vidiš (ukoliko se tada setim) :) Chris Coyier je pre nekih godinu dana lepo sve to opisao, detaljno, pa koga zanima da postigne nešto ovako, preporučujem članak http://css-tricks.com/resolution-specific-stylesheets/

  4. Svakako tema o kojoj treba pisati.

  5. Iz nekog razloga kad pokusam da otvorim tvoj sajt u IE8, on mi pukne skroz na pola ucitavanja. Whats with that?

    1. Da, rekli su mi neki da se to dešava… To je zato što nisam ubacio hackove za starije verzije IE u CSS. Za sad radi samo u IE9, ali popraviću već u toku sledeće nedelje…

  6. Upisujem se na listu nestrpljivih za taj post, super fora :)

  7. Ja također. Jedva čekam taj tekst. Požuri!

  8. Iz ono moje malko žalosti od komentara ste videli da je flexible width nešto što se podrazumeva :). Niko ne voli horizontalni scroll, i ima bar 7-8 godina da ja znam da se gleda (ako ikako može), da se napravi sajt koji se slično prikazuje u svim browserima.
    I vi i ja znamo da ISTO ne može, ali ne sme ni da se raspada :). I vi i ja znamo koliko hack-ova iziskuje ova priča, ako ćete ići baš from scratch, ali ja ne sumnjam u vas :).

    Još jednom sve najbolje :).

  9. Drago mi je da je i kod nas počela da se pominje ova tema. Piši taj članak. :)

Komentariši

Tvoja email adresa neće biti objavljena. Polja označena * zahtevaju unos.