Sites web au design adaptatif (réactif)

Les sites web adaptatifs (ou réactifs) ont la propriété de s’adapter à divers supports tels que les ordinateurs, les iPad, les tablettes, les  iPhone, téléphones mobiles, etc. Le design du site devient alors flexible et fluide pour répondre au besoin d’affichage de ces différents appareils de communication. En anglais, on désigne cette caractéristique par ” responsive web design ” ou ” RWD “. C’est une technique en pleine évolution qui est de plus en plus en demande.

 

 

 

Sites statiques

Traditionnellement les sites étaient conçus de façon à être statiques, si vous prenez par exemple un site à 3 colonnes vues sur un écran d’ordinateur, on voit la  pleine page. Sur des appareils mobiles, il n’est pas possible de voir l’ensemble de la page. Il faut utiliser les barres de défilement et les utilisateurs n’aiment pas tellement à fureter de cette façon. Ça devient frustrant,  laborieux et offre aussi d’autres problématiques.

Problématiques

Les éléments de la page peuvent se retrouver déplacés ou bien être cachés ou tout simplement apparaitre avec un effet de distorsion. Sur certaines tablettes, le fait de pouvoir changer l’orientation soit en portrait ou en paysage vient aussi compliquer la représentation graphique d’un site statique.

Les écrans tactiles offrent aussi leurs lots de frustration ; la sélection d’items est difficile, car les éléments graphiques sont souvent trop petits à manipuler.

Solutions

Le site web au design adaptatif (ou réactifs) vient alors pallier à ces problèmes d’affichages mentionnés ci-haut. Une détection automatique de l’appareil est faite. Le site est alors affiché selon des proportions en pourcentage et non en pixels sur les différents appareils. Une valeur relative est donc utilisée pour faire l’affichage des éléments de la page web et offre ainsi une navigation plus souple et cohérente sur les tablettes et les téléphones. Cette transformation requiert que les appareils supportent le HTML5 et les CSS3 et fonctionnera sur les navigateurs tels que ; Firefox, Chrome, Opera, Safari, Internet Explorer.

Simulateurs

Ce site a été conçu avec un design web adaptatif – “responsive web design” vous pouvez le tester avec un simulateur ou bien juste en rapetissant cette page de votre navigateur. Vous verrez que le site se transforme pour s’adapter à la dimension de la fenêtre et reprendra ensuite sa forme une fois que la dimension de la fenêtre revient à la normale.

 

 Transformer votre site

 

 

 

 

 

Rendez votre site adaptatif dès aujourd’hui !

Contactez-moi
www.waydegowebdesign.com
Madeleine Bergeron