Wat is mobile first design?
Mobile first design is, zoals de naam al verklapt, een ontwerpstrategie waarbij webdesigners eerst kijken naar het ontwerp voor mobiele apparaten. De focus ligt hierbij op het optimaliseren van de UX (user experience) op mobiele telefoons. Hierna pas wordt er gekeken hoe het webdesign ook op desktop en tablet een goede invulling kan krijgen.
Dit is in tegenstelling tot de meer 'traditionele' aanpak responsive design. Hierbij wordt eerst de desktopversie van een website gebouwd, waarvan de layout zich vervolgens aanpast voor kleinere schermen.
Content prioriteren
Op een klein scherm kun je minder informatie kwijt. Bij mobile first design wordt daarom eerst goed nagedacht welke informatie prioriteit heeft om als eerste te tonen. Door de essentiële content eerst uit te denken, kun je op elk type beeldscherm gelijk de content tonen die belangrijk is voor de bezoeker.
Op mobiel wordt overbodige informatie, die anders wellicht in het ontwerp zou zijn gepropt, pas later getoond of zelfs helemaal weggelaten.
Waarom mobile first design?
Steeds meer mobiele internetgebruikers
Al in 2016 werd desktop internetgebruik ingehaald door mobiel internetgebruik¹. Inmiddels is zelfs meer dan 57% van het totale wereldwijde webverkeer via mobiele apparaten². Als simpelweg de meeste mensen een website bezoeken via hun telefoon is het belangrijk dat hier de prioriteit ligt.
Mobile first indexing door Google
Ook Google heeft al een tijd door dat mobiel webdesign steeds belangrijker wordt. Google vindt het zelfs zo belangrijk dat zij tegenwoordig ‘mobile first indexing’ hanteren³.
Dit betekent dat zij voornamelijk de mobiele versie van jouw website bekijken om deze te indexeren en beoordelen. Hoe beter je mobiele webdesign, hoe beter je wordt geïndexeerd. Hierbij kijken zij voornamelijk naar de technische kant van de website en de getoonde content.
Mobiel vriendelijkheid
Een ander punt waar Google je website vervolgens op beoordeeld is mobiel vriendelijkheid. Zaken als een te kleine lettertype, knoppen te dicht bij elkaar of een te brede website voor telefoonschermen wordt door Google gebruikt als maatstaf om jouw website hoger of lager te plaatsen in de zoekresultaten. Via deze tool van Google, kun je kijken of jouw website mobiel vriendelijk is.
Conversie optimalisatie
Door een ‘mobile first design’ te hanteren word je verplicht om na te denken over wat de bezoeker van jou wilt weten of zien. Wanneer jij op een heldere en krachtige manier je boodschap kunt overbrengen, zullen zij eerder geneigd zijn om met jou in zee te gaan.
Zo kan het bijvoorbeeld zijn dat je op mobiel een sfeerfoto als hero (grote bannerfoto bovenin) weg laat, zodat je gelijk je boodschap kunt overbrengen.
Op desktop is hier echter wel weer genoeg ruimte voor. De sfeerfoto kun je naderhand daarom toevoegen op de desktop versie. Heb je eerst de desktop versie gebouwd dan is de kans groot dat je deze foto alsnog op mobiel toont en je hiermee al de helft van het scherm inneemt.
Een hero foto tonen op mobiel is niet bij voorbaat slecht. Het is afhankelijk van de bezoekers zoekintentie.
Als iemand bijvoorbeeld op zoek is naar een fotograaf, dan zegt een foto weer meer dan woorden. Prioriteer daarom eerst welke informatie en content essentieel is voor jouw bezoekers.
Is mobile first design altijd noodzakelijk?
Het is een beetje afhankelijk van het doel van jouw website.
Zo zijn er bijvoorbeeld B2B branches waar de design prioriteit nog steeds bij de desktop schermen kan liggen. Dit omdat er bijvoorbeeld erg veel informatie gedeeld moet worden. In een geval als deze kan een responsive design beter zijn.
Bronnen:
- Gs.statcounter
- Oberlo
- Google Developers