Varför responsive design?

Responsive design blir ett allt viktigare begrepp inom webbproduktion. Alla trendanalyser pekar på att det mobila surfandet ökar lavinartat. Därför är vår målsättning för 2013 att alla av de webbplatser vi utvecklar ska vara responsiva.

Vill du beställa en responsiv webbplats? Läs mer om hur vi arbetar med responsiv webb eller kontakta oss direkt för en offert eller förutsättningslöst möte. Vill du först få en bättre bild av vad responsive design innebär? Fortsätt läsa!

Mobiler blir vanligare än datorer i år

Redan om några månader förutspås antalet uppkopplade mobiler vara fler än antalet uppkopplade datorer i världen. Den som har en webbplats kan vara säker på att den kommer att besökas från en mobil eller surfplatta i allt större utsträckning. Den mobila utvecklingen kommer att genomsyra hela arbetssättet för alla som arbetar med onlineprodukter framöver.

Mobila enheter blir fler än datorer under 2013.

Antalet uppkopplade mobila enheter ser ut att gå om antalet uppkopplade datorer redan i år. Källa: KPCB

Vad är responsive design?

Det räcker inte att din webbplats fungerar på en mobil, den måste ge en lika bra upplevelse som desktopversionen. I praktiken innebär det att din webbplats måste vara anpassningsbar (responsive) – innehåll, navigation, funktionalitet och design måste anpassa sig efter den skärm och typ av enhet besökaren har framför sig. En bra responsive design gör att besökaren lätt kan hitta och ta till sig innehållet på din webbplats och att hon inte behöver zooma in och scrolla i sidled i onödan.

Fortfarande ovanligt att anpassa för olika enheter

Hittills har det absolut vanligaste varit att göra webbplatser som bara har ett fast utseende – en layout, en innehållsstruktur. Detta är fortfarande genomgående på de flesta sajter. En genomgång av vinnarna i Internetworlds Topp100, som utsågs förra veckan, visar till exempel att bara fem av Sveriges femton bästa sajter 2012 är anpassade för mobil (ytterligare sex av dessa hänvisar till appar).

Några av vinnarna i Internetworld Topp100 2012 som de ser ut på mobil.

Några av vinnarna från Internetworld Topp100 så som de ser ut på smartphones. Texten är oläsbar och länkarna omöjliga att klicka på utan att först zooma in.

Vad innebär responsive design i processen att ta fram en ny webbplats?

I den nya, mobila världen kommer vi att utveckla mer flexibla lösningar både när det gäller design, funktionalitet och innehåll. Detta kommer att innebära ett nytt sätt att arbeta där fler överväganden och tester måste göras för att hålla användarupplevelsen på en konsekvent hög nivå oavsett enhet.

Den stora utmaningen blir att låta responsive design genomsyra alla delar av ett webbprojekt. Även om det innebär en ökad komplexitet och omfattning av projektet, är det inget som går att välja till eller välja bort. Det är helt enkelt en inneboende egenskap hos moderna webbplatser. Om ett par år bör responsive design vara så pass självklart att det inte längre är ett begrepp.

Vad innebär responsive design för innehållet?

Ska mobilvarianten vara en avskalad, tjänstefokuserad version av webbplatsen? Eller ska alla versioner av webbplatsen ha identiskt innehåll? Få orkar surfa runt och interagera med en webbplats på samma sätt på en mobil som vid sin laptop, men betyder det att vi alltså kan ta bort information och funktionalitet på mobilwebben? Svaret är nej. I de allra flesta fall behöver besökaren få tillgång till samma innehåll oavsett vilken enhet hon väljer att besöka webbplatsen på. Hon kanske har läst något vid sin laptop som hon sedan vill dubbelkolla i mobilen på väg till jobbet. Då måste det vara enkelt att hitta tillbaka till samma innehåll.

Lösningen för att hantera samma innehåll på flera enheter, är att arbeta med en mer genomtänkt struktur, såväl när det gäller hur data lagras som hur innehållet presenteras. Att arbeta med enhetsoberoende innehåll ställer också högre krav på webbredaktören, som måste se till att innehållet är tydligt och tillgängligt på såväl mobiler och surfplattor som på en större skärm.

Vad innebär responsive design för designen?

En ny utmaning blir att bibehålla en konsekvent form för alla enheter. Även om vi på SthlmConnection redan idag föredrar att i så stor utsträckning som möjligt designa element snarare än fullständiga sidmallar, kommer de viktigaste sidorna fortfarande behöva designas i sin helhet. Både interaktionsdesignen och den visuella designen måste hitta ett konsekvent sätt att anpassa olika typer av layouter, sidmallar och element till såväl mobila som stationära enheter.

sthlmconnection.se på olika skärmar.

Såhär anpassar sig sthlmconnection.se till olika skärmstorlekar.

Vad innebär responsive design för våra kunder?

Framför allt handlar det om att vara i tiden. Att utveckla en webbplats som bara är anpassad för desktop är lika kostnadseffektivt 2013 som det var att utveckla en flashbaserad webbplats 2012. Dagens webbanvändare förväntar sig en positiv upplevelse oavsett om hon surfar på en mobil, en surfplatta eller en dator. Den som satsar på responsiv webb idag gör en investering inte bara i en modernare och mer framtidssäker webbplats utan även i nöjdare kunder och större affärsnytta.

Var kan jag se exempel på bra responsive design?

Hur ser min egen sajt ut i en mobil?

Du kan få en snabb analys av hur din webbplats ser ut och fungerar i mobil med hjälp av Googles verktyg Mobile Meter. Här får du även möjligheten att ladda ner en rapport som beskriver hur du, utifrån din bransch, bäst bör anpassa din webbplats.

Vill du gå över till responsive design?

Funderar du på hur du kan anpassa din webbplats för att den ska fungera lika bra på mobila enheter som på en dator? Om du känner att det är dags att din organisation tar steget till mobilanpassad webb, hjälper vi gärna till. Skicka ett meddelande eller ring oss så kan vi göra en genomgång av din webbplats och ge förslag på hur vi bäst går till väga för att ge alla dina besökare en bra upplevelse.

Lägg till ny kommentar

More Know-how

Några av våra kunder