Responsive webdesign, et landskap i endring

En av de nyeste trendene innenfor webdesign er responsive design - webdesign som automatisk tilpasser seg brukerens skjermflate. Responsive webdesign er et tilsvar på et landskap i sterk endring, hvor man kan surfe på Internett fra alle mulige enheter med ulik størrelse, oppløsning og perspektiv.

Responderer og tilpasser seg
Responsive webdesign går ut på at webdesignet responderer og tilpasserer
seg plattformen, størrelsen og perspektivet til enheten brukeren surfer
på nettet med. Dette betyr at designet vil presenteres annerledes på en
PC kontra en smarttelefon eller et nettbrett. Det er viktig å presisere
at responsive design ikke er design for smarttelefoner, men for de
også, sammen med alle de andre klientene man benytter til å surfe på
nettet. Faktum er at det faktisk begynner å bli en del ulike
skjermflater - selv benytter jeg PC, iPhone, iPad og TV til å orientere
meg på nettet. De dekker ulike behov, og har et stort spenn i både
egenskaper, skjermflate og oppløsning. Fra 4,5 tommer til 32 tommer gir
så klart ulike utfordringer til webdesigneren.

Flytende design
Responsive webdesign er et flytende webdesign, og er designet for å
tilpasse seg og fungere godt i ulike visninger. Ved en nedskalering av
visningsflaten vil oppsettet (grid) endre seg, og innholdet vil
omstruktureres. Bilder vil kunne skaleres ned, elementer vil kunne
skjules og fonter skaleres opp på en liten skjerm med lavere lesbarhet.

Enhetsuavhengig
Hovedfordelen med responsive webdesign er at det er enhetsuavhengig -
noe som vil si at det fungerer godt på alle de ulike «dingsene» vi
surfer på nettet med. Det er forventet at surfing via nettbrett og
smarttelefoner innen få år vil gå forbi konvensjonell surfing, noe som
gjør det helt nødvendig å tilpasse webløsningen til de ulike
visningsflatene. Videre er det en stor fordel at man får en sentral
versjon av webløsningen å forholde seg til. I stedet for å vedlikeholde
egne versjoner for mobil, nettbrett og PC, så trenger man kun å
vedlikeholde løsningen ett sted (noe som for øvrig også gir positive
konsekvenser for SEO).

Utfordringer til designeren
Responsive webdesign medfører et fleksibelt oppsett. Som designer må man
utvikle et design som kan endre seg umiddelbart og tilpasses ulike
skjermvisninger. Det vil derfor være hensiktsmessig å designe for ulike
scenario, eksempelvis cinema display (stor skjermflate), nettbrett
(mellomstor skjermflate) og smarttelefon (liten skjermflate). I tillegg
må designet tilpasses ulike perspektiver - eksempelvis både liggende og
stående iPad-visning. For designere med mye «offline»-erfaring fra
annonser, magasiner og andre trykksaker, vil dette være utfordrende, da
man er vant til å designe for fastsatte størrelser. Som designer vil man
dessuten kunne føle at responsive webdesign begrenser de kreative
mulighetene, da alt må designes for å være flytende, med få faste
holdepunkter.

Baksiden av medaljen
Til tross for at designet endrer og tilpasser seg, og man på en
iPhone-visning kanskje ikke vil vise alle elementene, vil man allikevel
måtte laste ned hele websiden. Dette medfører at man laster ned mer data
enn hva man trenger for visningen, noe som kan føre til at websiden
oppleves som treg. En responsive løsning vil også kunne være mer teknisk
komplisert, noe som gjør den mer tidkrevende å vedlikeholde. I tillegg
skal man ikke legge skjul på at informasjonsbehovet til en bruker som
besøker en webløsning fra kontor-PC'n kontra en som besøker den fra
smarttelefon, er annerledes.

Det handler om brukeropplevelsen
Stort sett alle kunder jeg prater med ønsker en mobiltilpasset
webløsning, og nesten like mange ønsker at siden skal fungere godt på
nettbrett. I tillegg må den fungere godt på ulike skjermer, størrelser
og oppløsninger. Jeg tror responsive webdesign vil være løsningen for
mange for å opprettholde en god brukeropplevelse på alle de ulike
klientene vi surfer webben med. Se nærmere på noen eksempler og bedøm
selv (endre størrelsen på nettleservinduet for å se hvordan det påvirker
oppsettet av siden):

Matsiden»
Webkonferansen»
Earh hour»
Arkitektkontoret»
Nettavisen»