Back to site
Since 2004, our University project has become the Internet's most widespread web hosting directory. Here we like to talk a lot about web development, networking and server security. It is, after all, our expertise. To make things better we've launched this science section with the free access to educational resources and important scientific material translated to different languages.

Povratni Web Dizajn i Mobilni Uredjaji


In a couple of days work, I managed to turn Spoiled Milk's website design fully responsive so it adapts nicely to whatever device it is rendered on.

Danas ljudi pristupaju Internetu sa mnostva uredjaja koji se neprestano razvijaju, koji imaju razlicite velicine ekrana i razlicite komande (mis vs prsti).

Ovo predstavlja veoma realan dizajn kao i pitanja vezana za koriscenje, zato sto vecina web sajtova jeste dizajnirana da bi se mogla videti na velikim ekranima i kojima se upravlja uz pomoc misa. Ocigledno je da je ovo zastareli nacin na koji stvari funkcionisu - ostaci doba kada smo mogli dati razumne pretpostavke o velicini ekrana korisnika.

Moderni web sajtovi ce morati da se prilagode svim vrstama i velicinama ekrana i komandi. Web sajtovi treba da izgledaju i rade jednako dobro na Android telefonima, na iPad-u, kao i na desktop kompjuterima. Moderni web sajtovi odgovaraju svim uredjajima, sto je mnogo bolje od cinjenice da uredjaj odgovara websajtu.

Na srecu, mi imamo fin i direktan nacin da postignemo ovaj san - taj nacin se zove povratni web dizajn.

Povratni web dizajn

List Apart je napisao sjajan uvod za ovu temu. Ukratko, povratni web dizajn se adaptira prema formatu strane u zavisnosti od velicine ekrana uredjaja koji prikazuje stranu.

U praksi, ovo se postize uz pomoc upotrebe medija upitnika - deo CSS3 specifikacije. Medija upitnici pruzaju mogucnost da se uslovno primene podskupovi CSS3 stilova u zavisnosti od medija - uredjaja - koji prikazuje stranu, ukljucujuci i velicinu ekrana.

Ovo znaci da Vas web sajt moze odgovarati velicini ekrana uredjaja koji ga prikazuje - prerasporedjuje elemente, smanjuje ili povecava velicinu fontova itd. tako da dizajn izgleda i radi jednako dobro i na smart telefonima kao i na desktop racunarima. To je povratni web dizajn.

Dizajniranje za vise uredjaja

Najocigledniji aspekt povratnog web dizajna je rad sa razlicitim velicinama ekrana. Na desktop racunaru cete pozeleti da imate format sa tri kolone, a na smart telefonu postoje ogranicenja zbog male velicine ekrana koja vas cesto teraju da se vratite na format sa jednom kolonom . Slike ce morati da budu povecane i umanjene u odredjenoj razmeri.

U svakom slucaju, postoji mnogo toga pored velicine ekrana sto treba uzeti u obzir kada se radi povratni web dizajn. Takodje cete zeleti da razmislite kako korisnik upravlja Vasim web sajtom - uz pomoc misa ili prstima? Slucajno, komande na vecini smart telefona su mnogo manje precizne zbog touch ekrana preko koga se upravlja telefonom, a ne misem.

Ovo Vas na neki nacin tera da postavite linkove i dugmad na odredjenu razdaljinu tako da korisnik ne bi pogresio ukoliko bi slucajno pritisnuo neki od ovih. Cesto se desava da se navigacija sajta mora ponovo razmotriti.

Jos jedna velika razlika je da vise ne mozete ocekivati dostupnost hover-a posto uredjaji koji funkcionisu na dodir ne nude ovu mogucnost (zapravo jos uvek ne). Usled toga Vas sajt mora biti upotrebljiv i pristupacan i bez hover-a.

Da li je isplativo?

Browsing preko mobilnih telefona je trenutno u ekspanziji, procenat posetilaca na vecini sajtova rapidno raste da bismo ga mogli ignorisati (na sajtu Baymard.com broj posetilaca je vec preko 10%), a koriscenje Interneta na mobilnim telefonima se krece samo u jednom pravcu.

Na pocetku, povratni web dizajn je zvucalo kao nesto oko cega ima mnogo posla. U poredjenju sa kreiranjem namenskih sajtova za smart telefone, pa zatim za tablete kao i za desktop kompjutere, menjanje formata jednog sajta predstavlja mnogo laksi nacin da se isti implementira i (jednako vazno) odrzava.

Povratni web dizajn Vas definitivno tera da pristupite Vasim web dizajnima koristeci razlicite nacine. Zapravo, kada jednom shvatite o cemu se radi, povratni web dizajn je zapravo prilicno jasan. Ja sam implementirao povratni web dizajn na Baymard i Spoiled Milk web sajtove u roku od samo nekoliko dana.

Sve sto Vam je potrebno je nekoliko dana da biste Vas web sajt pretvorili u iPhone-, iPad-, Android-, Blackberry- optimizirani web sajt. Sada sa sigurnoscu ja mogu da kazem: ,,Da, povratni web dizajn se isplatiā€

Povratni web dizajn predstavlja buducnost, a kladjenje na buducnost povratnog web dizajna predstavlja siguran dobitak.

Slazete se? Ne slazete se? Povratne informacije-odgovori?



Published (Last edited): 09-12-2012 , source: http://baymard.com/blog/responsive-web-design