Wat is het verschil tussen responsive design en mobile first?

Responsive design is de techniek waarmee je site zich aanpast aan het scherm. Mobile first is de volgorde waarin je ontwerpt: van klein naar groot.

Ze sluiten elkaar niet uit, ze vullen elkaar aan.

Een site kan responsive zijn zonder mobile first te zijn ontworpen.

Waarom dat verschil merkbaar is

Een breed ontwerp dat je samenperst wordt een lange rij losse blokken. Een ontwerp dat vanaf de telefoon groeit, is op elk scherm rustig.

Meer daarover lees je bij mobile first.

In de code

Bij mobile first is je basisopmaak de mobiele opmaak, en voeg je toe voor grotere schermen. Andersom haal je juist dingen weg.

Meer daarover lees je bij css.

Waarom toevoegen beter werkt

Omdat je dan bewust kiest wat erbij komt, in plaats van toevallig te bepalen wat wegvalt.

Meer daarover lees je bij wat responsive design is.

Mijn vuistregels

1. Responsive is een eis.
2. Mobile first is de aanpak.
3. Basisopmaak is de mobiele opmaak.
4. Beoordeel je ontwerp eerst op een telefoon.

Die laatste verandert je hele gesprek met de klant.

Wat je ziet bij de verkeerde volgorde

Een mobiele weergave die aanvoelt als een restant: eindeloos scrollen, verdwenen inhoud en een menu vol items.

Meer daarover lees je bij accessibility.

Wat het kost om te herstellen

Meer dan het vooraf goed doen. Een bestaande site omdraaien betekent je opmaak grotendeels herschrijven.

Meer daarover lees je bij frontend.

Veelgestelde vragen hierover