Wat is de invloed van een mobielvriendelijke website op uw vindbaarheid?

Geplaatst op 05-03-2020 om 10:30 in SEO

Met de komst van de mobiele telefoon zijn we zelfs onderweg actief op het internet. Het is dan ook geen wonder dat websites voornamelijk via een mobiel benaderd worden. Maar wat is nu eigenlijk de invloed van het hebben van een responsive of mobiele website op de vindbaarheid van uw website?

Een goede website dient ook mobielvriendelijk te zijn. Zoekmachines als Google, Yahoo, DuckDuckGo en Bing letten hierop. Wat de zoekmachine doet met de mobielvriendelijkheid van uw website verschilt per zoekmachine. Echter de grootste speler (Google, met 98,3% van het mobiele zoekverkeer in Nederland) bestraft uw website als deze niet mobielvriendelijk is. Hierdoor scoort u lager u lager in de zoekresultaten. Om te zorgen dat u gevonden wordt bij de grootste speler in Nederland, is het dus belangrijk om een responsive website te hebben.Verder op deze pagina leggen we uit waarom dit zo is en hoe het werkt.

Welke soorten mobielvriendelijke websites er zijn

Laten we eerst duidelijkheid krijgen over wat een mobielvriendelijke website precies kan zijn. Er zijn twee mogelijkheden: een responsive website of een mobiele website.

Mobiele website

Deze methode werd meer dan 10 jaar geleden veel gebruikt. Rond het jaar 2006 kwamen de eerste smartphones zoals we ze nu kennen op de markt. In 2007 kwam dan de eerste iPhone, met de mogelijkheid om op een touchscreen te internetten op een mobiele telefoon en apps te downloaden. In 2008 volgde Google met Android, een ander besturingssysteem. Mobiel internetten is vanaf dat moment dan ook niet meer weg te denken uit ons dagelijks leven.

Een goede website op een mobiel werd vanaf 2007 steeds belangrijker. Hiervoor maakten bedrijven een specifieke mobiele website die in plaats van de volledige desktopwebsite werd getoond. Vandaag de dag bestaan ze nog steeds. U herkent ze vaak aan de url waarin een subdomeinnaam wordt genoemd, bijvoorbeeld ‘m.websitenaam.nl’ of ‘mobiel.websitenaam.nl’.

Wanneer er sprake is van een mobiele website, heeft u als het ware twee websites. U heeft dus dubbel zoveel werk om de websites te onderhouden en bij te werken wanneer er nieuwe informatie is. Hierbij wil het vaak zo zijn dat de mobiele variant minder of compactere informatie bevat. U selecteert de informatie die u belangrijk vindt, maar hierbij loopt u risico dat uw bezoeker niet de informatie vindt waarnaar hij op zoek is. Het effect hiervan op uw vindbaarheid bespreken we later in dit artikel.

Responsive website

Twee websites onderhouden is omslachtig. Doordat in de periode 2006 tot nu er steeds meer varianten van schermen en resoluties uitkwamen, zag de mobiele website er ook steeds anders uit op ieder apparaat. Rekening houden met alle schermen werd ook steeds lastiger. Een mobiele website bleek niet flexibel genoeg om alles op een juiste manier te vertonen.

In 2010 kwam Ethan Marcotte met een geheel nieuwe wijze van webdesign: het responsive webdesign.

Bij een responsive design zijn de pagina’s flexibel opgebouwd. Er wordt gekeken naar uw schermgrootte (landschap- of portretmodus telt zeker ook mee), uw schermresolutie en wat voor apparaat u gebruikt. Aan de hand daarvan wordt de paginalay-out ingedeeld en vormgegeven. Er is hierbij sprake van slechts één website en u hoeft dan ook maar één website te onderhouden.

Wat is beter voor de vindbaarheid in zoekmachines: een mobiele website of responsive website?

