Responsivt webdesign: løsningen på alt?

Et website er ikke længere bare en side, som bliver vist i et browservindue på en pc, der er solidt placeret på dit skrivebord. 6 ud af 10 danskere har nu en smartphone, og 1 ud af 5 har en tablet (kilde: http://fdb.dk/analyse/vi-har-smartphones-%E2%80%93-nu-vil-vi-have-tablets). Det er i stigende grad disse, mange hiver op af lommen eller tasken og bruger til at gå på nettet fra sofaen, busturen eller sågar toilettet. Hvad de ser på smartphonens eller tablettens mindre skærme, afhænger af, om websitet kan tilpasse sig andre formater end klassisk desktop. Buzzwords lige nu er HTML5, CSS3 og Responsive web design (RWD).

Er Responsive web design så løsningen i forhold til at designe dit website, så det funktionelt og visuelt passer til alle devices?

Dette spørgsmål er vi i gang med at besvare i Eniro. Som en af Danmarks store medievirksomheder er Eniro Danmark til stede på stort set alle enheder, der har en skærm, i form at websites, mobilsites, native apps og java-apps. Vi har rundet over 1 mio. downloads af vores apps i Danmark og har hver uge over ½ mio. besøgende på vores mobile tjenester. I Eniro-koncernen valgte ledelsen sidste år at satse på ”mobile first”-tankegangen. Det betyder, at virksomheden tager de mobile kanaler og muligheder alvorligt på et strategisk niveau. Det valg tog Google i 2010, ligesom flere og flere andre gør det:

“Google programmers are doing work on mobile applications first, because they are better apps and that's what top programmers want to develop.” *–Eric Schmidt, Google Chairman
*“We're just now starting to think about mobile first and desktop second for a lot of our products.” -Kate Aronowitz, Design Director Facebook

“We really need to shift now to start thinking about building mobile first. This is an even bigger shift than the PC revolution.” -Kevin Lynch, CTO Adobe

Væksten på mobil giver os nye muligheder: Brugen af mobilt internet vokser otte gange så hurtigt som brugen af desktop-internet, den mobile datatrafik forventes at blive 26-doblet i de næste fem år, og prognoserne siger, at 2013 bliver året, hvor mobilen stormer forbi pc´en som den foretrukne måde at tilgå websites på.

Hvad betyder det så for dig som udvikler?

• Den mindre skærm får udviklerne til at fokusere på skærmstørrelsen, hastigheden på netværket, og hvordan brugerne bruger sitet.

• ”Mobile first” giver innovation: Tænk over, hvad dette kan give dig som udvikler i dag: location detection, multi-touch sensors, direction from a digital compass, capture input from camera, dual cameras (front and back), input from microphone (voice recognition), Bluetooth between devices, device closeness to physical objects, light/dark environment awareness, Near Field Communication via RFID reader.

Den digitale udvikling bliver mere og mere kompleks, så vi er nødt til at designe tjenester, som fungerer på tværs af alle digitale enheder – og hvem ved, hvad morgendagen bringer af nye devices. Grundlæggende mener jeg, at valget i fremtidens webudvikling står mellem at designe et dedikeret site til hhv. desktop, laptop, smartphone, tablet og kommende generationer af gadgets - eller designe ét samlet fleksibelt site, som tilpasser visningen til brugerne.

Indtil videre har vi erfaret, at fleksibiliteten ikke bare er en formalitet. Det kræver skarp prioritering af funktionalitet og indhold til mobilbrug. Men denne proces er guld værd! Samtidig har man også muligheden for at vælge to varianter af responsiv-løsninger:

  1. Hjemmesiden 100% flydende, altså responsiv, eller
  2. Identificere et vist antal enheder eller skærmstørrelser og sørge for, at de fungerer optimalt – det kalder man adaptivt design.

Personligt foretrækker jeg den flydende løsning, da vi ikke ved, hvad morgendagen bringer af nye skærmstørrelser. Men det tager længere tid og er dyrere at udvikle på den måde. At have Mobile-First Web Responsive Design af vores hjemmesider betyder også, at vi med stor fleksibilitet kan komme ind på nye gadgets, når de dukker op, f.eks. nye Android-tablets.

En anden og lige så vigtig ting er at finde ud, hvilke behov brugerne har på forskellige tidspunkter af døgnet, alt efter om de bruger Krak eller De Gule Sider på mobil, iPad eller pc – og indrette os derefter.

Jeg lagde ud med at spørge, om Responsive web design er den bedste løsning i forhold til at designe vores websites, så de funktionelt og visuelt passer til alle devices. Vi har endnu ikke det endelige svar, men det er en super spændende proces at være med i. Vi har netop lagt ud i Norge, hvor vi har lanceret www.kvasir.no i responsivt design.

God sommer!

Kommentarer (12)
sortSortér kommentarer
  • Ældste først
  • Nyeste først
  • Bedste først
Thomas Vestergaard

Hjemmesider der er designet til en bestemt skærmstørrelse eller ratio er en pain in the *** - af flere årsager. Men det problem jeg typisk oplever er, at de sjældent tilpasses "pænt", hvis jeg f.eks. resize'er mit vindue til kun at bruge halvdelen af skærmen.
En afledt affekt er, at den kommer til at se helt forkert ud i 10:16 ratio (90-grader rotation), som ellers normalt er et godt læseformat for almindelige dokumenter.

  • 0
  • 0
Peter Lundsby

Hej Pernille

Jeg vil nu ikke sige at Responsive Design er løsningen på alt.
Men det er et ekstremt vigtigt begreb, som jeg personligt tror vil få enorm betydning for nettet fremover.

Tænk på hvor vi var på vej hen, med platform specifikke apps til en masse forskellige devices og imod mobile sites rettet imod specielle telefoner.

Det truede med at rive nettet fra hinanden, og ud i små stumper et net for telefoner, et for fjernsyn, et for køleskabe etc.
Det har Responsive Design nu et godt svar på hvordan undgås, så vi kan beholdet et stort samlet net, som kan være til glæde for os, uanset hvilket device vi er på.

Responsivt design er faktisk, så kraftfuldt at man bør overveje om man overhovedet gider at producerer Apps, for hvorfor gå igennem en besværlig udrulningsprocessen for at lave en native app til hver platform, når man kan ændre sit site til Responsive Design og nå alle platformene.

Rent teknisk er Responsive Design, langt fra raket videnskab, med lidt jQuery og CSS3 så er man hurtigt igang, mængden af accidental compleksity er minimal og man arbejdet består primært at udforme de forskellige oplevelser.

På værktøjssiden, så er Adobe rigtigt godt med og har introduceret en mængde features til RS i deres nye suite.
I vores egen lille site builder CloudSprout, har vi også valgt at putte Responsive Design features i.
Men selv uden værktøjer, så er det muligt at bygge Responsive Design, så der er ingen undskyldning :-)

