7 redenen om een responsive website mobile-first te maken

De Internet-revolutie heeft de wereld razendsnel veroverd en heeft zowat elk aspect van ons leven beïnvloed. In het begin gebruikten we het internet enkel om statische informatie te verwerken. Dan kwam Web 2.0, het interactieve web, dat exponentieel groeide doordat internetgebruikers ook zelf informatie en content konden genereren. Nu staan we aan de rand van Web 3.0, het semantische internet.

Naast de internet-revolutie heeft er zich recent nog een technologische revolutie plaatsgevonden: die van de apparaten waarmee we verbinding maken met het internet.Die evolueerden van mainframes over desktopcomputers tot het uitgebreide aanbod aan mobiele toestellen vandaag.De opkomst van sociale netwerken veroorzaakte een globalisering, die in combinatie met die mobiele toestellen ervoor zorgde dat meer mensen dan ooit toegang hadden tot het internet. In de loop van 2014 bereikten we een kantelpunt waarbij meer personen mobiele toestellen gebruikten om online te gaan dan traditionele computers.

Een gevolg hiervan was dat de manier waarop websites werden ontworpen drastisch veranderde. Initeel waren sites ontworpen om enkel op computerschermen te bekijken. Nu was het van essentieel belang dat ze ook op de kleinere schermen van smartphones en tablets vlot te navigeren waren.
 

Responsive websites


Responsive Web Design

Om tegemoet te komen aan het groeiende aantal mobiele surfers begonnen webdesigners met het ontwikkelen van dubbele websites: één voor toestellen met een groot scherm en een aparte, mobiele website voor toestellen met kleine schermen. Die mobiele sites werden specifiek ontworpen en geprogrammeerd om optimaal gebruik te maken van de kleinere schermen en de mindere nauwkeurigheid van touchscreens.

Maar het ontwikkelen en onderhouden van twee aparte websites was, en is nog altijd, een tijdsrovende bezigheid. Geleidelijk kwamen webdesigners op de proppen met een oplossing waarbij er slechts 1 website gecodeerd moet worden, maar waarbij de lay-out zich automatisch aanpaste aan verschillende schermgroottes. Dit wil zeggen dat de look van de website volledig afhangt van het type apparaat waarop hij wordt bekeken. Bezoek je de pagina’s op een groot computerscherm dan krijg je de volledige site te zien met alle elementen, afbeeldingen en een naviatie die volledig zichtbaar is. Als je dezelfde site vanop een smartphone bezoekt worden er niet-essentiële elementen verborgen of verkleind waardoor hij eenvoudiger te navigeren is. Deze manier van ontwerpen noemt men Responsive Web Design. Men gebruikt met andere woorden dynamische layouts die zich vloeiend aanpassen aan schermgroottes.
 

Responsive webdesign
 

