Responsive Design

Websites worden steeds vaker bekeken met een mobiel of tablet. Sinds de intrede van mobiel internet en het gebruik van mobieltjes en tablets sterk toegenomen is, is binnen een aantal jaar het aan aantal desktop gebruikers overtroffen door het aantal mobiele internet gebruikers. De hoogste tijd om bij het ontwerpen en ontwikkelen van een Website hiermee rekening te houden. Waar voorheen nog een aparte mobiele site ontwikkeld moest worden kan nu Responsive webdesign toegepast worden.

“Responsive webdesign: het creëren van websites die zich naadloos aanpassen aan de omgeving van de gebruiker, gebaseerd op apparaat, afmeting, resolutie, technische mogelijkheden beperkingen etc.”

Als je bijvoorbeeld een Website zou maken met WordPress worden veel van deze Responsive elementen al automatisch meegenomen, zoniet dan is dat meestal in een paar klikken te veranderen.
Bij puur HTML en CSS schrijven moet er per HTML en CSS element opgelet worden of dit past bij alle beeldformaten.

Het belang van Responsive Webdesign

Tot voor kort was het gebruikelijk om websites te bouwen waarbij de content een vaste breedte had. Deze breedte lag rond de 980 pixels, ongeveer de breedte van het kleinste beeldscherm van een desktop pc. Als de website op een groter scherm werd bekeken bleef de breedte van de content gelijk maar was er meer van de achtergrond te zien. Op die manier zag de website er op verschillende monitoren ongeveer hetzelfde en toch aantrekkelijk uit. Toen de smartphones hun intrede deden werd er als alternatief op de standaard website een mobiele website ontwikkeld. Twee versies van één website dus.

Responsive webdesign maakt het mogelijk om een website in één enkele versie te optimaliseren voor verschillende schermresoluties. Een website kan zich aanpassen aan elke schermresolutie zonder te korten op functionaliteit en content.

De content van de site bestaat uit losse elementen. Door deze niet op een vaste plek te zetten en schaalbaar te maken kan de website zich aan elk formaat aanpassen. Het is ook mogelijk om bepaalde elementen helemaal niet te tonen bij een bepaalde schermresolutie. Door media query’s uit te voeren kan het apparaat waarmee de website word bezocht geïdentificeerd worden. Op basis hiervan wordt de juiste content en vormgeving getoond.

Wat er er wel en niet wordt getoond wordt en in welke volgorde, wordt gebaseerd op basis van de behoeften van de gebruiker. De content op je website is er immers voor de bezoeker en deze moet op elk apparaat snel en gemakkelijk de gezochte informatie kunnen vinden. 

Responsive Design “De nieuwe standaard?”

Door de toename van apparaten om online informatie te bekijken wordt het steeds belangrijker om deze informatie op de juiste manier aan te bieden. Responsive design is zeker een oplossing maar of het de nieuwe standaard wordt zal in de toekomst blijken.

Zelf merk ik dat ik het prima vind om de normale site op mijn smartphone te bekijken. Deze verschaalt immers automatisch naar en kleiner formaat. Op het moment dat ik een aangepaste versie van een website te zien krijg heb ik het idee dat ik informatie mis. Maar misschien ben ik nog niet responsive en moet ik mij nog aanpassen aan de nieuwe steeds sneller gaande ontwikkeling.

Responsive en vindbaarheid?

Nu weet je wat Responsive Webdesign is maar wat nog belangrijker is dat tegenwoordig de zoekmachines je Website controleren op goede werking op mobieltjes en tablets.
Dat noemt Google “Gebruiksgemak op mobiele apparaten” zoals te zien is in de screenshot hieronder van Google Search Console.

Als je Website niet goed wordt weergegeven op mobieltjes of tablets, dan zou het negatief kunnen werken op de vindbaarheid van je Website in de zoekmachines Google en Bing.
Dus daarom is het belangrijk dat je als je een Website laat maken, deze ook meteen Responsive laat maken en goed controleert op de werking op alle beeldformaten.

Je kan altijd bellen, mailen of appen met welke vraag dan ook. Of kijk even rond op mijn Website, waar je ook mijn portfolio en tarieven kan vinden.

Marcel
Mbits-web-content