Tegenwoordig zoeken we steeds meer op via onze mobiele telefoon, maar nog lang niet iedere website is mobielvriendelijk. Zonde! Mijn hart doet altijd een beetje pijn als ik op mijn telefoon een website bezoek die eigenlijk een minuscule versie is van de desktopvariant, waar je eindeloos moet inzoomen en de pagina moet verschuiven om dingen te kunnen lezen of aan te klikken. Of nog erger: Wanneer de website compleet onhandelbaar is. Gelukkig is het heel makkelijk om over te schakelen op een mobielvriendelijke website.

1 – Mobile responsive WordPress theme

Kies een WordPress theme dat al jouw pagina’s automatisch geschikt maakt voor mobiel en tablet. Nou – dat zijn ze tegenwoordig allemaal wel, maar bij de een heb je meer controle over hoe dat allemaal in elkaar schuift en opstapelt en transformeert dan bij de ander.

Zo gebruik ik graag Astra: hier kun je per apparaat ook bepaalde instellingen zelf invullen. Bijvoorbeeld hoe groot je teksten en koppen moeten zijn, of in welke volgorde bepaalde blokken op je pagina moeten opstapelen bij de mobiele versie.

2 – Zorg voor een korte laadtijd

Ontwerp je website zo, dat hij een zo kort mogelijke laadtijd heeft. Onze aandachtsspanne wordt steeds korter (tsk tsk tsk), dus het is belangrijk dat je website geladen is voordat je bezoeker zijn aandacht alweer ergens anders op gericht heeft.

3 – Zichtbaarheid en bruikbaarheid van het menu

Schenk even wat extra aandacht aan het menu, en controleer dat ook echt op je eigen telefoon! Soms moet je de goede tekst- en achtergrondkleuren voor het mobiele menu apart instellen. Wit op wit leest zo moeilijk 😉

4 – Kies een passende lettergrootte

Dat een bepaalde lettergrootte het heel goed doet op de desktopversie, betekent niet dat dat voor de tablet en telefoon ook geldt. Nou gaat het bij je bodytekst meestal wel goed (snel afkloppen) maar bij grote koppen kan het soms heel raar uitpakken. Soms is het nodig om verschillende lettergroottes in te stellen voor desktop, tablet en mobiel.

5 – Overlappende elementen

Controleer je pagina’s altijd goed op verschillende apparaten. Niks is zo vervelend als een element wat voor iets anders in de weg zit, en niet weg te klikken is. Vooral bij zwevende elementen of popups is dit heel belangrijk.

Dit probleem heb ik een tijdje gehad op mijn blog CherryCharlie.nl, totdat mijn vader (trouwe lezer!) me erop wees: de zwevende deelknoppen vielen over het onderste stukje van de pagina. Niet zo mobielvriendelijk dus! Dit heb ik toen aangepast door ze te laten verdwijnen wanneer je bijna tot het eind van de pagina hebt gescrold.

6 – Marges

Let er ook op dat je tekstblokken op alle verschillende apparaten mooi uitgelijnd zijn. Soms komt het voor dat de tekst helemaal tegen de linker- en rechterrand geplakt zit. In die gevallen is het nodig om de padding of marges van je blok aan te passen.

In het kort:

  • For starters heb je een mobile responsive thema nodig.
  • Hoe korter je laadtijd, hoe beter!
  • Schenk extra aandacht aan de gebruikersvriendelijkheid van je mobiele menu.
  • Let op de grootte van de letters: de bodytekst niet te klein, de koppen niet te groot.
  • Zorg dat alles goed uitgelijnd staat.
  • Let erop dat je wat marge houdt tot de randen van het scherm.

Wil jij het bouwen van je website graag uitbesteden, zodat het in één keer goed gaat? Boek dan nu vrijblijvend een kennismakingsgesprek!


Vind je dit een interessant artikel? Sharing is caring! 👇🏻

Winkelwagen
Scroll naar top