— 2 min read

En dag av responsiv design

Read 974 times

I måndags arrangerade inUse Acadamy en workshop med två riktiga giganter inom responsiv webbdesign: Ethan Marcotte och Karen McGrane. Här kommer ett potpurri av vad vi lärde oss.

Dagen före From Business to Buttons arrangerade inUse Acadamy workshops. Några av oss på inUse fick äran att närvara på A day of responsive design med ungefär 20 andra vetgiriga UX-are. Det var Ethan Marcotte och Karen McGrane som höll i workshopen den 20 april, båda talade även på konferensen dagen efter.

En viktig lärdom från workshopen var att vi fick insikt i hur man skapar en responsiv lösning som dessutom kan hantera innehållet på rätt sätt – de båda går enligt Karen och Ethan tydligt hand i hand. Den tekniska utvecklingen verkar ha stagnerat något och mer fokus har gått mot innehållsstrategier. 

Innehållsmodelleringen kan ta lång tid, ska man vara sann mot sitt varumärke måste innehållet nämligen vara modulerat på ett sätt som speglar affären och varumärket. Lyckas man inte med innehållet spelar det ingen roll hur bra tekniken och implementationen är.

Vi har försökt sammanfatta lite av de andra lärdomarna vi fick med oss från workshopen:

  • Tänk inte skärmstorlekar. Det finns ingen ”korrekt” storlek för din design. Det går inte att förutse på vilket sätt, eller på vilken enhet, som användarna kommer att ta till sig ert innehåll. Är ert innehåll redo för att bli utskrivet på rostat bröd? Det kan lika gärna vara nästa stora grej istället för skärmar. Fokusera på att anpassa brytpunkter till innehållet. Höjd och bredd är variabler som blir mindre viktiga i ett digitalt medium – Move past it.
  • På tillväxtmarknader är mobilen vanligast och bland yngre generationer är det med stor marginal deras förstahandsval för att ta del av webben.
  • Viktigt att ha i åtanke i designen är att Google rankar resonsiva webbsidor högre i sina sökresultat.
  • Det finns en förväntan av att kunna ta del av allt innehåll obeoroende av enhet. Straffa inte mobilanvändare, de har lika stora behov av innehåll, allt annat är en myt. Att en användare interagerar med materialet efter att ha läst – delar, tweetar eller kommenterar – är till exempel vanligare på mobila enheter än för den som surfar från stationära enheter.
  • För att innehållet ska gå att anpassa till olika skärmstorlekar behöver man göra en innehållsmodellering. Amerikanska banken Capital One gjorde detta och på deras 2 500 sidor hade de endast 20 innehållstyper. Dessa typer blev sedan ”legobitar” i layouten.
  • Innehållsmodelleringen bör spegla din affär. Exempel: Två webbsidor med fokus på mat skapade två helt olika modeller beroende på vad de tyckte var viktigt. Båda utgick från recepten som grund. Den ena var mer fokuserad på kocken och typen av mat, den andra på tekniker. Detta gjorde det möjligt för de båda att anpassa sin affär.
  • Webbplatser är tyvärr ofta ”lagerlokaler” för innehåll som ingen vill ha eller behöver. För att komma till rätta med detta måste man gå igenom innehållet och inventera, kontrollera det, granska, skriva om och sedan modellera.
  • Viktigt att låta skaparna av innehållet vara med och ta fram modellen. Det är ju trots allt de som ska arbeta med innehållet i framtiden.
  • I designfasen är det bra att utgå ifrån en enkolumnsdesign. Detta gör det lättare att lyfta fram det viktigaste innehållet. Starta med den minsta bredden och gå sakta uppåt. ”When it starts to look like shit, that’s your first break point” är ett talade citat.
  • Designa direkt i webbläsaren för att få den rätta upplevelsen. Och presentera design på flera olika skärmstorlekar samtidigt, det hjälper till att visa att det finns tusentals skärmstorlekar därute. Det finns alltså ingen endast en enda riktig design.