Een goed vindbare website biedt de zoeker de informatie waarnaar hij op zoek is. Bij een mobiele site is vaak sprake van een minimalisering van informatie, zoals we eerder al noemde. Daarnaast staat een mobiele website op een ander domein: een subdomein. Uw mobiele website staat bijvoorbeeld op ‘mobiel.website.nl’ en het hoofddomein is ‘website.nl’. Deze worden dus als twee verschillende webpagina’s gezien.

Het komt uw vindbaarheid ten goede om slechts één website te hebben. Het betreft namelijk dezelfde informatie, maar op een andere manier weergegegeven. Een responsive website is dus beter.

De factoren voor een responsive website die een rol spelen in uw vindbaarheid

Dus een responsive website is beter voor uw vindbaarheid, maar hoe kunt u nu een responsive website herkennen?

Wanneer er een responsive website wordt ontworpen, wordt er naar de volgende 4 factoren gekeken:

  1. Leesbaarheid
  2. Navigatie
  3. Scrollen
  4. Snelheid

Een mobiel scherm is natuurlijk een compleet ander formaat dan uw PC- of laptopscherm. De teksten die getoond worden, dienen leesbaar te zijn zonder dat u moet inzoomen. Dit wordt beïnvloed door bijvoorbeeld het lettertype dat u gebruikt en de lettergrootte.

U kunt ervoor kiezen om op mobiele apparaten een grotere letter te gebruiken dan op een desktop.

Witruimte

Ruimte tussen de elementen op een pagina, wat invloed heeft op de leesbaarheid van teksten, noemen we witruimte.

Wanneer alles - teksten, afbeeldingen, invoervelden en meer - dicht op elkaar staat, wordt een website erg onleesbaar. Dit geldt al op een desktop, maar al helemaal op een mobiel.

Zorg dus voor voldoende ruimte tussen de verschillende elementen op uw pagina’s. Een webdesigner kan u daarin adviseren.

Links

Het is gebruikelijk dat uw pagina’s links bevatten. Dit kan in de vorm van knoppen, direct in de tekst of een andere vorm, zoals een afbeelding.

Op kleinere schermen is het aantikken van een link lastiger. U doet namelijk met een vinger tikken in plaats van met een muis. Dit kan minder precies zijn. Zorg daarom voor voldoende ruimte tussen verschillende links.

Bij knoppen kunt u dit doen door meer witruimte te gebruiken, bij links in tekst kunt u de regelafstand vergroten zodat er niet per ongelijk op de link op de regel erboven of eronder getikt kan worden.

Het is belangrijk dat uw websitebezoekers makkelijk door uw pagina’s kunnen navigeren. Daarbij is het echter niet de bedoeling dat de helft van een mobiel scherm wordt ingenomen door de navigatie.

Hoe u uw navigatie indeelt, hangt sterk samen met hoeveel links u in uw navigatie heeft. Bij twee of drie links volstaan wellicht tabbladen, mits de tekst op iedere tab niet te lang is.

Wat u vooral veel zult zien wanneer u websites op uw mobiel bezoekt, is het hamburger menu. Dit zijn drie horizontale streepjes, samen één knop dat een menu openklapt wanneer u erop klikt.

Mocht u er niet zeker van zijn wat het beste bij uw website past, dan kunt u een webdesigner om advies vragen.

In de jaren 90 was er het idee dat het grijpen van de aandacht op een website op dezelfde wijze als in een magazine ‘voor de vouw’ (before the fold) moest gebeuren. Nog voordat men gescrold had. Met de komst van trackingsoftware bleek dit echter een fabeltje. Sterker nog, 65,7% van de aandacht voor een website vindt plaats ná het openingsscherm.

Op elke website scrollen we tegenwoordig, daar is bijna niet aan te ontkomen. Zeker wanneer er veel content aanwezig is. Scrollen is ook helemaal niet erg, mits dit alleen van boven naar beneden is.

Naast verticaal scrollen op een website, is het ook mogelijk om horizontaal te scrollen. Tegenwoordig ook wel te verstaan onder: swipen.

