Responsive design, wat is het?

Responsive betekent reagerend. Responsive design past zich aan aan het apparaat waar deze op wordt bekeken. Tegenwoordig wordt er ook veel op tablets en smartphones op het web gesurft. Een traditionele website wordt dan niet optimaal getoond. Er verschijnen scrollbalken en om de tekst te kunnen lezen moet er veel worden gepincht en ingezoomd.

Wat is een responsive design?

Een responsive website past zich aan aan de grootte van het scherm en kan zo de website op een andere manier presenteren. Vaak worden afmetingen opgegeven in percentages in plaats van in pixels. Ook wordt een zijbalk vaak onderaan de inhoud getoond zodat de inhoud zelf prettiger te lezen is. Een ander belangrijk punt is de navigatie: deze moet vaak anders getoond worden op een smartphone aangezien hier (horizontaal) veel minder ruimte voor is.

Responsive design gaat echter verder dan dit. Soms kunnen lappen tekst of een over ons-pagina beter verborgen worden, aangezien mensen op een smartphone aanzienlijk minder tijd hebben om te lezen. Hiernaast moeten bepaalde elementen anders worden vormgegeven omdat er op een smartphone bijvoorbeeld veel minder horizontale ruimte beschikbaar is.

Voordelen van responsive design

Hopelijk is het nu duidelijk wat responsive design is. Maar wat zijn nu de voordelen van een responsive website?

Gebruikersgemak

Het is, vooral voor de smartphonebezitters onder ons, erg vervelend om continue te pinchen om een stuk tekst te lezen. Ook het invullen van formulieren op een niet-reponsive website is zeker geen pretje. Een reponsive website kan de gebruiker dus een betere gebruikerservaring bieden en het gemakkelijker maken om van de website gebruik te maken.

Zoekmachine-vriendelijk

Een responsive website is goed voor zoekmachines en helpt dus mee met SEO. Zoekmachinereus Google geeft duidelijk aan dat websites die niet mobielvriendelijk zijn het steeds lastiger gaan krijgen in de zoekmachineresultaten.

Gemakkelijker beheer

Een reponsive website bedient meerdere apparaten tegelijk en kan zelfs een mobiele app vervangen. Ook aparte mobiele websites zijn hiermee verleden tijd. Hierdoor is er maar één website die ontwikkeld en beheerd hoeft te worden. Teksten en andere inhoud hoeven dus maar op één plek aangepast te worden.

Nadelen responsive design

Naast de voordelen zijn er helaas ook nadelen.

Hogere ontwikkelkosten

Het maken van een responsive website brengt hogere kosten met zich mee dan het maken van een traditionele website. Naast meerdere ontwerpen, voor de verschillende soorten apparaten, moet ook op technisch gebied meer gedaan worden om de website te optimaliseren voor tablets en smartphones.

Grotere bestanden

Bij een responsive website worden er vaak grotere bestanden gebruikt dan bij alleen maar een mobiele website. Aangezien er rekening gehouden moet worden met verschillende breakpoints en schermgroottes zijn bijvoorbeeld de afbeeldingen en de CSS-bestanden (waar de stijl en layout van de website in wordt opgeslagen) groter dan bij een mobiele website. Dit betekent een langere laadtijd. Met de komst van snellere internet- en 4G-verbindingen hoeft dit niet altijd een probleem te zijn.

Conclusie

In dit artikel zijn de voor- en nadelen van een responsive website beschreven. Hieronder een korte samenvatting. Een responsive website:

• Helpt mee met het gebruiksgemak, waardoor de website gemakkelijker te gebruiken is
• Is zoekmachine-vriendelijk en scoort dus hoger in Google
• Is gemakkelijk te onderhouden, en kan een mobiele website of app vervangen

Hopelijk heeft dit artikel een duidelijker beeld gegeven over responsive webdesign. Wil je nog wat voorbeelden zien? Bekijk dan onze lijst met de mooiste responsive websites.