0623692501 jeroen@jvegter.nl

Mobile first website ontwikkeling.

Als het goed is klinkt de term mobile first bij de meesten niet meer als nieuw maar er is op dit vlak ontzetten veel te doen. Maar wat houdt het nu eigenlijk in? Bij mobile frist website ontwikkeling staat het mobiele apparaat voorop. Dit betekent dat we met het ontwikkelen van een website of het aanpassen van een bestaande uitgaan van mobile devices. Denk hierbij aan smartphones en tablets omdat een laptop onder computers valt. Eerst maar even een uitleg over resoluties.

Wat zijn resoluties en pixels?

Met de term resolutie beschrijven we het aantal gebruikte pixels op een beeldscherm. Voordat we over de resolutie verder gaan eerst maar even de pixels, want wat is nu een pixel? “Een pixel is een enkele gekleurde punt (Eng.: dot) op het beeldscherm van de computer of in een digitaal beeld. Veel pixels bij elkaar vormen samen een beeld. Alles wat op het scherm te zien is, is opgebouwd uit pixels.” Dit is de definitie volgens wikipedia. Dus de resolutie is dus optelsom van het aantal pixels. Als voorbeeld neem ik een full HD resolutie. Full HD heeft een resolutie van 1920 x 1080 pixels. Dit betekent dat er horizontaal 1920 pixels zijn en verticaal 1080, totaal maar liefst 2.o73.600 pixels, dat zijn er ruim 2 miljoen. Dit zijn aardig wat pixels die we vullen met beeld.

U raadt het al, hoe kleiner deze resolutie wordt, hoe minder pixels we beschikbaar hebben en hoe minder beeld we dus kunnen vullen. Op het moment van schrijven is 1 van de meest gebruikte resoluties nog steeds 1366 x 768 omdat dit al een hele tijd de maximale resolutie van laptops is, nog steeds de meest verkochte mobiele apparaten.

Mobile first tegenover desktop first.

Bij de ontwikkeling van een website is het dus belangrijk om na te gaan hoe de bezoekers straks de website gaat benaderen. Op dit moment richten de meeste bedrijven zich met de hun website op de mobiele gebruiker. Niet zo een rare gedachte omdat we onze smartphone het meeste gebruiken van alle apparaten in huis. Dit betekent dus dat de website er op een smartphone net zo goed uit moet zien als op een groter, desktop, scherm.

We gaan dan bij de ontwikkeling van de smartphone uit en dat is nogal wat. Kijk maar om u heen als u dit artikel leest. Er is geen groter verschil in formaten dan bij smartphones. Om enkele voorbeelden te noemen.

  • Samsung Galaxy S9 – 2960 x 1440
  • Iphone X – 2436 x 1125
  • Iphone 5s – 1136 x 640

Het verschil is erg groot. Ik kan een hele lijst opnoemen met alles smartphones die er zijn maar ter illustratie een greep uit de meest gebruikte toestellen.

Om dit goed te doen moeten de tekst, afbeeldingen en navigatie van een website afgestemd worden op al deze verschillende resoluties. Dit betekent dat we keuzes moeten maken:

  • Wat willen we op een welk scherm weergeven en hoe moet dit eruit zien?
  • Laten we bepaalde afbeeldingen misschien niet zien op een kleiner scherm?
  • Gaan we afbeeldingen dynamisch verkleinen?
  • Laten we onderdelen uit het menu van de website weg?
  • En ga zo maar door.

Waarom vertel ik u dit?

De grootste internet zoekmachine van onze planeet, Google, heeft besloten om webpagina’s zonder een mobiele variant niet meer te gaan indexeren. Dat is nogal wat want dit betekent dat een website die niet mobiel-vriendelijk is dus niet meer geïndexeerd wordt door Google. Dit kan een hele grote impact hebben op de zoek resultaten en uw ranking in Google. Iets om ven goed op te letten. De ranking in Google, is het daar dan waar het om gaat? Ik hoor het u denken? Nee, niet alleen, het allerbelangrijkste bij een website is de gebruikerservaring. Hoe blij is een gebruiker met uw website. Ik kan u vertellen dat een gebruiker niet blij is als uw website niet mobiel-vriendelijk is en hij zal dan verder zoeken naar: uw concurrent.

Wees dus de concurrentie voor er zorg ervoor dat uw website mobiel-vriendelijk(er) wordt.

Vragen over dit artikel over over website ontwikkeling? Neem dan gerust contact met mij op!