Wat is het verschil tussen mobile first en responsive?
Het verschil tussen mobile first en responsive zit in wat ze beschrijven. Responsive is de techniek waarmee je site zich aan het scherm aanpast; mobile first is de volgorde waarin je ontwerpt.
Een site kan dus responsive zijn zonder mobile first te zijn.
Dat is precies waar het vaak misgaat.
Responsive
Je opmaak reageert op de schermbreedte: kolommen vallen onder elkaar, tekst herschikt zich, afbeeldingen krimpen mee.
Meer daarover lees je bij breakpoint.
Mobile first
Je begint met het kleinste scherm en voegt pas daarna toe voor grotere. De mobiele versie is het uitgangspunt en niet het restant.
Meer daarover lees je bij wat mobile first is.
Waarom een responsive site toch slecht kan zijn op mobiel
Omdat alles er nog steeds op moet passen. Een breed ontwerp dat je samenperst, levert een lange rij losse blokken op.
Meer daarover lees je bij grid.
Mijn vuistregels
- Responsive is een eis, geen prestatie.
- Ontwerp vanaf de kleine kant.
- Kies wat er op mobiel wegvalt, laat het niet toevallig gebeuren.
- Beoordeel je ontwerp eerst op een telefoon.
Die derde is het echte verschil tussen beide aanpakken.
Hoe je ziet welke je hebt
Maak je browservenster smal. Wordt je pagina rustiger, dan zit het goed. Wordt hij een eindeloze stapel, dan is hij alleen responsive.
Meer daarover lees je bij hero.
Wat Google verwacht
Eén site die op elk scherm werkt. Hoe je daar komt, laat hij aan jou.
Meer daarover lees je bij pagespeed.