Is jouw website responsive?

Waarom mobiel? Mensen surfen steeds vaker op mobiele apparaten. Zorg ervoor dat je website hier aan voldoet.
Gepubliceerd op:
17/7/2021
Responsive
Auteur:
Norbert Vercauteren
Auteur:
Norbert Vercauteren
Volgende blog
Arrow

Perfect voor alle schermen

Je wil een website die mooi oogt en een uitstekend gebruiksgemak heeft op alle schermen, van desktop tot smartphone. Dit is niet vanzelfsprekend. Beide apparaten hebben hun specifieke kenmerken waarmee rekening moet worden gehouden.

Er zijn verschillende werkwijzen en technieken om dit doel te bereiken.

Desktop First

Er wordt ontworpen in desktop modus en met toepassing van de 'responsive design' techniek gezorgd voor esthetiek en comfortabel gebruik op mobiele apparaten.

'Desktop First' is geen resultaat maar een werkwijze.

Het is een werkwijze die nog altijd het meest wordt gebruikt. Een gewoonte die stamt uit de tijd dat de smartphones de wereld nog niet hadden veroverd.

Mobile Friendly

De 'Mobile Friendly' website Is een 'Desktop First' website die met de 'responsive' design' techniek is aangepast om ook op mobieltjes met voldoende gebruiksgemak te kunnen bekijken.

De 'Mobile Friendly' website is een resultaat.

Gezien zijn oorsprong (desktop) zal de layout en ook het gebruiksgemak niet zomaar perfect geoptimaliseerd zijn voor de mobiele apparaten.

Zo blijven bijvoorbeeld 'knoppen' op desktop ook knoppen op de smartphone. Het toepassen van de 'responsive design' techniek verandert daar niets aan. Dit is niet perfect omdat 'smartphoners' vooral scrollers zijn.

Om een 'Optimized website' (zie verder) te bekomen is er extra tussenkomst nodig van de designer.

Nog dit, laat je mobile website geen afgeslankte versie zijn van je desktop website. Google vindt dit niet zo goed. Een verschillende inhoud en/of structuur voor desktop en mobiel geeft een slechtere ranking in de Google zoekresultaten. Voor het bepalen van die ranking baseert Google zich meer op de mobiele versie van de website dan op de desktop versie.

Mobile First

Er wordt ontworpen in smartphone modus en door toepassing van 'de responsive design' techniek gezorgd voor comfortabel gebruik en een esthetisch uitzicht op desktopscherm.

'Mobile First' is geen resultaat maar een werkwijze.

Hier geldt dezelfde bemerking als bij 'Desktop First'. Op een desktop is bijvoorbeeld het gebruik van knoppen handig. Ontwerp je 'Mobile First' zonder knoppen dan kan dat het gebruiksgemak op desktop schaden. Met 'responsive design' maak je geen knoppen bij. Op desktop zijn interne links in de vorm van knoppen meestal heel handig.

Om een 'Optimized website' (zie verder) te bekomen is er extra tussenkomst nodig van de designer.

Bij een goede designer zullen zowel de mobiele als de desktop-versie gebruiksvriendelijk zijn. Toch zal de structuur, de looks, het gebruik en de algemene ervaring, afhankelijk van de insteek, anders zijn.

Responsive design

Met toepassing van 'responsive design' creëer je websites die zich vloeiend aanpassen aan het gebruikte beeldscherm, van desktop tot smartphone

Responsive design is een handige techniek een resultaat en geen werkwijze.

Je kan responsive design toepassen met de Desktop First strategie, maar het kan evengoed met de Mobile First aanpak.

Zoals hoger aangegeven is 'responsive design' een handige techniek die, naargelang de meegegeven instellingen, adaptaties bewerkstelligd volgens schermgrootte. Website elementen worden 'ge-herdimensioneerd' en geschikt, zodat de website op elk scherm met een zeker gemak kan worden bezocht.

Louter toepassen van de 'response design' techniek geeft standaard een goed maar geen optimaal resultaat.

Optimized website

Een 'Optimized Website' is in deze context een resultaat. Het gaat over het optimaliseren van layout, esthetiek, structuur, gebruiksgemak, laadsnelheid...  op de mobieltjes èn op de desktop.

De werkwijze die je neemt als insteek, 'Desktop First' of 'Mobile First' is zonder twijfel mee bepalend voor het eindresultaat.

De impact is zeer uitgesproken wanneer je enkel de 'responsive design' techniek zijn werk laat doen.

Tussenkomst en vakbekwaamheid van de designer kunnen er voor zorgen dat door optimalisatie de impact van de gekozen insteek meer of minder is. Hij kan er à la limite voor zorgen dat de verschillende versies (desktop/laptop, tablet en smartphone) zijn alsof ze voor elk scherm 'dedicated' zijn gemaakt. Afhankelijk hoever je in deze wil gaan zal ook het kostenplaatje (werktijd) variëren.