Förra fredagen hölls Responsive Day Out, en endagskonferens om responsiv webbdesign, i Brighton, England. 13 talare plus arrangören Jeremy Keith som diskussionsmoderator samlades på scen för att diskutera hur det förändrade webblandskapet tvingar oss att ändra arbetsflöden, tankesätt och tekniker för att leverera design som funkar för fler enheter, fler kontexter och fler användare.

Några tydliga teman stod ut från de många ämnen som diskuterades. Flertalet av dem är säkert bekanta för den som följt framväxten av responsiv webbdesign senaste tre åren.

• Arbetsflöden och hur den växande floran av enheter med webb-kapacitet stör ut våra gamla tankemönster kring webb.
• Prestanda, både för mobila enheter och andra, som en ingående del av designarbetet.
• Svårigheten att anpassa sig till en webb som envisas med att kasta av sig oket från printdesign, och vill finna sina egna designkonventioner.

Designprocesser i förändring

Sarah Parmenter, Laura Kalbag och Elliott Jay Stocks var tre av talarna som valde att rikta in sig på arbetsflöden, och hur vi anpassar oss till ”den nya världen”. Sarah pratade om att vi behöver erkänna för oss själva att mycket av det vi ställs inför under en responsiv designprocess, även som erfarna designers och utvecklare, är så nytt att vi faktiskt improviserar en stor del av tiden. Hon delade också med sig av några saker som hon kommit fram till under resans gång, som t.ex. att göra medvetna val kring när man ska jobba med sidlayout i en grafisk miljö (Photoshop, Fireworks etc) och när man bör jobba med t.ex. wireframes, komponentmallar eller styletiles.

 

Elliott fokuserade på de punkter som brukar anföras som kritik mot responsiv design och fyllde på med ammunition kring hur dessa argument kan bemötas. Responsiv är inget magiskt verktyg för att lösa problem kring t.ex. mobila användare, men Elliot poängterade att en responsiv sajt är ett första steg mot en arkitektur som med rätt approach kan bli det mest logiska och kostnadseffektiva (trots en initial kostnad som i många fall är högre än tidigare) för både nuvarande och framtida devices, oavsett kapacitet.

Laura valde en annan vinkel, och pratade om hur vi kan skapa en design där användaren känner igen sig, när ”stödhjulen” som vi är vana vid i form av konsekvent layout försvinner. Typografi, färg, ikonografi och konsekventa mått på radhöjd och marginaler är exempel på sådant som kan knyta ihop en design, även när användaren omväxlande använder en mobil, surfplatta eller en widescreen–TV.

Utöver arbetsflöde innehöll design–spåret även praktiska tips från David Bushell kring designmönster specifikt för responsiv navigation.

Spelkonsoller—en ny utmaning

På tal om TV–apparater tidigare: Anna Debenham pratade om webbläsare i spelkonsoller, och hur de ofta ställer oss inför annorlunda utmaningar kring både skärmlayout och input–metoder. Konsollernas webbläsare har ännu inte märkts i våra sajters statistik i någon större utsträckning, men Anna visar att det potentiellt är mycket relevant när vi designar sajter för barn och ungdomar: för många, särskilt barn från låginkomsthushåll, är en handhållen spelkonsoll sannolikt den enhet som man har störst tillgång till webben via.

Dessutom har kvaliteten på webbläsarna i våra spelkonsoller ökat avsevärt, och motivationen att växla mellan att spela och att surfa kan göra att detta användningsområde för webben kan explodera. För den som designar webbplatser innebär detta nya utmaningar: användaren kan ha touch–skärm, stylus, använda gester (med t.ex. Kinect), peka med en rörelsekänslig kontroll, eller använda tangentbord. Bilden kan visas på en 2–tumsskärm på handhållna enheter, eller på en 50–tums TV. Tyvärr är det svårt att identifiera just TV-formatet, där gränssnittet sett från 3–4 meters avstånd kan behöva justeras jämfört med en datorskärm med samma upplösning sedd från 70 cm.

