9. november 2012
Vegard Simensen

Hva er responsivt design?

Du skal bare sjekke været for i morgen, hva gjør du? Du tar frem mobilen. Du skal bare sjekke helgens resultater fra Premier League, hva gjør du? Du tar frem mobilen.

Sannheten er at over 30 prosent* av oss bruker internett på mobilen daglig og over 40 prosent* av oss bruker det ukentlig. Da sier det seg selv at det er utrolig viktig at nettstedet ditt fungerer optimalt mot mobil og nettbrett. Hva er vel ikke mer irriterende enn å søke opp nettsider hvor du må ”zoome” deg inn og ut for å kunne lese innholdet? Jeg er nok ikke den eneste som har forsøkt å treffe en bitteliten link med fingeren fordi man er for lat til å zoome inn på menyvalgene. Det ender jo alltid med bom og trykk på feil link uansett. Så hvordan har det seg at noen nettsider ser kjempeflotte ut på ditt nettbrett og din mobil, mens andre bare er utrolig frustrerende og irriterende?

Litt bakgrunnsinfo (Det må man ha!)
Frem til slutten av 2010 var det meget vanlig (og er det for så vidt fortsatt) å lage egne mobilnettsteder for smarttelefoner og nettbrett. Se bare på mobilversjonen til Dagbladet eller andre nettaviser (du ser ofte at adressen endrer seg til m.db.no eller dagbladet.no/m). Problemet med dette er at det blir mer vedlikehold siden samme kode må ligge to steder og det dukker stadig opp nye skjermstørrelser man må forholde seg til. Og det er her responsiv design banker på døren og gjerne vil komme inn.

Responsivt design
er en måte å tilpasse nettsidene dine på slik at de automatisk passer din smarttelefon eller nettbrett, uavhengig av skjermstørrelse. I stedet for å måtte lage forskjellige tekniske løsninger for skrivebord og mobile enheter gjør man heller tilpasninger i selve koden (HTML & CSS) slik at nettstedet ser bra ut på alle skjermstørrelser. Prøv selv! Om du drar i hjørnet på vinduet til nettleseren din og gjør dette vinduet mindre så ser du at ettersom du drar vinduet smalere og smalere så tilpasser innholdet seg til bredden på vinduet. Genialt, ikke sant?

Som så mye annet er det viktig at man ser på behovet før man bestemmer seg om man vil gjøre nettstedet mobilt med responsivt design eller med en egen teknisk løsning. Responsivt design løser ikke alle problemer. F.eks ser man at nettaviser fortsatt kan ha nytte av egen teknisk løsning for mobile enheter da man gjerne ønsker større redaksjonell kontroll, man har faste annonsestørrelser osv. Men i de fleste tilfeller er responsivt design et meget godt alternativ og noe du absolutt bør vurdere FØR du begynner å programmere nettsiden. Å gjøre en nettside responsivt i etterkant kan nemlig vise seg å bli en meget tidkrevende prosess (avhengig av nettsidens kompleksitet selvfølgelig).

Lyst til å komme i gang og prøve for deg selv? Her finner du noen meget nyttige linker som hjelper deg litt på vei.

https://webdesignerwall.com/tutorials/responsive-design-in-3-steps
https://cssgrid.net/
https://mobile.smashingmagazine.com/2011/07/22/responsive-web-design-techniques-tools-and-design-strategies/

Happy coding!

* Kilde: TNS Gallup

Vegard Simensen

+47 913 11 528
Send mail


Webdesign