Responsive webdesign, wat is dat eigenlijk?

Tegenwoordig browsen mensen op allerlei manieren op het internet. Meer en meer mobiel. We zijn in de afgelopen jaren getuige geweest van de geboorte en ontwikkeling van allerlei apparaten, smartphones, Tablets en meer.

Dit heeft geleid tot een vraag naar designers die nieuwe manieren konden bedenken om websites te maken die niet alleen toegankelijk zijn voor computer beeldschermen, maar ook voor al deze nieuwe apparaten.

Webdesign voor ieder apparaat en resolutie?

Het zou praktisch natuurlijk ondoenlijk zijn om bij de komst van een nieuw apparaat een nieuwe, aparte, website te maken. Webdesign en ontwikkeling wordt echter lastiger met al deze nieuwe resoluties en schermen die ieder apparaat weer heeft.

Responsive webdesign is een webdevelopment techniek dat het beeld schetst dat een design op een of andere manier in verschillende formaten, op verschillende apparaten te zien is. Het design past zich als het ware aan, aan de op dat moment gebruikte resolutie.

Responsive webdesign

Deze benadering suggereert dat er een optimaal design wordt getoond, om bijvoorbeeld gemakkelijker te kunnen navigeren, scrollen en lezen op de verschillende apparaten met de verschillende resoluties.

Responsive webdesign met CSS3

Responsive webdesign gebruikt CSS3 media queries, die het mogelijk maken om verschillende flexibele ‘grids’ en layouts voor een bepaalde website te gebruiken.

Als een gebruiker bijvoorbeeld van zijn laptop naar zijn iPhone switcht, dan wordt automatisch de iPhone resolutie aangenomen en de afbeeldingen en scripts worden ook aangepast aan het ontwerp van de iPhone.

Voordelen van het toepassen van responsive webdesign voor je website

Verbeterde toegankelijkheid – Door responsive webdesign te gaan gebruiken, wordt je website altijd toegankelijk voor iedereen.
Eenvoudiger navigatie – Websites, gebouwd voor mobieltjes zijn niet erg interessant op design gebied. Ingewikkelde navigatie wordt niet gebruikt. Responsive webdesign zorgt voor een efficiente gebruikservaring voor zowel de computer gebruikers, als ook voor de mobiele gebruiker.
Zoekmachine optimalisatie (SEO) – Iedere website heeft bezoekers nodig om populairder te worden. Wanneer je verschillende website versies voor verschillende apparaten hebt, de een voor een laptop, de andere voor een iPad, de volgende voor een Android, dan worden er meerdere links vanaf 1 website gestuurd voor verschillende platformen.

Dit principe is lastiger bij te houden en te onderhouden. Responsive webdesign zorgt dat je een website maakt en alle links zullen van en naar die ene website kunnen worden gestuurd.

Aan de slag met responsive webdesign

Betere toegankelijkheid, verbeterde SEO zijn zomaar enkele voordelen om zeker te overwegen om responsive webdesign toe te gaan passen. Een mooie uitdaging voor de hedendaagse webdesigner en developer.

4 Reacties

  1. Dag Bjorn,

    Bedankt voor dit informatief artikel over responsive webdesign.

    @Wouter J en Koen: Thanks voor jullie links. Is een mooie aanvullen & zeker interessant om lezen als je met webdesign bezig bent.

    Met vriendelijke groeten,
    Johan Santamaria

Een reactie achterlaten

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *