In 11 stappen naar een mobielvriendelijke website

Wij schreven in 2015 al een blogpost over het toen al toenemende belang van mobiele websites. In 2016 werd er voor het eerst meer mobiel gesurft dan via desktop. Hierdoor nam het belang van een mobielvriendelijke website alleen maar verder toe. Heb je dat niet, dan dreig je niet alleen een groot deel van jouw bezoekers weg te jagen, maar ook nog eens slechter te scoren in de SERP. Dan kreeg je al tot vervelens toe vragen als indexeert Googles mobiele crawler jouw website? Is jouw website wel responsive? Allemaal goed bedoeld, maar wat doe je ermee? In deze blogpost helpen wij jou in 11 stappen op weg richting een meer mobielvriendelijke website.

Flash(back)

Wat je ook doet, gebruik geen Flash. Tenzij je liefde voor kermisattracties, de jaren ’90 en stroboscopische effecten het steevast haalt van de keuze voor een SEO-vriendelijke website.

Het zal niet alleen de laadtijd van jouw website verlengen, maar heel wat browsers en toestellen ondersteunen het eenvoudigweg niet langer.

Ban autocorrectie uit invulvelden

Niets zo irritant als wanneer je met je smartphone op een website jouw naam en adresgegevens invult en je steeds weer suggesties krijgt waar je niet om gevraagd hebt.

Zorg er daarom voor dat de autocorrectie voor invulvelden uitgeschakeld is.

Voeg daarom in de html-code voor elk invulveld, autocorrect=off,toe.

Plaats veelgezochte informatie op een duidelijk zichtbare plek

Ga eerst voor jezelf na welke informatie op jouw website het meest relevant kan zijn voor iemand die via mobiel op jouw website komt. Voorzie vervolgens hiervoor een logische en duidelijk zichtbare plaats op de homepage.

Maak de buttons groot genoeg

Zorg ervoor dat niet enkel kleuters en pianisten vlot op de buttons van jouw website kunnen klikken zonder enige vorm van frustratie. Gebruik knoppen die ook op een smartphone of tablet voldoende groot zijn. Schakel desnoods collega’s, vrienden en familie in met ieder zijn of haar fijngevoeligheid om jouw website mobiel te testen

Comprimeer te grote afbeeldingen

Sitesnelheid blijft één van de belangrijkste voorwaarden voor een mobielvriendelijke website. Ga daarom te grote afbeeldingen comprimeren tot een aanvaarbaardbare grootte.

Voor het resizen van de afbeeldingen op een WordPress website voor zowel verleden, heden als toekomst gebruiken wij veelal de plug-in Imsanity. Dankzij deze plug-in kan je een maximale hoogte en breedte instellen voor alle afbeeldingen die je via WordPress gaat uploaden en het zal automatisch de te grote afbeeldingen resizen. Met deze plug-in kan je ook meteen in bulk alle oudere uploads, gebaseerd op de door jou ingestelde hoogte en breedte, resizen

Gedaan dus met het afhalen, bewerken in Photoshop en terug opladen in WordPress. Een vaak tijdrovende bezigheid.

Ga voor een responsive website

Wanneer we het over een mobielvriendelijke website hebben valt de term vroeg of laat. Het betekent niets anders dan een website waarbij de manier waarop de content getoond wordt zich aanpast aan het toestel en de schermgrootte waarop het getoond wordt.

Responsive design is bovendien ook nog goed voor de SEO van jouw website. Zo hanteren de Google-bots tegenwoordig een zogenaamde Mobile-first index waarbij eerst de mobiele websites gecrawld worden en dan de desktop websites. Weet dat er dus ook zoiets bestaat als een mobiele crawler en een desktop crawler.

Indien je al met Google Search Console werkt, word je in principe verwittigd wanneer Google de mobile first-indexatie voor jouw website heeft ingeschakeld. Daarnaast zal je in de logfiles van de crawling die gebeurd is, een merkbare stijging kunnen zien van mobiele crawler van Google.

Bij het ontwikkelen van een nieuwe website moet je dus altijd in de eerste plaats vertrekken vanuit de ontwikkeling richting mobiel.

Voeg de Viewport Meta Tag toe

Met deze tag maak je aan de browsers duidelijk dat de paginabreedte van jouw website moet worden aangepast aan het toestel.

Op elke pagina voeg je de volgende html-code toe:

<meta name=”viewport” content=”width=device-width, initial-scale=1″>

Makkelijk switchen naar desktop

Sommige mobiele surfers zullen toch verkiezen om jouw website te zien alsof ze het op desktop zouden bekijken. Zorg er dus voor dat zij makkelijk kunnen overschakelen op de desktop-versie.

Voldoende grote lettergrootte

Op een klein schermpje, kleine letters moeten lezen is niet zo fijn. Kies daarom voor een lettergrootte van tenminste 14px. Opteer ook voor een standaard lettertype.

AMP-plugin

Dankzij deze plugin die je heel makkelijk kan toevoegen aan pakweg een WordPress-website, laden jouw webpagina’s veel sneller op een mobiel apparaat. Meer informatie over AMP lees je hier

Test jouw website regelmatig mobiel

Surf zelf heel regelmatig mobiel naar jouw website. Vraag ook collega’s, familie of zelfs een batterij onafhankelijke testers om met kritische blik na te gaan of je over een mobielvriendelijke website beschikt.

Hopelijk helpen deze tips jou al een eind vooruit. Een website is geen statisch gegeven, dus blijf constant jouw website mobiel testen en pas deze aan waar nodig. Veel succes.

Meer weetjes over SEO?