Responsive Design er det bedste bud på hvordan næste generation af nettet kommer til at se ud.

  • 1
  • 0
Thomas Norsted

...men ikke nødvendigvis en god slutning

Vi oplever i disse tider et sandt væld af nye skærmstørrelser og devices - og med introduktionen af Apple's Retina display er der pludselig kommet endnu et parameter på banen.. DPI. Responsive design kan løse et behov for at kunne præsenterer en hjemmeside på en bred vifte af skærmstørrelser på en fornuftig måde. Hvad responsive design ikke kan at give en optimeret oplevelse afhængig af device. Brugerne har typisk forskellige behovsmønstre afhængig af hvilken type af device de sidder/står/ligger/går/med, og det rigtig gode website bør tage højde for det.

En anden problemstilling er leveringen af billeder og andre datatunge elementer børes også tages i hensyn, og et hensyn som responsive ikke løser alene.

Og så er der hele problematikken omkring bannere - vi har fået responsive sider, indhold, og billedstørelser, men hvad hjælper det når man har statiske bannerstørrelser? Der skal ske en revolution her så vi får bannere der tilpasser sig til omgivelserne og ikke omvendt.

En anden problemstilling er det faktum at set med UX øjne er responsive ikke en optimal løsning da elementer kan/vil flytte placering afhængig af hvilken device du lige sidder med - hvilket er temmelig meget i modstrid med nogle af grundstenene i fundamental UX design.

