Meer informatie Ja, ik geef toestemming

Mobile first: van mobiel naar desktop

Mobile first

Mobile first is dé nieuwe trend in het ontwikkelen van websites. Deze manier van designen en programmeren kijkt eerst naar mobiel gebruik van de site en breidt het dan pas uit voor desktop. Mobile first krijgt steeds meer aandacht van experts en dat is ook niet zonder reden. Om de cijfers erbij te pakken: in 2013 was maar liefst 51% van de Nederlandse huishoudens in het bezit van een tablet, in 2011 was dat maar 32%. Daarnaast was eind 2013 zo’n 72% van alle Nederlanders in het bezit van een smartphone, terwijl dit in 2011 nog maar 42% was. Tot slot stijgt het datagebruik van mobiele devices de afgelopen jaren enorm en met de komst van 4G zal dat alleen maar toenemen. Het is dan ook niet vreemd dat we ons als internetbureau meer gaan focussen op mobile devices.

mobile_first

Mobile first is content first

Door aan het begin van de ontwikkelingsfase prioriteiten te leggen bij het mobiele gebruik van de website, wordt het plaatsen van content belangrijker. Het doel is om alleen de informatie te plaatsen die noodzakelijk is voor de bezoeker. Denk na waar de bezoeker zich op dat moment bevindt en waar hij of zij op naar zoek is. Zo wil bijvoorbeeld een sitebezoeker van een restaurant de daghap zien, direct gevolgd door een reserveringsbutton.

 

Breakpoints

Alle primaire content moet boven de vouw komen te staan. Ook is het goed om rekening te houden met breakpoints. Dit is de minimale of maximale resolutie waarop content getoond wordt. Door op de breakpoints te letten, kap je geen content af. Hieronder hebben wij de breakpoints alvast opgesomd voor verschillende devices:

  • Smartphone (<768 px)
  • Tablet (>768 px)
  • Desktop (>992 px)
  • Desktop (>1200px)

goed_fout

Pagespeed is key

Probeer het zichtbare gedeelte van de website zo snel mogelijk te laden op een smartphone. Dat betekent dat je boven de vouw zo min mogelijk gebruik moet maken van afbeeldingen, animaties of sliders. Door in het begin zo klein mogelijke bestanden in te laden, wordt het zichtbare gedeelte zo snel mogelijk getoond aan de gebruiker. In de tijd dat hij of zij deze informatie heeft gelezen, kan de rest van de site worden geladen. Benieuwd wat de huidige pagespeed is van je website (op mobiel)? Gebruik dan de Google PageSpeed tool.

Heb je zelf ook behoefte aan een site die compleet gericht is op de content, mobile first is en daarmee klaar is voor de toekomst? Neem dan contact op met ons internetbureau in Utrecht. Wij helpen u graag!