Mobile responsive

Mobile responsive webdesign betekent dat je zorgt, dat jouw website zich aanpast aan de grote en het type scherm waarop het vertoond wordt. Zo zorg je ervoor dat de website schaalt, maar dat teksten toch leesbaar blijven voor de gebruikers, ook op een klein scherm zoals een smartphone. Niet te verwarren met mobile adaptive, waarbij er niet een geschaalde maar een aangepaste weergave op verschillende apparaten wordt getoond.

Mobile responsive in de praktijk

Tegenwoordig is het aan te raden om een 'mobile first' filosofie te gebruiken. Bij een mobile responsive website wordt de website live opgebouwd aan de hand van het schermformaat, ook als deze tijdens het bezoek wijzigt (bijvoorbeeld als je op een desktop het browservenster verkleint).



Mobile responsive is de meest gangbare vorm om een website mobiel vriendelijk te maken. Wanneer je met Wordpress werkt dan zullen de meeste moderne design thema’s al responsive zijn. Test wel altijd eerst op je eigen telefoon en in de mobile friendly tool van Google of je gekozen thema netjes uitpakt op een mobiel apparaat voordat je een hele website in dat thema gaat ontwikkelen.

Flexibele grids en afbeeldingen

Deze passen zich aan, aan de breedte en hoogte van het scherm, of worden zelfs helemaal niet vertoond.

Breakpoints

Door een minimum schermbreedte vast te leggen (vaak een veel voorkomend formaat van een gangbare iPhone of iets dergelijks) voorkom je dat jouw website getoond wordt op een te klein scherm. Het is dan beter de gebruiker dit te laten weten, dan een slechte gebruikerservaring gewoon te laten gebeuren.

Lettertypes schalen

Als je de fontgrootte behoudt van een desktopscherm naar een mobiele-telefoonscherm, dan worden het net mieren die over het scherm krioelen. Het is daarom van belang om te zorgen dat de fontgrootte wordt aangepast. Zorg ook dat de tekst netjes afbreekt, om horizontaal scrollen op een telefoon te voorkomen.

Responsive, adaptive of een mobiele website?