Oorspronkelijk werkte Responsive Web Design volgens een top-down filosofie, waarbij men de volwaardige desktopsites ging ‘uitkleden’ tot ze geschikt werden voor mobiele toestellen. Maar men stootte af en toe op praktische problemen met de inhoud van de sites te vereenvoudigen. Bovendien werden op mobiele toestellen veel zware bestanden, zoals grote afbeeldingen, nog steeds gedownload ook al werden ze misschien zelfs niet getoond. Gezien de evolutie naar meer mobiele toestellen was het dus verstandiger om uiteindelijk te werken met een bottom-top aanpak. Deze werkwijze is men Mobile First gaan noemen. Hieronder vindt u de voordelen van het ontwikkelen van je website volgens de Mobile First methode.

  1. Hou de content intact:

    Een website bestaat voor 90% uit content, ongeacht of het nu over afbeeldingen, video, teksten, graphics of dynamische GIF’s gaat. Op een desktop- of laptopscher heb je veel ruimte om deze content een plaats te geven, maar dezelfde lay-out is meestal niet ideaal op mobiele schermen. Een mobile-first aanpak zorgt ervoor dat je bedachtzamer omgaat met het plannen van je content zodat de belangrijke boodschappen ook eerst zichtbaar zijn. Bij het opschalen naar grotere schermen is het dan heel eenvoudig om die content ook daar goed te positioneren.

  2. Een betere navigatie:

    Wanneer elementen van een desktopsite in een mobiel scherm gepropt worden kunnen er veel aspecten voorkomen die nefast zijn voor het ontwerp. Denk bijvoorbeeld aan teksten die niet meer op het scherm passen of afbeeldingen die plots het volledige scherm innnemen. Omdat de uitdaging ligt in zoveel mogelijk te laten passen op een klein scherm is het beter om vanuit die beperking te beginnen denken. Het is immers gemakkelijker om een compacte, eenvoudige opbouw uit te breiden naar boven dan het is om een complexe structuur te vereenvoudigen.

  3. Klantentevredenheid:

    Het ultieme doel van elke website is het aantal paginabezoeken te verhogen, of het nu kliks zijn van een laptop-browser of een browser op een smartphone. Maar een zware, gecomprimeerde pagina laden op een mobiel zorgt voor frictie bij bezoekers, terwijl een geoptimaliseerde en mobielvriendelijke website zorgt voor een zorgeloze ervaring en je pageviews kan helpen verhogen.

  4. Klaar zijn voor de toekomst:

    De wereld is al volop geëvolueerd naar smartphones en er liggen zelfs al andere schermen en platform in het verschiet, zoals smartwatches en VR. Volgens analysten liggen de hoogdagen van de tradiotionele PC achter ons en behoort de wereld nu toe aan mobiele toestellen. Met een mobile-first strategie ben je alvast voorbereid op alle schermen die nog komen.

  5. Follow the money:

    Facebook lichtte toe dat in 2015 maar liefst 80% van hun advertentie-inkomsten afkomstig waren van mobile. Door het toenemende mobiele gebruik zijn ook adverteerders in grote getalen overgestapt naar mobiele platformen. Het zal niet lang meer duren vooraleer de advertentiebudgetten voor mobiel die van de desktop-/laptopmarkt hebben overtroffen.

  6. Beheerbaar houden:

    Vroeger bouwden webdesigners volledig, uitgewerkte website voor de dekstopgebruikers om daarna een gestripte versie te maken voor mobiele gebruikers. Nu kan je als designer al van start gaan met een mobiele versie van de website waarop alle belangrijke informatie al aanwezig is. Deze site kan je dan stelselmatig geavanceerder maken voor gebruikers op de traditionele computerschermen. Aangezien de meerderheid van bezoekers via mobiel komen kan je alvast deze doelgroep snel opvangen.

  7. Probeer op te vallen:

    In 2015 kondigde Google ook aan dat ze meer zoekopdrachten ontvingen via mobiele apparaten dan via de traditionele computers. Het introduceerde daarom ook een nieuw systeem genaamdAccelerated Mobile Pages (AMP),  dat ervoor zorgt dat pagina’s sneller geladen worden op mobiele netwerken en minder bandbreedte verbruiken. Een andere inovatie kwam er met Mobilegeddon, een algoritme dat mobiel-vriendelijke website hoger rangschikt dan sites die niet mobiel geoptimaliseerd zijn. Met een mobile-first strategie zorg je er dus ook voor dat je zoekresultaten bij Google erop vooruitgaan.

Gebruikers zijn ongeduldig en hebben vaak een aandachtsboog van enkele seconden. Ze willen snel resultaat en mede dankzij sites als Google is er de verwachting gecreëerd dat alles supersonisch moet gaan, in die mate dat men op de duur moet beginnen denken in termen zoals miliseconden. Een website die zijn bezoekers niet snel genoeg kan geven wat ze zoeken zal klanten verliezen. En welke zaak wil dit nu riskeren?

Ontvang meer nieuws in je inbox

Bedankt voor uw inschrijving


Terug naar overzicht

Gratis adviesgesprek

Waar sta je nu en waar wil je naar toe?

Een adviesgesprek houdt in:

1
Een inleidend gesprek
2
Een inleidend gesprek
3
Gratis advies
4
Een inleidend gesprek

Gratis adviesgesprek

Waar sta je nu en waar wil je naar toe?

Gratis adviesgesprek

Waar sta je nu en waar wil je naar toe?

We bellen je zo snel mogelijk op om deze afspraak in te plannen.

Met jaren ervaring in het bereiken van resulaten zijn we een solide partner in het online succes van vele bedrijven.

Onze missie

Digitaal Bureau Way2Web streeft ernaar de perfecte balans te vinden tussen stijlvol design en slimme custom ontwikkeling. Het resultaat? Een creatieve website, applicatie of marketingcampagne die buzz genereert. Eén die uw bedrijf meer naamsbekendheid en loyale klanten oplevert en inkomsten genereert.

Contacteer ons

Stokerijstraat 72
2110 Wijnegem, Antwerpen
Belgium

T: 03 808 25 92