Responsive design: wat, hoe en waarom?

De hoogste tijd voor extra creativiteit

Datum
13 juni 2017
Responsive design: wat, hoe en waarom?

Zegt de datum 21 april 2015 je iets? Mobilegeddon. De dag dat Google besloot smartphonevriendelijke sites voorrang te geven in de zoekresultaten. Responsive websites. Als je je website niet aan mobiel gebruik hebt aangepast, verdwijn je vanaf die dag langzaam uit het zicht. Heb je zelf een site voor je bedrijf, maar heb je nooit over een mobiele versie nagedacht en zie je de bezoekersaantallen teruglopen? In dit kennisartikel vertellen we je de ins en outs van responsive design. Lees even mee waarom Google deze keus heeft gemaakt, en hoe jij meegaat in deze ontwikkeling.

Waarom het besluit van Google?
Google en andere zoekmachines doen hun best om de gebruiker precies te geven wat hij zoekt. Met de opkomst van de smartphone ontstond een frustratie. Halve pagina’s. Niet werkende afbeeldingen. Eindeloos scrollen. Op mobiel niet te besurfen websites, omdat ze zijn ontworpen voor een desktopscherm. In Europa gebruikt 65% van de mensen regelmatig een smartphone voor internetverkeer. Dit stijgt in de komende 2 jaar tot 100%. Google wil zo veel mogelijk frustratie besparen door je de beste internetbeleving te bieden. Daarom krijgen sites die zich aanpassen aan mobiele apparaten voorrang. De responsive site viert hoogtij.

Wat is een responsive website?
Een responsive website is een site die zich automatisch aanpast aan het formaat van het scherm waarop deze geopend wordt. Met slim programmeren zorg je dat elementen van een website een flexibele breedte krijgen. De website 'beweegt mee'. Is er geen ruimte voor 2 kolommen? Dan verschuift 1 van de kolommen naar beneden. Geen horizontale scrollbalk, dus. Ook de lettergrootte past zich aan. Deze is nooit te klein om te lezen op een smartphone. En de afbeeldingen veranderen van formaat. Geen gezoom, dus, of gekantel met het scherm.
Zien hoe het werkt? Ga achter een desktopcomputer zitten en open een website. Houd CTRL ingedrukt en scrol een stukje. Naarmate je scherm groeit zie je hoe het design zich aanpast. Kijk zelf even rond op het internet of test je eigen site. Kom je veel responsive websites tegen, of niet?

Het maakt met responsive design niet uit op welk apparaat bezoekers kijken. Of hoe hun scherm is ingesteld. De site is altijd logisch ingedeeld.

Waarom wil ik een responsive website?
Stel, een bezoeker zoekt jouw product of dienst vanaf zijn telefoon. Het duurt lang, bijna 15 seconden om je homepage te laden. Als dat eenmaal is gelukt, ziet je potentiële klant kleine, onleesbaar kleine lettertjes. Als hij inzoomt, leest hij een paar woorden die net niet overeenkomen met wat hij zoekt. Hij klikt door, maar moet opnieuw lang laden. Nu klikt hij weg. Op naar de site van je concurrent. Gebruiksvriendelijkheid houdt bezoekers vast. Het maakt met responsive design niet uit op welk apparaat bezoekers kijken. Of hoe hun scherm is ingesteld. De site is altijd logisch ingedeeld. Geen afhakers vanwege te kleine buttons of onleesbare pagina’s. Ze blijven tevreden.

 

Aangepaste snelheid
Mobiele bezoekers hebben meestal een tragere verbinding. Daar biedt een responsive ontwerp uitkomst voor. Je stelt de site zo in dat hij bij een bepaald schermformaat automatisch overschakelt op kleinere afbeeldingen. Of je zorgt dat grote afbeeldingen niet geladen worden. Op zo’n klein scherm overstemmen beelden anders de inhoud. Maar op desktopschermen zijn grotere aantallen plaatjes in een hoge resolutie juist een toevoeging. 

Bewust ontwerpen
Een responsive ontwerp heeft een onverwacht voordeel. Je wordt gedwongen om een goede website-strategie te kiezen. Als het scherm kleiner wordt, welk onderdeel van je site moet dan bovenaan komen? Wat zou een bezoeker met een smartphone als eerste willen zien? Dat is keuzes maken. Prioriteiten stellen. Niet alleen voor je site, maar voor je hele bedrijf.
Verplaats je in de bezoeker met een smartphone. Wat verwacht hij of zij van je site? Een belbutton voor mobiele telefoons geeft de gelegenheid je bedrijf met 1 druk op de knop aan de telefoon te krijgen. Met een Google Mapsplaatje met de locatie van je vestiging weet hij direct waar hij moet zijn. Voor een desktopcomputer, zonder GPS-positie is dat minder belangrijk. Een responsive ontwerper stelt het zo in dat deze tools niet verschijnen op een groter scherm.

Wat brengt de toekomst?
Mobilegeddon pakte voor niet-responsive websites minder dramatisch uit dan verwacht. Sommige van deze websites behielden hun positie omdat ze veel bezocht bleven worden. Maar experts zien de druk toenemen, en verwachten dat het positieve effect van responsive ontwerp steeds groter wordt. Het overgrote deel van smartphone-onvriendelijke sites zal het onderspit delven. De inhoud van je site blijft doorslaggevend, maar een flexibele vorm wordt steeds belangrijker.

Ook DTG ontwerpt responsive
Je hebt nu gelezen waarom Google mobiel aangepaste sites voorrang geeft, en hoe jij jouw bedrijfswebsite hierop aanpast. Het wordt voor nieuwkomers steeds moeilijker om met een niet-responsive site te scoren op Google. Omdat responsive veel voordelen heeft, ontwerpt DTG alle websites voor klanten responsive. Je website is gebruiksvriendelijk, en wordt beter gevonden. Het maakt niet uit welk type scherm er in de toekomst op de markt komt, je site is altijd voorbereid. Dus wil je met jouw bedrijf gevonden blijven worden? Go responsive. 

Geplaats in:
  • Website en Webshops