C’est quoi un site en responsive design ?

Dans
Digital
Device responsive design

Le responsive design, ou design adaptatif, va permettre à un site d'ajuster sa mise en page au périphérique sur lequel il est consulté : ordinateur de bureau, tablette ou téléphone.

Pourquoi ?

Aux débuts du web, les sites étaient conçus pour des écrans au format 4/3 paysage. Puis les écrans plus larges (16/9 et 16/10) sont devenus la norme offrant une surface supérieure pour les sites.

En maintenant, les téléphones surfent sans complexe avec des écrans au format paysage ou portrait, dans des résolutions qui diffèrent pour chaque modèle, et imposent une nouvelle manière d’utiliser l’internet, notamment avec l’utilisation du tactile qui transforme certains sites en une épreuve quasi insurmontable pour cliquer avec précision sur les tous petits liens d'une page.

Toutes ces différentes surfaces d’affichage imposent de nouvelles contraintes de conception des sites et il est impensable de faire autant de versions d’un même site qu’il y a de format d’écran. Et pour le référencement, toutes ces pages dupliquées avec un même contenu risquent de pénaliser le classement du site.

Le responsive design vient alors à point nommé en permettant la conception d’un seul site dont la disposition des différents constituants va s’adapter à l’écran de l’internaute.

Comme nous passons de plus en plus de temps à naviguer depuis nos mobiles ou nos tablettes, ces supports ne peuvent plus être négligés.

Comment ?

C’est tout l’art du métier de web designer qui va permettre de concevoir le site à l’aide de feuilles de styles CSS, certes plus complexes car ce sont elles qui vont gérer la redisposition des contenus, mais plus présentables en termes d’ergonomie et d’habillage graphique.

Les éléments ne sont alors plus définis en unités fixes, le pixel, mais en unités relatives, le pourcentage, plus flexibles.

Les avantages

Il n’y a plus de contenus dupliqués, plus d’oubli de mise-à-jour entre les différentes versions… une seule adresse web pour le site, une gestion centralisée des contenus et une meilleure expérience utilisateur, tant en lecture qu'en navigation.

De plus, les moteurs de recherche prennent désormais en compte le type de périphérique utilisé lors de la recherche et les résultats seront différents sur un ordinateur de bureau de ceux sur un mobile. Ainsi, lors d'une recherche depuis un téléphone, le même site sera mieux classé s’il est responsive que s’il ne l’est pas.

Les inconvénients

Vous allez passer encore plus de temps sur votre téléphone grâce au confort du responsive design

Le responsive design chez Metropolitan Influence

Tous nos projets de site web incluent un poste de mise en responsive : cette technologie nous paraît désormais indispensable. Et nous n’avons aucun problème à mixer un site conçu à l’aide du CMS Drupal avec un affichage en responsive.

Nous concevons également des campagnes d’emailings en responsive afin d’améliorer la lecture des emails sur téléphones : plus besoin de zoomer pour profiter de votre meilleure offre!

Faire du responsive prendra toujours plus de temps que de ne rien faire. Il est donc parfaitement envisageable de ne pas souhaiter cette fonctionnalité lors de la conception initiale du site et de la prévoir lors une évolution ultérieure du projet.

Source : 
Philippe Ythier - Metropolitan Influence

Mots-clefs : 

Facebook icon