18
Déc
12

Qu’est-ce que le « Responsive web design » ou « site web adaptatif »


Avec la multiplication des terminaux utilisés pour naviguer sur internet, les entreprises sont confrontées à mettre en ligne différentes versions de leur site web pour adapter leur contenu sur les différents terminaux.

Une nouvelle technologie s’imposait pour la conception des sites web : Le « responsive web design » ou « site web adaptatif ».

Les sites web adaptatifs reposent sur trois éléments de bases :

  1. CSS3 media queries permet à la page d’utiliser des règles CSS différentes en fonction des caractéristiques du terminal de consultation. Il s’agit des règles appliquées en fonction de la largeur du terminal. Ces différentes largeurs sont appelées « points de rupture » et correspondent à un besoin de modifier la mise en page à partir d’un certain seuil critique pour faciliter la navigation et la lecture du contenu.
  2. Le concept de grille fluide consiste en un dimensionnement relatif des différents blocs de la page. Les unités relatives comme les pourcentages sont assez adaptées pour cela, beaucoup plus que les unités absolues comme les pixels ou les points.
  3. Les images ayant un besoin de flexibilité sont également redimensionnées en une unité relative, afin de prévenir un éventuel débordement du contenu en dehors de son élément conteneur.

De cette façon, l’utilisateur peut ainsi consulter le même site web à travers une multitude d’appareils (moniteurs d’ordinateur, smartphones, tablettes, TV, etc.). Tout ceci facilite la gestion du contenu et la mise à jour du site internet de l’entreprise.

Le site internet du Boston Globe intègre parfaitement les trois éléments clefs du site web adaptatif. Voici un exemple en image du résultat multi terminaux.

Évidemment, pour ceux qui ont un site internet récent, un investissement de plusieurs milliers de dollars pour refaire un site web adaptatif n’est pas souhaité par le département de communication / marketing. La solution en attendant est la mise en place d’un site internet mobile parallèle au site web principal. Par contre, il est possible d’utiliser le même gestionnaire de contenu pour l’ajout de contenu et la mise à jour du site. Il faudra quand même faire l’opération deux fois, c’est-à-dire sur le site principal et le site web mobile.

Cette façon de faire n’est pas une tendance, mais bien une adaptation aux nouvelles façons de naviguer sur internet. N’oubliez pas, nous sommes maintenant passés au web 3.0.

Contactez-nous dès maintenant pour votre nouveau site internet ou pour une version mobile de votre site actuel.

Cordalement,
Michel Dufresne
Ass. Didjet « L’expert stratège mobile / social / web »
Référence : Wikipédia

Share Via : AddThis

Publicités

0 Responses to “Qu’est-ce que le « Responsive web design » ou « site web adaptatif »”



  1. Laisser un commentaire

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s


Enter your email address to follow this blog and receive notifications of new posts by email.

Rejoignez 724 autres abonnés

Follow Us

                   

Didjet : Calendar

décembre 2012
L M M J V S D
« Nov   Jan »
 12
3456789
10111213141516
17181920212223
24252627282930
31  

Didjet : Tweets

Erreur : Twitter ne répond pas. Veuillez patienter quelques minutes avant d'actualiser cette page.


%d blogueurs aiment cette page :