Responsiv webbdesign

Vi på IVEO var mycket tidiga med att adoptera och värdera responsiva gränssnitt på internet. Vi har i och med det samlat på oss gedigen erfarenhet för att effektivt producera nya - såväl som modifiera befintliga gränssnitt så de anpassas efter enheten de körs på.

Var står vi idag?

Nuförtiden kommer inte dina kunder från en stationär Windowsdator. De kommer från olika enheter av olika fabrikat, storlekar och operativsystem. Antalet människor som rör sig på internet blir dessutom bara fler. I en prognos genomförd av Morgan Stanley Research Team förväntas användandet av mobilt internet att gå om användningen av stationär internetuppkoppling inom kort. Man kan därmed förvänta sig att det kommer vara vanligare med mobiltelefoner och tablets än traditionella datorer och laptops.

Genom att studera trender i internetanvändandet kan vi även dra slutsatsen att upp emot 60% av Sveriges befolkning kommer att ha tillgång till en surfplatta (tablet) och att upp emot 80% dagligen kommer att använda sig av mobilt internet från mobiltelefon eller surfplatta. Ökningen är mycket påtaglig.

Med ovan nämnt i horisonten är det viktigt att bygga webbplatser, intranät och applikationer med responsiva gränssnitt. Detta för att kunna möta strömmen av användare oavsett var de kommer ifrån – på deras villkor. Responsivt gränssnitt är a och o vid utformandet av nya internettjänster.

Hur fungerar responsiv webbdesign?

Responsiva gränssnitt tas fram enligt en annorlunda arbetsprocess jämfört med ett vanligt ”statiskt” gränssnitt. Fler personer måste involveras och arbetsgruppen måste alla ha förståelse för hur responsiv design fungerar. AD och webbdesigner måste tillsammans med beställare och utvecklare bestämma hur gränssnittets beteende ska fungera i form av skisser – innan designen utförs.

Arbetsmöten för responsiv design avser bestämma vilka brytpunkter som ska användas samt vad som ska hända layoutmässigt när de olika brytpunkterna nås. i. De vanligaste brytpunkterna är enligt följande: Desktop, Stående surfplatta och mobil. Däremellan anpassas innehållet med procentuell förminskning. Ofta utökar man antalet brytpunkter med två ytterligare mellansteg om designen är komplex och ytterligare layoutförändringar ska tillämpas.

Layoutförändringarna och brytpunkterna definieras därefter i CSS med stöd av viss JavaScript för att manipulera element.

Göra om till responsiv design

När man vill införa ett responsivt gränssnitt på en befintlig webbplats, intranät eller applikation innebär det ofta många konflikter i existerande gränssnitt då det ofta är mycket som måste skrivas om. IVEO har genom erfarenhet utvecklat ett ramverk för att förenkla denna process avsevärt.

Ramverket fungerar, i all korthet, som så att det trigga olika typer av funktioner när webbsidan når en viss bredd, ofta behövs modifieringar av DOM-trädet när man exempelvis når mobildesignen. Ramverket förenklar och stöttar upprättandet av sådana funktioner och resetfunktioner.

Vi har genomfört flera framgångsrika implementationer av responsiv design på befintliga, statiska, webbplatser och intranät. Vi arbetar med responsiva gränssnitt oberoende av plattform – vi har bland andra arbetat med EpiServer, Sharepoint, IBM Connections, Drupal, WordPress och Umbraco för responsiv design.