Hoewel het technisch gezien mogelijk is om de gehele website horizontaal te scrollen, is dit af te raden op zowel dedesktopversie als de mobiele versie. Het is namelijk niet gebruiksvriendelijk en gaat tegen iedere verwachting in.
Een goede toepassing van horizontaal scrollen, ofwel swipen, is het bladeren door een losstaande module op de website. Denk hierbij aan een slider met foto’s of een folder.

Naast het scrollen van de gehele pagina of het swipen van een losstaande module, is het ook mogelijk om een klein element verticaal te laten scrollen in een pagina die niet scrolt. Denk hierbij aan een tekstblok waarin een scrollbalk te zien is. Dit is volstrekt onnodig en doordat de browser vaak zijn eigen vormgeving geeft aan de scrollbalk, doet het ook afbreuk aan het ontwerp van uw website.
Daarbij kan het onhandig zijn op kleinere schermen, zoals een mobiele telefoon.

Een voorbeeld van een module waarin zowel horizontaal als verticaal swipen mogelijk is en waarbij dit op de mobiele telefoon in het verleden voor verminderd gebruiksgemak zorgde, is de implementatie van een landkaart module, zoals Google Maps op een website. Het inzoomen en verplaatsen van enkel de landkaart veroorzaakte in sommige gevallen dat dit de gehele website inzoomde of verplaatste, of al begon terwijl men er aan voorbij wilde scrollen.
Tegenwoordig vereisen dit soort modules een extra handeling om dit te voorkomen. Bijvoorbeeld door twee vingers te gebruiken binnen de module, zodat alleen de landkaart in de zoomt of verplaatst en niet de hele website meebeweegt.

De snelheid van een website is één van de belangrijkste factoren. Dit wordt beïnvloed door het netwerk waarop de gebruiker zit (Wi-Fi, 3G, 4G of 5G), maar u heeft er zelf ook zeker invloed op.

Het draait hierbij voornamelijk om hoeveel er binnengehaald moet worden om uw website te tonen aan de bezoeker. Oftewel, hoeveel MB kost het. Hoe minder MB opgehaald wordt, hoe sneller uw website.

U kunt het aantal MB verkleinen door de volgende punten aan te pakken:

  1. Afbeeldingen
  2. CSS & JavaScript
  3. De hoeveelheid bestanden

1 Afbeeldingen

Het gebruik van afbeeldingen op uw website raden we zeker aan. Het is wel belangrijk dat de bestandsgrootte van uw afbeeldingen laag in aantal MB is. Voor een webafbeelding mag de zogenoemde printkwaliteit lager.

Wanneer u een afbeelding voor het web gebruikt, heeft u niet meer dan 72 DPI (dots-per-inch) nodig. Een afbeelding met een lagere DPI is van slechtere kwaliteit voor printproducties, doordat de afbeelding pixelig kan zijn wanneer gedrukt, maar is van een prima kwaliteit voor een beeldscherm. In programma’s zoals Adobe Photoshop of Adobe Illustrator is het mogelijk om afbeeldingen voor het web op te slaan in deze 72 DPI.

In Adobe Photoshop kunt u zelfs nog iets verder gaan en de kwaliteit van de foto verlagen alvorens deze op te slaan voor gebruik op het web. Hierdoor kan het zijn dat er visueel nauwelijks iets veranderd aan de afbeelding, maar de bestandsgrootte wel afneemt van 3MB naar soms wel maar 200KB (0,2MB).

2 CSS & JavaScript

CSS is verantwoordelijk voor het design en de visuele lay-out van uw website. Het vertelt uw browser hoe de elementen op uw website eruit moeten komen te zien of waar deze moeten komen te staan.

Bij een responsive website bevat CSS ook de informatie wat te doen bij welk schermformaat.

JavaScript is verantwoordelijk voor functionaliteit, hoewel het ook voor het animeren van elementen gebruikt kan worden.

