Responsivt webdesign: Få et site der tilpasser sig alt

Et website er ikke længere bare en side, som bliver vist i et browservindue i noget nær A4-størrelse på en pc solidt placeret på skrivebordet. Mange hiver mindre udstyr op ad lommen eller tasken og går på nettet fra sofaen, busturen eller sågar toilettet.

Hvad de ser på smartphonens eller tablettens mindre skærme, afhænger af, om websitet kan matche andre formater end klassisk desktop.

Hvis sitet er designet responsivt, tilpasser det sig, så du bliver præsenteret for indholdet i en form, som er optimeret til netop din skærmstørrelse og –opløsning. Og indholdet er til at gå til, uanset om du bruger et almindeligt tastatur, en mus eller fingrene.

Hvis ikke, risikerer du at skulle scrolle både op, ned, til højre og venstre og zoome ind og ud for at orientere dig i detaljerne på et site, der mest af alt ligner uldtøj efter kogevask.

Snart er smartphones og tablets hvermandseje

2012 er blevet kaldt smartphonens år i Danmark.

Effekten er tydelig. I februar registrerede de fem største nyhedsmedier i Danmark f.eks. 8 mio. unikke besøg og 64 mio. sidevisninger på deres dedikerede mobilsites. Normalt trækker Politiken, TV2, Ekstra Bladet og de andre medier ganske vist også mange besøgende til deres websites. Det gør de sådan set stadig. Men mobiltrafikken er blevet ni-doblet på blot to år.

Det ene øjeblik tilgår vi altså et website fra pc’en, det næste øjeblik fra smartphone eller tablet.

Nye trends kræver fleksibelt indhold

Udviklingen kræver en revolution af den måde vi udvikler på, hvis vi skal sikre en god oplevelse på de mange forskellige skærmtyper:

”Frem for at skræddersy afkoblede designs til hver af det stigende antal enheder med internetadgang, kan vi behandle dem som facetter af den samme bruger-oplevelse”, forklarer ophavsmanden til begrebet responsivt design, design- og softwareudvikleren Ethan Marcotte.

Men han pointerer, at valget af løsning afhænger af business casen og organisationen bag websitet. Det kan fx være en redaktionel udfordring at udvikle indhold, som fungerer lige godt på tværs af platforme.

Flydende overgange eller faste formater

Grundlæggende består valget i fremtidens webudvikling mellem at designe et dedikeret site til hhv. desktop, laptop, smartphone, tablet og kommende generationer af gadgets eller designe et samlet fleksibelt site, som tilpasser visningen til brugerne.

”Blot at bruge responsivt design til at gøre et website tilgængeligt på mobile enheder resulterer i ringe mobile brugeroplevelser”.

Nyhedsmedierne har indtil videre valgt dedikerede mobilsites. Gør du fx browservinduet med politiken.dk meget mindre på din laptop, får du bare vist et hjørne af sitet.

Gør du det samme med jyskebank.dk, får du et resultat, som ligner et mobilsite med store, simple knapper. Log-on til netbank er øverst, dernæst kommer nyheder og i bunden diverse genveje til lån, valuta, bolig og meget mere. Rækkefølgen er et udtryk for, hvad banken gerne vil præsentere dig for.

Indhold til toilettet og kontoret

Jyske Bank er et af de indtil videre få danske eksempler på forsøg med responsivt design. Banken prøver at skabe særligt platformstilpassede indgange til det samme indhold. Indholdet er med andre ord omdrejningspunktet. De mindre formater tager med sine store touch-indbydende knapper på forsiden højde for, at tablets og smartphones som oftest betjenes med fingrene frem for en mus og et traditionelt tastatur.

Udviklingen inden for især smartphones, tablets og responsivt webdesign udfordrer det, den danske internet-entreprenør, Janus Boye kalder ”desktop-mindsettet”: En mental, vanemæssig og organisatorisk barriere i udviklingen af webløsninger, der skal overvindes.

Målet er at lave indhold, som kan læses lige så godt fra toilettet som fra kontoret.