För den nyfikne har Anna en mycket intressant mikrosajt om webbläsare på spelkonsoller

Progressive enhancement och tekniska utmaningar

Andy Hume och Tom Maslen pratade om hur de jobbar med progressive enhancement och prestandaoptimering på två stora mediaorganisationer—Andy på The Guardian och Tom på BBC.

Båda landade i att bygga en bas som fungerar väl i de äldsta läsarna (BBC har t.ex. som public–service–organisation ett explicit krav att stödja användare som inte har möjlighet att uppgradera sin webbläsare), och därefter använda script för att ladda ytterligare resurser och designförbättringar efter att enhetens kapacitet verifierats. Andy berättade om hur man på The Guardian går ett steg längre och förändrar bas–nivån genom avkänning på serversidan av vilken typ av enhet som försöker komma åt sajten—en teknik som Luke Wroblewski kallar RESS, Responsive Server Side components.

Så kallad ”device sniffing” anses generellt sett vara en tveksam teknik, men med ett ansvarsfullt användande där det värsta som kan hända är att en enhet som inte känns igen får en något enklare bas–upplevelse levererad, kan det vara ett sätt att effektivisera för t.ex. de vanligaste mobila enheterna. Andy poängterar att det kan kräva en lättfotad organisation med stora resurser att kunna göra optimeringar på den nivån.

Veteranen Bruce Lawson från Opera gav en humoristisk överblick över den mångfald av nya standarder som är på gång för att tackla tekniska utmaningar.

Richard Rutter och Josh Emerson gav en genomgång kring hur vi kan använda oss av font–inbäddning som en metod för vektorgrafik, och vilka metoder för inladdning som finns att tillgå.

Filosofiskt finlir

Mark Boulton, Paul Robert Lloyd, och Owen Gregory var kanske den mest esoteriska trion på programmet, och pratade från olika vinklar kring implikationerna filosofiskt och praktiskt kring att designa för en webb utan fasta mått. Paul argumenterade för en ny designestetik där vi funderar kring vad webbens begränsningar gör med våra designkonventioner, och hur vi vänder begränsningarna till ny kreativitet—någon som han tidigare utforskat i en artikel i A List Apart.

Owen gav en lektion i vad han kallar ”antifonal geometri”, en medvetet högtravande titel om hur geometriska former och deras ratio ofta kan härledas till matematiken bakom musikalisk harmoni. Jag misstänker att det var en presentation som agerade lite vattendelare hos publiken: antingen gillade man någon som stod ut och krävde lite mer eftertanke, eller så somnade man till av nåt som var högst designteoretiskt och akademiskt. Som generalist står jag med en fot i varje läger och kan inte riktigt bestämma mig…

Mark avslutade konferensen med en sammanfattning av hur vi kan se på att designa visuellt för ett medium där ramarna envisas med att flyta, förändra sig, försvinna. Med en lätt glimt i ögat föreslog han att vi förutom stridsropen ”mobile first!” eller ”content first!” bör anamma ”fluid first!”—webben är inte print, vi måste göra en mental förskjutning till att anamma dess flytande, oformliga natur innan vi kan åstadkomma bra design.

Som helhet var det en väldigt lyckad och lärorik dag, och förutom hög kvalitet på prat och diskussion så var det också formatet som stod ut: tre korta (20–25 minuter) prat som tvingade talaren till att fokusera på ämnet, och därefter en paneldiskussion med de tre talarna samt Jeremy som moderator, och därefter frågor från publiken. Något för fler konferenser att anamma.

Hela eventet filmades: audio och länkade slides finns redan nu att tillgå, video är på gång. Bäst överblick fås via konferensens sida på Lanyrd.

Stort tack till Robert Sedovšek för fina bilder.

Skrivet av Emil Björklund. Läs fler inlägg om Responsive Design — Skriv en kommentar