Beide codetalen kunnen in losse bestanden staan, welke vervolgens geminimaliseerd kunnen worden. Dit betekent dat commentaar van de schrijvers van de code eruit wordt gehaald en dat alles binnen het bestand op één regel staat. Hiermee is de grootte van het bestand gereduceerd. Uw websitebezoeker ziet deze code nooit, het wijzigt namelijk niets aan het uiterlijk van uw website.

U kunt voor het reduceren van uw codebestanden bijvoorbeeld https://csscompressor.com/ gebruiken voor CSS of https://jscompress.com/ voor JavaScript. Zorg hierbij altijd voor een back-up van uw bestanden.

3 De hoeveelheid bestanden

Onder bestanden verstaan wij afbeeldingen, CSS, JavaScript en nog veel meer. Soms worden er bestanden ingeladen die helemaal niet gebruikt worden op pagina’s of zelfs niet op de gehele website. Dit kan meerdere redenen hebben. Het kan oude code betreffen, waarvan de ontwikkelaar is vergeten het weg te halen. Probeer het aantal bestanden dat ingeladen moet worden laag te houden om de snelheid van uw website te verhogen.

Waarom een responsive website invloed heeft op de vindbaarheid van uw website

Hier spelen twee factoren een rol.

Allereerst, met welke apparaten wij tegenwoordig het internet op gaan.
Uit een onderzoek van het CBS in 2018 bleek dat 84% van het internetverkeer binnen Nederland via een mobiel verloopt. Binnen Europa is dat gemiddeld 69%. Wereldwijd was dit in het laatste kwartaal van 2019 52,6%.

De taak van een zoekmachine is om u de informatie te bieden waar u om vraagt. Als dit via mobiel verkeer verloopt is het wel zo handig dat u een resultaat krijgt die u ook zonder al te veel moeite (lees zonder inzoomen, lange wachttijden of onleesbare teksten) kunt vinden en lezen.

Dan factor nummer twee: de zoekmachine zelf.
Niet elke zoekmachine wordt evenveel gebruikt.Binnen Nederland had Google in januari 2020 98,3% van het marktaandeel in ‘mobiel internetverkeer via een zoekmachine’ in handen. Aanpassingen binnen het algoritme van deze zoekmachine heeft dus een enorme impact op de vindbaarheid van uw website. Hierna volgt DuckDuckGo, een zoekmachine waarbij uw privacy centraal staat met 0,62%. Op de derde plaats komt Yahoo! met 0,43% en op nummer vier staat Bing met 0,24%.

De invloed van Google op uw vindbaarheid

Op 1 juli 2019 is Google overgestapt naar mobile-first. Dit betekent dat uw score afhangt van hoe mobielvriendelijk uw website is. Hierbij geeft Google aan dat wanneer u minder inhoud op uw mobiele versie toont, Google deze informatie dus ook niet krijgt.
Wanneer u gebruik maakt van de Google Analytics, kunt u feedback van Google ontvangen indien er er iets mis mocht zijn met uw website in een mobiele weergave.

Omdat 98,3% van het zoekverkeer op een smartphone via Google verloopt, zal ook u te maken hebben met de mobile-first aanpassing. Een mobielvriendelijke website is belangrijk als u gevonden wilt worden op Google.

De invloed van het Bing algoritme op uw vindbaarheid

Bing, daarentegen, gaf in 2016 aan niet over te stappen naar een mobile-first methode. Het gebruikt een indexering dat voor zowel desktop als mobiel is geoptimaliseerd. Dat neemt niet weg dat Bing geen rekening houdt met het toenemende mobiele verkeer op het internet. Het kijkt echter in de eerste plaats naar de relevantie van de website en zal deze dan ook hoger plaatsen, ook wanneer deze niet mobielvriendelijk is. Bing zal wel in de zoekresultaten aangeven of de website mobielvriendelijk is. Het is in dit geval aan de gebruiker om uw website dan wel of niet te bezoeken wanneer deze niet mobielvriendelijk is.

Yahoo en mobielvriendelijkheid

