Anno 2021 is de smartphone haast onmisbaar geworden in ons dagelijks leven. Bij het opstaan is het voor velen het eerste waar ze naar grijpen en het laatste wat ze wegleggen voor de ogen weer worden gesloten. Zijn we hem vergeten, dan rennen we ervoor terug het huis in. Want zeg nou zelf, een treinreis van een half uur lijkt zonder mobiel in de hand plots een eindeloze maanreis te zijn geworden. We kunnen en doen er alles mee, van chatten tot videobellen en van het beheren van sociale mediakanalen tot het urenlang surfen op het internet.

De smartphone overstijgt de desktop

Niet gek dus dat de opkomende urgentie rond de mobiele telefoon op websites veel druk uitoefent. Tegenwoordig wordt gemiddeld 50 procent van de websitebezoeken middels een smartphone uitgevoerd, wat de eisen rondom de websites flink heeft verhoogd. Websites moeten sneller dan ooit te laden zijn, want duurt het iets te lang, dan verhuizen we massaal door naar de concurrent om daar sneller bediend te worden.

Mobile first indexing door Google

Neem daar het gegeven bij dat ondertussen maar liefst 98,56% van de smartphonegebruikers in Nederland Google gebruikte en de keuze van de zoekmachinegigant om sinds september 2020 mobiele websites als eerste te indexeren (Mobile First Indexing) klinkt vervolgens als een logisch gemaakte stap. Veel webbouwers geven door deze ontwikkeling voorrang aan de mobiele versie van de website, omdat een kwart van alle internetgebruikers aangeeft zelden tot nooit gebruik te maken van een laptop of pc. En zie daar, ‘mobile first’ was geboren. In deze blog duiken we dieper in op de impact van deze trend en hoe jij jouw website hier aan kan laten voldoen.

Wat is mobile first?

Bij een mobile first-ontwerp staat een optimale en eenvoudige weergave op mobiele apparaten centraal, waarna deze later dynamisch schaalt naar de grotere schermen van bijvoorbeeld desktops. Voorheen was de desktopvariant het uitgangspunt en ‘zagen we wel’ wat er dan op de telefoon zou gebeuren. Gezegd moet worden dat het meestal nog niet eens zo verkeerd uitpakte, alleen duurde het relatief lang. Zware afbeeldingen van laten we zeggen 8mb, moesten door het toestel eerst gedownload worden, om ze vervolgens te comprimeren. Je kan je wel voorstellen dat dit de nodige seconden kost. Tijd om het roer om te gooien en met mobile first het proces om te draaien. Bij het nemen van de smartphone als uitgangspunt komt een waslijst aan strenge voorwaarden en verwachtingen kijken. Zo moeten alle elementen automatisch mooi naar het toestelformaat schalen en daarbij vliegensvlug blijven (vrij zijn van zware data dat ingeladen moet worden). Dit is het moment dat de term ‘responsiveness’ om de hoek komt kijken, wat doelt op de mate dat je website zich aan het scherm aanpast. Alle onnodige poespas qua plug-ins of irrelevante content moet worden verwijderd en gebruikersgemak moet voorop staan. Wat overblijft is een snelle, goed te lezen en te bedienen website. Kortom, de essenties.

Je raadt het al, mobile first is een stuk ingewikkeldere benadering dan die voor de traditionele desktopvariant, waarbij de webbouwer met een groot in te vullen 4:3 oppervlakte alle creatieve vrijheid had om de website uitgebreid aan te kleden. Op het kleine scherm van een smartphone is gewoonweg een stuk minder informatie per scroll te zien. Zwakke content valt haast niet meer te verbloemen met allerlei tierelantijntjes aan sliders en animaties die in het oog springen. Daarbij komt tot slot kijken dat de aandacht spanne op de telefoon ook korter is en je de bezoeker sneller moet weten te bedienen.

Zo maak je jouw website mobielvriendelijk

Terug naar de tekentafel. Als je mobiele apparaten leidend wil maken voor jouw website, dan gaat het er dus om dat zij licht en snel is. Dit betekent dat zij gestript moet worden van alle toeters en bellen en in principe alleen de basis over mag blijven. Schrap alles wat de gebruiker niet helpt of afleidt. Sta opnieuw stil bij de vragen over de cruciale doelen van de pagina en welke informatie de bezoeker hierbij nodig heeft. Houdt daarbij in je achterhoofd dat smartphonegebruikers soms andere content zoeken dan desktop-gebruikers. Waar desktop-gebruikers in alle rust jouw artikelen kunnen lezen en video’s bekijken, is de smartphonegebruiker in haar bezoek wellicht alleen opzoek naar de adresgegevens van je zaak. Wat verwacht jouw bezoeker en wat heeft zij echt nodig om de belangrijkste doelen van jouw website uit te voeren? Vermijd hierbij alle moeilijk aan te klikken knoppen en beperk de site alleen tot de buttons die er echt toe doen. Houd de content ook centraal op de pagina, waarbij de linker- en rechterkanten (zoals we daar voorheen op de desktopvarianten graag lange balken plaatsten) leeg blijven. Dit geldt niet alleen voor de homepage, maar elke pagina moet dezelfde look & feel hebben als de landingspagina.

Wees je er van bewust dat deze ontwerpen op een groter scherm er onverwacht smal en leeg uit kunnen zien. Content dat zich alleen op desktop laat toevoegen vangt dit probleem op, maar het probleem wordt het beste opgevangen wanneer de webbouwer met blokken werkt. Op die manier zullen alle blokken op de smartphone verticaal onder elkaar staan en heeft de desktop de mogelijkheid deze blokken ook horizontaal het scherm te laten vullen. Het is aan de schrijver van deze content om ervoor te zorgen dat al deze blokken individueel op zichzelf staan, waarbij de positionering niet uitmaakt.

De mobile friendly test van Google

Weten of jouw website mobielvriendelijk is? Google heeft de mobile friendly test in het leven geroepen, waarmee je dit simpel en gratis kan laten beoordelen.

Start vandaag nog met het optimaliseren voor Mobile First!

Eerlijk is eerlijk, mobile first eist niet niks van je website. Het kan misschien voelen als een pauw die van haar kleurrijke veren wordt beroofd, maar dat neemt niet weg dat dat nou eenmaal de tijd is waarin we nu met z’n allen leven. Mensen internetten niet meer alleen thuis of op kantoor, maar doen dit op hun smartphone waar en wanneer zij willen. Elke website-eigenaar ziet zijn of haar website graag goed bezocht worden en dat deze hiervoor tegenwoordig snel en overzichtelijk moet zijn, is een onontkoombare (en logische) ontwikkeling. Het is nu of nooit om op de rijdende trein te springen.