Mobiel internet heeft desktop allang ingehaald. Meer dan de helft van al het webverkeer wereldwijd komt van smartphones. In sommige sectoren is dat zelfs 70 procent of meer. Toch worden veel websites nog steeds primair ontworpen voor desktop en daarna aangepast voor mobiel. Dat is de verkeerde volgorde.

Mobiel-first betekent dat je het ontwerp begint vanuit het kleinste scherm. Je bepaalt wat de meest essentiiele informatie is, hoe die het beste gepresenteerd wordt op een scherm van 375 pixels breed en hoe de gebruiker er doorheen navigeert met zijn duim. Pas daarna schaal je op naar tablet en desktop.

Waarom mobiel-first belangrijk is voor jouw bedrijf

De reden is simpel: jouw klanten gebruiken hun telefoon. Een ondernemer die op zoek is naar een accountant, googelt dat onderweg. Een woningzoeker die een makelaarskantoor opzoekt, doet dat op de bank met zijn telefoon. Een directeur die jouw naam heeft gehoord en hem even opzoekt, doet dat op zijn iPhone tussen twee vergaderingen in.

Als jouw website op die telefoon niet goed werkt, ben je kwijt. Niet omdat hij het bewust constateert, maar omdat hij het gevoel heeft dat iets niet klopt. Tekst die te klein is. Knoppen die te dicht op elkaar staan. Een menu dat niet werkt. Hij klikt weg voordat hij heeft gelezen wat je te bieden hebt.

Wat mobiel-first in de praktijk betekent

Mobiel-first is niet alleen een technische keuze. Het is een ontwerpkeuze. Het betekent dat je nadenkt over prioriteit. Welke informatie heeft de bezoeker het eerst nodig? Wat kan wachten totdat hij verder scrollt? Welke elementen zijn essentieel en welke zijn nice-to-have op een kleiner scherm?

Op desktop heb je ruimte om naast elkaar te plaatsen. Op mobiel is alles verticaal. Dat vraagt een andere structuur, een andere typografie en andere beeldselectie. Goede mobiele websites zijn niet desktop-websites die zijn ingeklapt. Het zijn websites die van de grond af zijn nagedacht voor het scherm waarop de meeste mensen ze bekijken.

Webflow en mobiel-first design

Webflow is gebouwd voor mobiel-first design. In de designer kun je per breakpoint, dus per schermgrootte, apart ontwerpen en aanpassen. Dat maakt het mogelijk om op mobiel andere afmetingen, andere volgorden en andere stijlen te gebruiken dan op desktop, zonder dat je twee aparte websites bouwt.

Elk project dat ik bouw is mobiel-first. Ik begin met het mobiele ontwerp, test het uitgebreid op echte apparaten en schaal daarna op naar tablet en desktop. Niet andersom.

Google en mobiel-first indexering

Google gebruikt de mobiele versie van een website als uitgangspunt voor de beoordeling en indexering van de site. Dat heet mobile-first indexing. Een site die slecht werkt op mobiel, scoort slechter in Google, ook als de desktopversie uitstekend is.

Een mobiel-first gebouwde website is dus niet alleen beter voor jouw bezoekers, hij is ook beter voor jouw vindbaarheid in zoekmachines. Twee vliegen in een klap, zonder extra inspanning.