Online vous offre une suite complète et sécurisée pour votre activité
24 February 2015
Bien choisir son nom de domaine en 2015
10 April 2015

Faut-il passer au responsive design en 2015 ?

Tablette, smartphone, notebook, ordinateur ultraportable… loin d’être sédentaire, l’internaute 2015 se veut nomade.
D’après la société Statcounter, cette navigation représenterait plus de trente-deux pourcents (32%) des visites en Belgique sur le second semestre 2014.

Autant dire que la compatibilité mobile est devenue une problématique incontournable dans toute stratégie digitale !

Face à cette problématique d’affichage multi support, le responsive design apporte une flexibilité mais engendre également des questionnements d’ordre technique.

 

La navigation mobile en 2014 : quelques chiffres

Une étude menée par Sanoma indique que l’utilisation des smartphones et tablettes en Belgique a augmentée considérablement depuis l’année 2013.
En Wallonie comme en Flandre, 40 % de la population des 15 ans et plus dispose d’un smartphone en 2014.

 

http://advertising.sanoma.be/fr/insights/le-mobile-en-belgique-anno-2014

Appliqué à la navigation sur internet et la consultation de sites, l’usage des équipements mobiles (smartphones et tablettes) représente plus de 32% d’après la société Statcounter.

 

Les types de supports mobiles sont devenus de plus en plus nombreux et leur navigation plus courante.

http://howwebrowse.be/fr

 

Qu’est-ce que le RWD ?

Le responsive web design (RWD) regroupe des techniques visant la production d’un graphisme (têtière, blocs graphiques, colonnes, menu, pied de page, etc.) de site internet adaptable dynamiquement en fonction du medium.

En pratique, il va permettre l’adaptation du contenu d’une page web en fonction des différents types d’appareils utilisés et du format de leur écran.

Le design responsive constitue une alternative à la création d’un site mobile.
Cette dernière technique repose sur la création d’une seconde version de votre domaine spécifiquement conçu pour les smartphones.

Le même contenu est alors généralement disponible sur deux domaines différents ou deux URLs différentes.
En fonction de l’équipement utilisé par l’internaute ou de la taille de l’écran votre serveur web choisira d’afficher la version « standard » ou le site mobile.

 

Comment est-ce que cela fonctionne ?

Le principe du responsive design est simple : vos colonnes, images, textes, vidéos et autres visuels s’ajustent automatiquement en fonction de la taille de l’écran de votre mobinaute.

Ceci est rendu possible par de nombreuses techniques, notamment l’utilisation de fichiers CSS et Javascript spécifiques. Certaines fonctionnalités désormais offertes par le langage HTML5 et CSS3 permettent notamment de contourner certaines problématiques d’affichage.

En pratique :

  • Lorsque l’écran est moins large (par exemple sur un smartphone/ Iphone), les blocs seront souvent agencés de haut en bas
  • Certains blocs jugés moins importants pour la navigation pourront être supprimés pour la version mobile
  • A l’inverse d’autres blocs non présents sur la version classique peuvent être affichés
  • Certains éléments peuvent être modifiés : le nombre de colonnes à afficher, le contenu mis en avant, le changement d’orientation, etc
  • Tout est une question de choix, donc n’hésitez pas à en discuter longuement avec votre développeur, intégrateur et webdesigner

D’un point de vue technique, chaque réorganisation des blocs du design de votre site sont appelés des points de rupture.
Ils doivent être convenus par l’entreprise et implémentés par le webdesigner.

 

Avantages de cette méthode

L’aspect pratique est la raison principale pour laquelle il vous est conseillé d’utiliser cette technologie.
Cette technique réduit la quantité de travail car il devient, dès lors, inutile de développer plusieurs sites web.

L’existence d’une multitude d’appareils est directement envisagée lors de l’élaboration de ce système.

Une fois la mise en place exécutée, celui-ci demande peu de maintenance et un coût de développement moindre que pour la création d’un site mobile personnalisé.

Un autre avantage du responsive web design est qu’il évite la duplication de contenu.
Ceci est un facteur pris en compte par les moteurs de recherche lors de l’indexation du contenu de votre domaine.

Les différentes pages seront donc référencées sous le même URL, ce qui facilitera la stratégie de référencement (SEO).
Grâce à cette pratique, vous concentrerez alors tous vos efforts sur une version unique.

Au niveau de l’utilisateur final/ l’internaute, cette technique peut lui permettre de conserver une expérience proche de la navigation traditionnelle (ordinateur de bureau ou portable).
Ceci explique le succès de cette technique pour les boutiques e-commerce.

 

Inconvénients : temps de chargement, délais de création, coûts

Le passage au responsive design génère de nombreuses problématiques organisationnelles et financières.
Ceci s’applique indistinctement dans le cas d’un lancement d’un nouveau site internet ou d’une refonte d’une plateforme existante.

Il peut par exemple être plus simple et moins couteux de créer un site mobile à la place.

 

Temps de téléchargement des images

Parmi les défauts du responsive design, figure toujours le téléchargement d’images et contenus volumineux.
En effet, il est pour le moment, très difficile de proposer une même image sous plusieurs versions pour l’adapter aux différents types d’appareils.

En conséquent, les images sont souvent modifiées de façon non optimale, ce qui peut impacter négativement sur la qualité des visuels et leur temps de chargement de la page.

Conseil :

Veillez à contrôler le temps de chargement et le bon affichage de votre site responsive sur différents équipements, soit manuellement ou par le biais d’outils en ligne.
Ces deux aspects impacteront sur les performances de votre site, ainsi que son référencement sur Google (pris en compte dans son algorithme).

 

Délai de développement

Plus complexe qu’un projet traditionnel, le développement d’un site responsive allonge considérablement les délais de livraison.
Qui plus est ce type de création suppose de nombreux tests, notamment afin d’éviter un affichage « éclaté » sur certains supports.

 

Des coûts de production plus élevés

Conséquence de l’allongement de la phase de développement, les coûts liés à la création d’un site responsive sont généralement plus élevés que pour un projet traditionnel.

Qui plus est le design responsive constitue une spécialité à part entière, et suppose une équipe expérimentée.

Conseil :

Si vous souhaitez optimiser la vitesse de chargement de vos pages et le référencement de votre domaine, pensez à le mentionner à votre agence web en début de projet.

 

Pour aller plus loin

 

 

Cet article répond à vos attentes ?

N’hésitez pas à le partager sur tous vos réseaux !

02 349 23 23