Responsive design van jouw website

Met responsive webdesign wordt op alle apparaten dezelfde code weergegeven en wordt de weergave aangepast op basis van de schermgrootte. Omdat inmiddels het meest gebruik gemaakt wordt van smartphones, wordt dit door Google nu ook als norm gesteld.

Met name oudere websites zijn ingericht om op een desktop computer bekeken te worden. Klik hier voor een kort overzicht van de ontwikkeling in de laatste 20 jaar. Sinds 2017 zien we evenwel in de statistieken dat meer website bezoek plaatsvindt via mobiel en tablet dan via desktop computers. Dat betekent ook dat bij de realisatie van een website met de weergave op deze kleinere schermen rekening moet worden gehouden.

Het lijkt alsof mobiele devices al een eeuwigheid bestaan, maar de iPhone werd pas in 2007 geïntroduceerd en de iPad pas in 2010. In 10 jaar zien we daarmee een aantal veranderingen: aan de ene kant worden de computerschermen steeds groter en gaat de resolutie naar HD (1080x1920px) en hoger, aan de andere kant worden de tablet en de smartphone steeds vaker gebruikt voor internet en surfen. 

Hoewel moderne smartphones ook HD schermresolutie hebben, is voor de leesbaarheid een browserresolutie van 360x640px meest populair. Dit vraagt toenemend flexibiliteit van zowel de website als de webdesigner: de schermbreedte varieert van 360px tot ruim 3500px, en de website moet zich als een elastiekje aan al deze verschillende schermbreedtes aanpassen. Dat bereiken we met responsive of fluid design.

Een responsieve website is gebruiksvriendelijk op een klein formaat scherm:

  • Verkleinde maar goed leesbare lettergrootte;
  • De content verbergen die niet essentieel of relevant is;
  • Klikbare links en buttons niet te dicht bij elkaar geplaatst.

Ook Google checkt of de website geschikt is voor mobiele devices. Dat is dus tevens een must om een goede positie in de zoekresultaten te krijgen. Check dus ook zelf of jouw website geschikt is voor kleinere schermen: Mobielvriendelijke test -Google Search Console