Wanneer is het zinvol om een aparte website voor mobiele apparaten te ontwikkelen? En hoe kun je dat het beste doen? Maak je een volledig nieuwe website of zorg je ervoor dat je normale website zich automatisch ‘schikt’ naar het apparaat waarop de website wordt getoond? In deze post een eenvoudige uitleg over de mogelijke technieken en achterliggende redenen om de juiste keuze te maken.

Op dit moment (juli 2012) wordt gemiddeld 6% van alle websites in Nederland bezocht middels een mobiel apparaat (zie grafiek via StatCounter). Steeds meer bedrijven overwegen de ontwikkeling van een mobiele website of een app. Bij de ontwikkeling van een mobiele website spelen een aantal zaken een grote rol:

• Snelheid: houd rekening met de locatie van gebruikers, vermijd grote afbeeldingen of foto’s voor een snelle laadtijd.
• Overzicht: eenvoud in navigatie. Mobiele gebruikers zijn vaak op zoek naar concrete informatie en antwoord op eenvoudige vragen als wie, wat en waar?
• Schermresolutie: houd rekening met diverse schermgroottes van mobiele apparaten
• Gebruiksvriendelijkheid: zorg ervoor dat men bijv. kan scrollen door te ‘swipen’ en dat men eenvoudig kan ‘zoomen’
• Focus op smartphones: nog te vaak zien we dat mobiele websites ook op tablets als iPad worden weergegeven terwijl de ‘desktop’ versie een betere gebruikersbeleving biedt vanwege de schermgrootte.
• GPS locatie: maak gebruik van de mogelijkheid om de GPS locatie te koppelen om zodoende relevante informatie weer te geven.

Wat is responsive webdesign?

Responsive design is een nieuwe trend in de wereld van webdesign. Concreet betekent dit dat een schaalbaar template/ontwerp wordt ontwikkeld waarin vorm, functionaliteit en content op elkaar worden afgestemd. Bij het openen op een desktop wordt de normale website weergegeven, op een tablet krijg je een aangepast formaat en bekijk je de website via een smartphone wordt automatisch ‘teruggeschaald’ naar de mobiele variant. In dit formaat worden bijvoorbeeld minder pagina’s en/of teksten weergegeven. Als je met je muis de venstergrootte van je browser verandert zie je goed hoe dit in zijn werk gaat.

Wat is dan het verschil tussen een mobiele website en responsive design?
Google heeft dit op haar GoMo campagne website mooi weergegeven, daarvan tref je onderstaand een visualisatie aan:

Wanneer wel of geen responsive design?

Responsive design is een mooie techniek. Het kost echter in vrijwel alle gevallen ook meer tijd om te ontwikkelen (en dus budget).  Qua beheer kun je echter wel alles vanuit één systeem managen wat de gebruiksvriendelijkheid, actualiteit en beheersbaarheid van de aanwezige content ten goede komt. Het maken van een juiste keuze is niet eenvoudig, onderstaand tref je enkele richtlijnen aan welke je op weg kunnen helpen bij het maken van een keuze tussen een mobiele website of responsive design voor één website voor alle apparaten:

Praktijkvoorbeeld 1: mobiele website naast normale website

Onderstaand vind je ter verduidelijking twee screenshots van de website en mobiele website welke we ontwikkelden voor een sportwinkel:

Desktop (www.brejaartsport.nl)

Mobiele website (m.brejaartsport.nl)

Praktijkvoorbeeld 2: responsive design

Onderstaand 3 screenshots van het responsive design voor frans restaurant Porte de Provence:

Desktop (www.portedeprovence.nl)

Tablet

En smartphone:

Meer voorbeelden

Enkele andere mooie voorbeelden van responsive websites zijn:
www.sony.com
www.foodsense.is
www.jaofnee.nl
of kijk ook eens op www.mediaqueri.es.

Ook een mobiele website?

Naast het geven van gericht advies ondersteunen we met Artform graag bij de ontwikkeling van websites die geschikt zijn voor de mobiele- en tabletgebruiker. Neem voor een vrijblijvend advies gerust contact met ons op.