Yahoo maakt voor een deel gebruik van Bing. Dit betekent dat de organische resultaten bij Yahoo! niet de focus zullen leggen op de mobielvriendelijkheid van uw website, maar juist kijken naar hoe relevant een pagina is voor de zoekactie die is uitgevoerd.

DuckDuckGo

In 2016 is DuckDuckGo een partnerschap aangegaan met Yahoo. Het is daarnaast ook een partner van Bing, Yandex en Wikipedia. Dus ook bij DuckDuckGo zal er geen sprake zijn van focus op een mobielvriendelijke website, maar wel op de relevantie van uw website.

Wat u kunt doen als uw website niet mobielvriendelijk is

Het is belangrijk dat u uw publiek kent. Vindt uw publiek u voornamelijk via een mobiele telefoon, of juist via een desktop? U kunt dit op meerdere manieren achterhalen. Bijvoorbeeld door het apparaat waarmee de gebruiker u bezoekt op te slaan in de database wanneer zij de website bezoeken.

Het is echter makkelijker om gebruik te maken van Google Analytics.

Welke zoekmachine gebruikt uw publiek? Dat 98,3% van het mobiele zoekverkeer in Nederland via Google verloopt, betekent niet dat uw publiek ook dat percentage heeft.

Hoeveel tijd spendeert men op uw website? Wanneer men de site bezoekt en de informatie leest, doet men daar langer over dan wanneer men op de site komt en meteen weggaat omdat de website niet mobielvriendelijk bleek. Houdt er hierbij wel rekening mee dat sommige bezoekers toch nog op uw website zullen blijven en bijvoorbeeld zullen inzoomen om op uw website de content te kunnen lezen. Dit verlengt ook de tijd die men op de site spendeert.

Met deze informatie kunt u dan vervolgens besluiten wat er precies gedaan dient te worden en hoe snel het uitgevoerd moet worden.

WordPress

Wanneer uw website gebruik maakt van WordPress is het belangrijk om te kijken welke versie van WordPress. Over het algemeen geldt dat een WordPress-template gebruik maakt van een responsive design en dus een mobielvriendelijke versie heeft van uw website.

Bij oudere versies van WordPress-templates is dit mogelijk niet het geval. Kijk dan of de template die u gebruikt een update heeft die compatibel is met de meest recente versie van WordPress, zodat met een simpele update uw website wellicht toch mobielvriendelijk wordt.

Hetzelfde geldt voor alle plug-ins die u gebruikt.

Het kan natuurlijk zo zijn dat er verschillende plug-ins en templates niet meer compatibel zijn. U heeft dan twee opties.
Optie één is iemand inhuren om de template aan te passen zodat het deze mobielvriendelijker wordt, indien de licentie dit toestaat.
Optie twee is een volledig nieuwe website laten maken.
Wij raden u optie twee aan in verband met de veiligheid van uw website en data.

Joomla!

Wanneer u Joomla! gebruikt is het bijna zeker dat de nieuwste versies van templates over het algemeen een responsive design gebruiken.

Controleer alvorens het installeren van de laatste versie van Joomla! of de updates voor uw extensies en template compatibel zijn met de laatste versie van Joomla!.

Wanneer er geen recente updates voor uw extensies en template zijn die compatibel zijn met de nieuwste versie van Joomla!, is het verstandiger een nieuwe website te laten bouwen, in plaats van enkel de template te laten aanpassen. Dit in verband met de veiligheid van uw website en data.

Maatwerk website

Bij een maatwerk website ligt het mobielvriendelijk maken van de website net iets anders dan updaten of een nieuw thema/template installeren.

Afhankelijk van wat er is gebruikt om de pagina op te bouwen, is het makkelijker om de pagina om te zetten naar een mobielvriendelijke website. Over het algemeen geldt dat uw pagina’s opgebouwd zullen zijn door middel van HTML, CSS en JavaScript. Maar er bestaan andere talen. Laat een expert er naar kijken en u adviseren over welke stappen u het beste kunt nemen.