Wat is responsive webdesign? En welke functies heeft het?
Een responsive webdesign. Je hebt er misschien al wel van gehoord, maar wat is het precies? Eigenlijk zegt het woord het al: een responsive webdesign reageert op het scherm van het apparaat waarop het wordt geopend. Zo zal het design zich automatisch aanpassen naar de grootte van het scherm. Bijvoorbeeld de grootte van een tabblad scherm of een smartphone. Erg handig dus wanneer je wil dat jouw website op elk apparaat goed bruikbaar is! En dat niet alleen, want een responsive webdesign zal een positieve werking hebben op de conversie optimalisatie, maar daarover later meer.
Webdesigner Nick legt het uit:
Hoe deden we dat dan zonder responsive design?
Nick: “We hebben niet altijd van die mooie opties gehad als het gaat om webdesign. Misschien kan je het nog herinneren. Het bezoeken van een website op de mobiele telefoon ging vroeger veel minder gebruiksvriendelijk. Afbeeldingen verschoven vaak of tekst was niet goed leesbaar. Als oplossing werd de ‘mobiele website’ bedacht. Dit is een opzichzelfstaande website, die naast de originele desktop website wordt gemaakt. De mobiele website heeft een eigen URL en is apart ontworpen voor een kleiner scherm.”
Nick: “De komst van een mobiele website maakt het bezoekers een stuk makkelijker om op een smartphone websites te bezoeken. Desondanks is de mobiele website minder goed tegen de toekomst opgewassen als de nieuwere nakomer: het responsive webdesign.”
Waarom is een responsive webdesign zo belangrijk?
Nick: “Een responsive webdesign is in deze moderne tijd een must. Mensen pakken tegenwoordig veel sneller hun smartphone als ze iets willen opzoeken of kopen. Deze heb je immers altijd bij de hand. Daarnaast worden er tegenwoordig ook veel tablets gebruikt. Je kan je dus voorstellen dat de stijging in smartphone en tablet gebruik ook effect heeft op de conversie ratio. Des te belangrijker om een responsive webdesign te hebben.
Al deze moderne apparaten komen tegenwoordig in verschillende vormen en maten. Daarom is het nodig dat een website goed en fijn werkt wanneer je het op één van deze apparaten wil openen. Met de komst van alle verschillende apparaten en resoluties bleek dat de mobiele website niet optimaal zijn functie vervulde. Eén mobiele website was namelijk niet meer voldoende om aan al die nieuwe schermen en resoluties te voldoen. Bovendien vraagt het veel tijd om voor alle verschillende apparaten een aparte mobiele website te maken. Een responsive webdesign biedt de oplossing. Zie bijvoorbeeld onderstaand voorbeeld van onze klant Brugman Advocaten.”
Voordelen responsive webdesign
Nick: “In vergelijking met de mobiele website heeft het responsive webdesign dus heel wat voordelen. Deze voordelen zijn;
- Aanpassingen aan jouw website worden automatisch doorgevoerd op desktop en mobiele apparaten. Je hoeft dus maar één website te onderhouden met een responsive design;
- Het heeft een positieve invloed op de SEO omdat alle links naar één domein verwijzen;
- Je bereikt een groter publiek als jouw website zich goed aanpast aan verschillende schermen;
- Je hebt een consistente vormgeving op alle apparaten zodat bezoekers jouw website altijd herkennen;
- Een responsive design is toekomstbestendig doordat het zich kan aanpassen aan alle verschillende schermgroottes en resoluties;
- Het heeft een positieve werking op de conversie ratio.”
Hoe passen wij bij Sturdy Digital een responsive webdesign toe?
Nick: “Wij ontwerpen meestal in de meest populaire mobiele resolutie van het moment. In onderstaande schermafbeelding zie je bijvoorbeeld iPhone 11 formaat. Hiervoor hebben wij voor een klant de volledige mobiele versie ontworpen. Dit resulteerde in een projectomvang van ongeveer 100 schermen. Mede door deze investering hebben wij tot in de puntjes alles perfect weten te ontwikkelen en bestaan er geen vraagtekens omtrent het mobiele ontwerp.”
Hoe ziet een responsive website eruit?
Nick: “Een responsive webdesign is gemakkelijk te herkennen. Dit kun je het beste controleren door op je mobiel naar een desktop versie van een website te gaan, gewoon via je internetbrowser. Als je deze zelfde website er op een computerscherm naast houdt en de twee schermen met elkaar vergelijkt, kun je zien dat het scherm op je mobiel zich heeft aanpast. Hierdoor hoef je niet met geknepen ogen te kijken of in te zoomen; nee, alles staat op de juiste plek en is de juiste grootte.
Pas het design aan de schermgrootte aan en niet andersom. Zo kun je – ongeacht met welk type device je een website bezoekt – altijd op een fijne manier door de website heen navigeren. Of het nou een tablet of een smartphone betreft. Hieronder een goed voorbeeld van onze klant The Good Guyz”
Waar moet je op letten bij het maken van een responsive webdesign?
Nick: “Er zijn een aantal punten belangrijk bij het maken van een responsive design. Deze punten zijn:
