Responsive design in het smartphone tijdperk3 min. leestijd

In het tijdperk waarin de smartphone en tablet de hoogtij vieren is responsive design ontzettend belangrijk. Als webdesigner wil je sites produceren die overal en door iedereen bekeken kunnen worden. Van de thuiscomputer tot de telefoon in de broekzak van je gebruikers. Om ervoor te zorgen dat iedere soort gebruiker je pagina’s goed kan bekijken zal je ervoor moeten zorgen dat de site zich aanpast aan elk soort en formaat beeldscherm. Dit noemt men responsive design. De benaming verwijst daarbij naar het reageren (en aanpassen) van de pagina op het gebruikte apparaat om deze te bezoeken. Maar hoe werkt het en wat zijn de voordelen van een geoptimaliseerde site?

De basisprincipes

In de basis is het vrij eenvoudig, een responsive website past zich aan aan het apparaat waarmee de pagina bezocht wordt. Bekijk je de site op de computer, dan wordt de pagina in zijn volledige formaat gepresenteerd. Open dezelfde pagina op een smartphone en je ziet hoe de website bijgeschaald wordt naar een praktischere afmeting voor mobiele webnavigatie. Belangrijke onderdelen als het menu, het bedrijfslogo en afbeeldingen worden hierbij mogelijk op andere, praktische posities geplaatst. Deze herpositionering van onderdelen zorgt ervoor dat de gebruiker makkelijker de informatie en content kan bereiken die hij/zij zoekt.

Dat bijschalen van de site verloopt meestal aan de hand van breekpunten. De ontwerper van een site geeft punten aan in de afmetingen waarop een pagina zijn schaal en layout moet aanpassen. Komt de pagina onder of boven een bepaalde afmeting, dan wordt deze bijgesteld. De webbrowser op smartphones, tablets en computers detecteert de schermafmetingen van het gebruikte apparaat. Als de website schaalbaar is gebruikt het die informatie om de pagina optimaal te tonen voor die afmetingen.

responsive-blog

De voordelen

Aanvankelijk lijkt het een flinke klus om ervoor te zorgen dat je website responsive is. Maar op de lange termijn levert het duidelijk gemak op, zowel voor jou als de gebruikers. Tijdens de opkomst van mobiel internetgebruik begon men met het ontwerpen van losstaande mobiele webpagina’s. Deze moeten los van de hoofdsite bijgehouden worden, waarbij je met responsive design maar één website bij hoeft te werken. Zodra het bijschalen goed ingebouwd is, is het up-to-date houden van de pagina en content kinderspel.

Bijkomend voordeel? Google geeft een duidelijke voorkeur aan responsive design. Het zorgt ervoor dat de zoekmachine maar één website hoeft te indexeren in plaats van twee. Daarnaast streeft Google in de hoofdzaak naar het tonen van kwalitatieve resultaten wanneer men de zoekmachine gebruikt. Een website die technisch sterk in elkaar steekt en gebruikers snel leidt naar de informatie die ze nodig hebben verdient de voorkeur. Met een strak responsive design kan je er dus voor zorgen dat je beter gevonden wordt. Ten laatste is ook de omvang van mobiele zoekopdrachten noemenswaardig: Het afgelopen jaar bestond 55-60% van alle zoekopdrachten uit mobiel verkeer. Dat geeft des te meer aan hoe enorm belangrijk het is om rekening te houden met de compactere schermformaten.

Naast dat het gunstig is voor zoekmachine optimalisatie (SEO), is het grootste belang natuurlijk je gebruikers. Optimalisatie voor alle apparaten zorgt voor een sterke en prettige algemene gebruikservaring. Op een niet-aangepaste website kan het voor mobiele gebruikers erg lastig zijn om bepaalde informatie te vinden of zelfs aan te klikken. Gebruikers haken snel af als ze niet snel genoeg kunnen vinden waar ze naar op zoek zijn. Een bijgeschaalde pagina zorgt ervoor dat men eenvoudig de belangrijke zaken kan bereiken. Hierdoor blijven ze vaker op jouw website, klikken ze vlotter door en is de kans groter dat ze vinden wat ze nodig hebben. Wat op zijn beurt weer kan leiden tot iets waar elke zakelijke ontwerper van droomt: extra conversie!

Laat een reactie achter