Posted on Juin 27, 2014 in Actualités | One Comment

responsive_web

Ce n’est pas la première fois que nous abordons le sujet, mais l’importance du message est telle que nous devions encore vous rabattre les oreilles avec le design adaptatif (Responsive Web Design).

 

Petit rappel

Pas besoin de tourner autour du pot ; les tablettes et les téléphones intelligents sont en train de rattraper les ordinateurs et les portables pour accéder à Internet. Il est clair qu’un site à largeur fixe ne suffit plus. Avec la multiplication des plateformes et des tailles d’écran, la majorité des sites Web s’affichent un peu de façon aléatoire selon la plateforme utilisée par l’internaute. Pour remédier à ce problème, le Web adaptatif s’est avéré être, pour le moment, la meilleure solution.

Pour être le plus clair possible, tentons d’abord de définir le design adaptatif, en quelques mots. Un site Web «responsive» peut s’adapter aux spécificités de tous les appareils. Avec des images et une mise en page flexibles, le contenu et le design du site s’ajustent automatiquement pour maximiser la taille de l’écran. Les images grandissent ou rapetissent selon les besoins, les textes se remplacent, les menus changent de comportement pour laisser au visiteur une expérience de navigation constante, autant sur une tablette, que sur un téléphone intelligent ou un ordinateur.

 

Pourquoi est-il temps de passer au Web adaptatif?

Pour vous épargner de la lecture (et m’épargner de l’écriture) Voici quelques chiffres et graphiques :

Nombre de pages visitées par outil : 

pages_visites

 

Temps passé sur le Web par outil : 

temps_passe

 

Comparatif (approximatif) de résolution (nombre de tailles d’écran)

tailles

 

Les plus et les moins du «responsive»: 

plusToucher un maximum d’utilisateurs : s’il est utilisable depuis n’importe quel terminal, cela représente, en théorie plus d’audience pour le produit développé. Ce point, déjà primordial aujourd’hui, sera indispensable à prendre en compte dans les années à venir.

plusUn seul produit web à concevoir, à réaliser et à entretenir : pour le prestataire, c’est donc synonyme de facilité de mise en place et de mise à jour; pour le client, des coûts de production et surtout de maintenance moins élevés.

plusUne plus-value au niveau de l’image de marque : ce type de site étant encore assez marginal, un projet en RWD donne une image de marque jeune et innovante pour le client et le professionnel à l’origine du projet.

plusUn meilleur référencement : moins de plateformes différentes revient à plus d’utilisateurs pour le même contenu. Un seul site avec un fort taux d’achalandage vaut mieux que plusieurs avec un faible taux.

plusUne expérience utilisateur homogène : que l’on utilise le produit sur un terminal fixe, une tablette ou un mobile, les processus d’utilisation sont uniformes et ne perdent pas l’utilisateur. Exemple : en passant de mon poste fixe à ma tablette, le produit reste le même, bien qu’il soit adapté, et il ne me déstabilise pas lors de la prise en main.

 

moinsUn coût de production plus élevé qu’un site classique : effectivement, par rapport à un site à grille fixe, un projet RWD présente un surcoût évident, dû essentiellement au temps de conception, de développement et de test plus important.

moinsLa négociation du contenu : dans la mesure où un projet RWD est un projet qui englobe tous les types de supports, la quantité de contenu doit convenir aux appareils aussi bien à petit qu’à grand écran. On le voit, le RWD n’est pas simple à mettre en oeuvre.

moinsLe temps de chargement : en effet, sur un support 3G la puissance étant beaucoup plus faible qu’en haute vitesse et fibre optique, il est difficile de charger plusieurs images à la fois et de les redimensionner sans altérer le temps de chargement. Il est évident qu’un site qui met trop de temps à charger fait fuir les internautes ce qui risque d’augmenter le taux de rebond, soit le nombre de visiteurs quittant le site dès la première page vue. Cependant le réseau 3G tend à la performance, c’est un problème qui finira par ne plus en être un.

 

Si Google vous le dit !

Google encourage fortement les développeurs à s’orienter vers le design adaptatif, plutôt que de multiplier les plateformes (et donc les redirections). L’omniprésente firme internet nous a habitués aux recommandations concernant les bonnes pratiques sur le Web. Mais cette fois-ci, le géant est allé encore plus loin en mettant en ligne son Web Starter Kit, une boîte à outils à l’intention des développeurs pour créer des sites web responsive. Google promet également des optimisations, au niveau des performances (cf. les plus et les moins du «responsive»).

Il est important de savoir aussi que, côté SEO (Search Engin Optimization), les résultats de recherche Google ne sont pas toujours les mêmes sur mobile et sur un ordinateur. Selon BRIGHTEDGE, 62 % des résultats Google sont différents sur mobile. Il semblerait que Google tient par exemple compte de l’expérience utilisateur sur les sites mobiles, afin de les classer dans les résultats. Ce paramètre n’est donc pas à négliger. Actuellement, 27 % des sites seraient mal configurés pour les recherches sur mobile, ce qui conduit à une perte de trafic de 68 %, en moyenne.

En clair, Google priorise les liens adaptés à la plateforme de l’utilisateur. Quoi de plus normal alors que les sites «adaptatifs» obtiennent de bons résultats quelle que soit la provenance de l’utilisateur.

 

Cet article n’est qu’un bref survol d’un sujet trop vaste à parcourir en une seule fois. Alors, si vous voulez plus de renseignements, n’hésitez pas à communiquer avec nous ou suivre notre blogue qui ne manquera certainement pas d’un retour à ce sujet.

PS : un site Web en responsive est moins cher que vous ne le croyez, demandez-nous une soumission 🙂

Jonathan Loquet – Concepteur-graphique – Tactic design

1 Commentaire

  1. Consultant e-marketing à Paris
    18 juillet 2014

    Excellent article…bonne continuation dans ton travail de rédaction

Laisser un commentaire