Kan responsive design bruges til nogle formål? bestemt! Er det i alle tilfælde den bedste løsning i forhold til multiple device support - bestemt ikke.

  • 0
  • 0
Pernille Trolle Brøgaard

Helt enig i dine betragtninger. Som jeg også skriver, så har vi endnu ikke besvaret spørgsmålet om hvorvidt responsive design er løsningen på alt - netop pga. hvad du også beskriver. Flere faktorer spiller ind.

Problematikken omkring billeder og andre tunge elementer samt bannere har vi også arbejdet en del med - tror det skal være mit blog-tema til næste gang :-)

  • 0
  • 0
Peter Lundsby

Vi oplever i disse tider et sandt væld af nye skærmstørrelser og devices - og med introduktionen af Apple's Retina display er der pludselig kommet endnu et parameter på banen.. DPI.

Det er vigtigt at forstå at dpi altid har været et parameter i Responsive Design, måden Responsive Design virker på rent teknisk er via CSS3 Media Queries og her er det muligt at specificerer både min og max resolution for sine styles.

Responsive design kan løse et behov for at kunne præsenterer en hjemmeside på en bred vifte af skærmstørrelser på en fornuftig måde. Hvad responsive design ikke kan at give en optimeret oplevelse afhængig af device.

Der er ikke noget galt for at man i sit responsive design, vælger at devicet er handheld, en skærmlæser etc. er et parameter som man ændre design efter.

En anden problemstilling er leveringen af billeder og andre datatunge elementer børes også tages i hensyn, og et hensyn som responsive ikke løser alene.

Via Responsive Design er det bestemt muligt at f.eks. sende mindre filer til mobile devices. Videoer i lavere opløsninger etc.

Jeg tror det vigtige at forstå er at Responsive Design, er en målsætning og en række teknikker til at løse diversiteten af devices.

Målsætningen er at det er på klienten at tilpasningen sker, i modsætning til på serveren. Værktøjerne er blandt CSS3 Media Queries, Andre CSS3 features og client-side tricks.

Jeg er selv meget på Responsive Design, og har svært ved at se andre kvalificerede bud på at bygge multi-device sites, hvilket alternativer du bruge ?

  • 0
  • 0
Michael Lykke

Jeg er selv meget på Responsive Design, og har svært ved at se andre kvalificerede bud på at bygge multi-device sites, hvilket alternativer du bruge ?


Det er ganske simpelt... Som tingene ser ud pt. så er Responsive Design løsningen... Eneste undtagelse er hvis man ønsker en mobil løsning der er markant anderledes i design og udformning end sit "normale" website. I den situation designer man self, en selvstændig Responsive løsning. Men som udgangspunkt så er Responsive Design løsningen på "alle" vores problemer :)

  • 1
  • 0
Morten Atke Nüchel

Det er ganske elementært at responsive web design er standarden for hvorledes en webplatform skal opbygges. Jeg er helt enig i ovenstående betragtninger, men må også konstaterer at de fleste virksomheder indenfor de sidste par år har investeret mange penge og tid i deres nuværende
platform, og derfor er tilbageholdende med at tage nye investeringer.

Der er i mine øjne, ingen vej uden om responsive web design, såfremt man mener at de 30-40% der browser via en mobil enhed, er relevante for en forretning...

Responsivemedia.dk har lavet et værktøj der gør det muligt at teste om dit website er responsive.

  1. Tryk på dette link: http://responsivemedia.dk/test-din-hjemmeside/
  2. Indtast din URL adresse i iPhonen
  3. Se resultatet
  • 1
  • 2
Log ind eller Opret konto for at kommentere