Responsive webdesign: wat is het?

Wouter Dragt
Geplaatst op 19 juni 2013

Met de komst van laptops, smartphones en tablets is het internet steeds mobieler geworden. Waar we vroeger alleen met een desktopcomputer vanaf thuis, het werk of de bibliotheek websites bezochten kan dit tegenwoordig met een laptop, smartphone of tablet vanaf elke willekeurige locatie. De enorme diversiteit aan apparaten en schermresoluties vraagt om een andere benadering en presentatie van informatie op websites. Een oplossing hiervoor is het responsive webdesign.

responsive_design_devices2-680x359

Wat is responsive webdesign?

Als we de term responsive webdesign letterlijk vertalen komen we tot: “antwoordend ontwerp”. Dit klinkt wat gek maar omschrijft precies wat responsive webdesign doet. De website luistert namelijk naar de bezoeker zijn schermformaat en type apparaat en beantwoordt dit met een afgestemd ontwerp. Op deze manier wordt een optimale gebruikerservaring gecreëerd door de inhoud en vormgeving van de website af te stemmen op het formaat van het scherm van de bezoeker.

Hieronder een schematische weergave van een aantal schermformaten waarvoor een website afgestemd kan zijn door middel van responsive design.

680x298xresponsive_design_sizes2-680x298.jpg.pagespeed.ic.6se81E7atx

Wat zijn de voordelen van responsive webdesign?

Één van de meest aantrekkelijke redenen om een responsive website te hebben is het aanbieden van één website die een optimale gebruikerservaring biedt op meerdere apparaten. Doordat inhoud en vormgeving van de website mee schalen met het formaat scherm van de bezoeker, ervaart de bezoeker een constante look & feel ongeacht het apparaat waarmee de website bezocht wordt. Daarnaast hoeft geen specifieke website voor mobiele gebruikers ontwikkeld te worden. Dit maakt het onderhouden en optimaliseren van de website ook makkelijker en overzichtelijker. Over het algemeen vergt een responsive website minder tijd om te ontwikkelen dan een mobiele website, vooral als hier in de ontwerpfase al rekening mee gehouden wordt.

Een ander belangrijk argument is dat Google groot promotor van responsive webdesign is. Zij sporen web ontwikkelaars aan om voor responsive webdesign te gaan omdat bezoekers maar één adres gebruiken in plaats van een specifiek adres ingericht voor mobiele bezoekers (bijvoorbeeld m.website.nl). Google geeft de voorkeur aan een website die op één adres te benaderen is waardoor bezoekers makkelijker informatie kunnen delen. Daarnaast hoeven de zoekmachines van Google maar één URL en dezelfde set HTML te indexeren. Allemaal factoren die meewegen in de ranking van een pagina op Google.

Voorbeelden van responsive webdesign

Responsive webdesign PvdA

www.arnhem.pvda.nl

Responsive webdesign Lokale overheid

www.kpnlokaleoverheid.nl

Responsive webdesign World connectors

www.worldconnectors.nl

Blijf op de hoogte!

Wouter Dragt

Als professioneel designer denkt Wouter altijd net een beetje anders om zo tot een verrassend resultaat te komen. De ultieme gebruikerservaring staat bij hem altijd hoog in het vaandel. Daarom gaan zijn blogs over beleving en verleiding van de websitebezoeker.

Meer over Wouter