Het gebruik van tablets en smartphones om websites te bezoeken blijft stijgen. Meer dan de helft van de Nederlanders beschikt al over een tablet. En het aantal smartphones heeft het aantal PC’s overtroffen. Het is duidelijk: je website moet er ook goed uitzien op tablet en telefoon. De oplossing is Responsive Webdesign.
Responsive Webdesign
Responsive Webdesign (ook vaak Responsive Design genoemd) is de naam van een nieuwe techniek, die er voor zorgt dat je website zich automatisch aanpast aan het scherm van de bezoeker. De volgende afbeelding maakt het duidelijk:
De afbeelding links toont de niet-responsive versie van de website. De site past zich totaal niet aan het kleine scherm van de telefoon aan. De website wordt botweg verkleind en is daardoor onleesbaar geworden.
Rechts past de website zich duidelijk wel aan het kleinere scherm van de smartphone aan. Deze website is volgens Responsive Webdesign gemaakt.
De afbeelding laat dus in één oogopslag zien, hoe belangrijk het is dat je website zich aan de verschillende beeldschermen (mobiel, tablet, desktop) aanpast.
Hoe werkt Responsive Design?
Bij Responsive Design wordt de website steeds anders opgebouwd, afhankelijk van het scherm.
Een van de belangrijkste dingen is dat de breedte van de site zich aanpast aan het grootte van het scherm. De site mag nooit breder zijn dan het scherm. Want je wilt niet dat delen van de site links en rechts buiten het scherm vallen.
Om de leesbaarheid te vergroten kun je verder als websitebouwer op een groot scherm de teksten iets groter tonen en op een klein scherm iets kleiner.
Een ander voorbeeld betreft de zijbalk. Veel websites hebben één of meer zijbalken, waarin bijvoorbeeld contactgegevens, of extra’s als Twitter-berichten staan. Op een computerscherm is deze opbouw mooi en functioneel, maar op een telefoon is er eigenlijk geen plek voor zo’n zijbalk. Bij Responsive Webdesign wordt de inhoud van de zijbalk daarom op kleine schermen netjes onder de hoofdinhoud geplaatst.
Duidelijk op ieder scherm
Dit zijn slechts een paar voorbeelden van aanpassingen die bij Responsive Webdesign worden gebruikt. Maar in alle gevallen zorgt deze nieuwe techniek er voor dat de site op ieder scherm duidelijk, mooi en goed leesbaar is.