Gebruikt u al responsive web design?
Wie websites ontwerpt kan er moeilijk omheen: websites worden vandaag niet alleen bezocht via een pc of laptop, maar ook via smartphones, tablets, smart TV’s en game consoles. Gebruikers verwachten bovendien dat hun bezoek aan een website altijd een aangename en uniforme ervaring biedt, ongeacht het toestel dat ze gebruiken.
Het aanpassen van een website om aan deze verwachtingen tegemoet te komen, is vaak echter geen eenvoudige opdracht. Je wordt geconfronteerd met verschillende platformen, schermgroottes, gebruikscontexten, …
Eén oplossing zou zijn om voor ieder type toestel een aparte website te maken. Een haast onmogelijke opdracht, als je rekening houdt met de verscheidenheid aan toestellen op de markt en de snelheid van de technologische vooruitgang.
Een andere, populairdere oplossing wordt responsive design genoemd. Responsive design gaat uit van de idee dat uw website zich automatisch moet aanpassen aan het platform, de schermgrootte en de oriëntatie van het toestel waarop een website wordt bekeken.
Om dat te bereiken, wordt onder meer gebruik gemaakt van de volgende technieken:
- 1. Je zet een fluid grid layout op, waarin de breedte van de kolommen wordt aangepast aan de beschikbare schermruimte. In deze grid worden de user interface-elementen geplaatst.
- 2. Video’s en afbeeldingen maak je flexibel: al naargelang de schermgrootte worden ze groter of kleiner weergegeven. Het spreekt voor zich dat er daarbij steeds op moet worden gelet dat de kwaliteit van het beeld niet vermindert.
- 3. Met behulp van media queries, creëer je een systeem dat bepaalt op welke manier een pagina moet worden weergegeven al naargelang de grootte van de viewport van het gebruikte toestel. Op die manier kun je ervoor kiezen bepaalde elementen niet te tonen, te vergroten/verkleinen, te verplaatsen…
Zo hoef je dus geen 20 verschillende websites te bouwen. Je maakt er eentje die zich dankzij een reeks vooraf bepaalde voorwaarden aanpast aan de verschillende contexten waarin hij kan worden gebruikt.
Dat brengt trouwens nog een voordeel met zich mee: doordat er slechts één unieke URL wordt gebruikt, wordt je website beter vindbaar. Mobiele websites bevatten gewoonlijk minder informatie dan traditionele websites. Daardoor krijgen ze zelden een hoge positie toegewezen in de resultaten van zoekmachines. Door de responsive design technieken te gebruiken, omzeil je dit probleem.
Responsive design lost natuurlijk niet alle problemen op: bij het ontwerpen voor meerdere toestellen komt meer kijken dan enkel het omgaan met verschillende schermgroottes. Je website moet in al zijn vormen nog steeds worden afgestemd op de gebruiker en op diens behoeften en verwachtingen.
Waarschijnlijk is iemand die je website bezoekt vanachter zijn bureau op het werk op zoek naar een andere ervaring dan een gebruiker die vanop zijn smartphone naar je pagina navigeert. Die verschillen in context bepalen welke elementen je wilt benadrukken en welke niet.
Het is dus nog steeds even belangrijk om te onderzoeken wie je gebruikers zijn, in welke context ze je website bezoeken en waarom… en dan vervolgens je ontwerpen grondig te testen. Want als de inhoud of de navigatiemechanismen van je website niet goed zitten, zullen gebruikers nog altijd gefrustreerd je website de rug toekeren, hoe mooi hij ook op hun scherm past.
