Depuis 2013, la multiplication des offres de tablettes et l’adoption massive des smartphones pour consulter internet modifient la vision que l’on peut avoir de la création d’un site web.
Pour le client, désirant faire concevoir son site par une agence web, de nouvelles questions se posent.
Jusqu’à présent, le périphérique de lecture utilisé par les visiteurs n’était pas vraiment pris en compte. On pensait d’abord à obtenir un design agréable à regarder sur un écran d’ordinateur et qui donne envie à l’internaute de naviguer sur ses pages et de passer des commandes en ligne dans le cas d’un site marchand.
Aujourd’hui, le nombre de visiteurs ou le taux de transformation clic/vente pour les sites de vente en ligne reste toujours le principal sujet. Sachant que celui-ci dépend directement du nombre de visiteurs, il est donc crucial de rendre son site accessible au plus grand nombre d’internautes possible.
Lorsqu’un internaute souhaite visiter, depuis sa tablette ou son mobile, un site dont l’affichage n’a été prévu que pour un grand écran, l’affichage est tronqué horizontalement, obligeant à scroller de gauche à droite pour voir la largeur complète de la page.
Cette manipulation décourage de nombreux utilisateurs qui quittent alors le site. Résultat : un visiteur de perdu, et qui ne reviendra plus car l’expérience utilisateur est mauvaise. Ce qui s’est produit pour cet utilisateur se produira pour des milliers d’autres, privant ainsi le site de milliers de visites et de ventes potentielles.
La solution ? Le Responsive Web Design.
Cette méthode consiste à adapter en temps réel l’affichage du site en fonction du matériel utilisé par l’internaute afin de créer la meilleure expérience utilisateur possible, sans être forcé de scroller sa page horizontalement pour en voir tout son contenu. Le développeur définit des points de rupture, correspondant à des limites d’affichage, qui indiquent l’emplacement et les dimensions des éléments à afficher.
Par exemple, si la page est composée de 4 cadres, ceux-ci pourront être automatiquement affichés de la manière suivante :
-
4 cadres côte à côte sur un grand écran
-
2 lignes de 2 cadres sur un écran de tablette
-
4 cadres les uns au-dessus des autres sur un écran de smartphone
Ainsi, le contenu reste le même et la navigation devient souple, naturelle et agréable quel que soit le matériel de l’internaute. Le visiteur appréciera de pouvoir naviguer sur ce site depuis son bureau sur son ordinateur, depuis son salon sur sa tablette ou depuis le métro sur son smartphone. Si l’information proposée est pertinente, ce visiteur reviendra sur votre site et en fera peut-être même la promotion par rapport à son confort d’utilisation.
La contrepartie de cette souplesse d’utilisation a toutefois un prix.
En effet, cette technique implique un surcroit de travail en amont, au niveau de la maquette du site à préparer dans les 2 ou 3 déclinaisons possibles, et pendant le développement, au niveau des feuilles de styles supplémentaires à intégrer et à tester.
C’est au propriétaire du site internet de juger de la pertinence de cet investissement supplémentaire en fonction des retombées quantitatives et qualitatives qu’il souhaite obtenir.
Mais gardons à l’esprit que la tendance actuelle s'oriente vers un web de plus en plus mobile…
Auteur: Christian ALLEMAND