Här följer några exempel på hur man tycker sig ha följt det nya buzzwordet men inte nått hela vägen fram. SVT har gjort det nu och då blir det ofta legitimt att alla andra följer efter - särskilt de statliga organisationer som vill ligga i framkant.
Man kan säkert tolka innebörden av responsiv design på många sätt, men om man utgår från Ethan Marcotte som trots allt myntade uttrycket så är grunderna vi alla verkar vara eniga om:
Med andra ord ska det vara ett kolumn- och rutsystem som flyter över tillgänglig yta, bilder och annan media ska vara flexibelt över tillgängligt utrymme, och sist men inte minst har man brytpunkter satta för hur layouten anpassar sig inom vissa storleksintervall.
Några andra nyckelingredienser han tar upp i sin bok Responsive Web Design är:
Att följa denna hypade filosofi innebär att man fortfarande måste ta samma hänsyn som tidigare. Responsiv design är inte en ursäkt för att göra en tveksam webb. Nedan har jag plockat fram några kända som okända exempel på responsiv design och pekat på vad man kunnat göra bättre.
StaffanstorpStaffanstorp var förmodligen först ut bland kommunerna med att jobba responsivt och har gjort ett bra resultat för sitt tidiga försök.
Men hur de kom fram till att 60-årsfirandet skulle drabba mobilbesökare övergår dock mitt förstånd, åtminstone delen att det inte gick att förklara för vem som nu bestämde det hela att det var en mycket dålig idé. Nu liknar deras startsida något som påminner om 90-talets förskräckliga splashsidor - alltså introsida som glatt hälsar dig välkommen och annat som inte gynnar besökaren.
Både har och jobbar för närvarande inom en politikerstyrd organisation. Det behövs inte särskilt stor fantasi att tänka sig att _all_ extern kommunikation _måste_ primärt förklara denna högtidshändelse för kommunen - oavsett om du egentligen har alldagliga ärenden som berör dagis eller sophämtning så får du under hela 2012 inte missa 60-årsfirandet.
Gissa vad som händer om du klickar på 60-årsbannern? Jo, sidan laddas om och ser precis likadan ut vilket belyser felet med att ha en sådan enorm puff där, man förstår inte nödvändigtvis var man kom.
Positivt:
Negativt:
BonnierPå Bonniers webbplats möts man av "Continuously reinventing media" och visst är de relativt tidiga för sin bransch med att bygga en webbplats på detta vis.
Det är uppenbart att de kämpat på med något stilrent som ändå ska sticka ut.
Skulle gissa att de tycker man ska få surfa på deras webb även i fullskärm. Här sitter undertecknad på 2560 x 1440 pixlar vilket gör bilderna så klart ganska oskarpa. Man kan inte vänta sig annat.
Notera hur de slitit för att få en titthålsfunktion på vissa bilder som egentligen ligger i bakgrund. Det är inte lätt att testa det där i alla tänkbara upplösningar så det inte uppstår underligheter.
Positivt:
Negativt:
Tar min egen sajt som exempel bland många som förlitar sig på ett designramverk som inte riktigt håller måttet utan massiva justeringar. Här talar jag om ramverket Twitter Bootstrap som visserligen har en hel del förtjänster men som döljer komplexiteten i att göra ett gott hantverk med designen.
Det man lätt luras till med dessa ramverk är att det knappt kräver någon ansträngning, alternativt halvvägs in i ett projekt nöjer sig med att ha en brytpunkt för Iphone, en för Ipad och en för desktop-datorer. Det är inte direkt responsivt om man ska hårddra det. Se bildexemplet ovan, massor med oanvänt utrymme genom någon bugg i media queries och det blandas friskt i antalet kolumner inom den enda huvudsakliga kolumnen.
Positivt:
Negativt:
Sen har jag förmånen att känna en del 90-talister som är ganska svåra att göra nöjda med en webbplats, åtminstone när den körs via en mobil. En av dem, Linus, sa något med denna andemeningen tidigare angående responsiv design:
Kul, kul, åtminstone för er halvblinda gamlingar som kör Iphone med liten skärm. Normalt sett är den vanliga webben mer användbar så ge mig för tusan chansen att zooma ut och bestämma själv vad jag får se.
Vad tycker du om responsiv design? Lämna din kommentar, var nu kommentarsfältet ligger i din webbläsare :)
Publicerad 2012-05-31 av Marcus Österberg
