Les sites Responsive

Bonjour à tous ! Je vais vous parler un peu d’une tendance qui s’installe de plus en plus sur les écrans multimédias que nous possédons.
Je parle bien de vos tablettes, smartphones et autres supports numériques pouvant servir à lire ou à expérimenter toute sorte d’activité multimédia. Avec pas moins
de 400 tailles d’écrans différents, il est bien évidemment impossible de créer votre site pour chaque format, l’astuce s’impose presque d’elle même, un site qui s’adapte automatiquement au support.
La solution souvent retenue donc par la plupart des web « agency » est celle de créer un site dit « responsive », mot un peu barbare j’en conviens, il désigne en fait l’utilisation des dernières technologies en langage html aidé par du javascript.
Il faut le dire, il est bien plus long et compliqué et donc coûteux de développer un site « responsive » qu’un site « classique ». Car il est vrai que l’environnement d’utilisation et les recherches faites d’un internaute « classique » d’un internaute sur tablette ou sur smartphone changent bien évidemment l’expérience et donc les besoins d’ergonomie du site. A cause de ça, il faut vraiment se poser des questions de contenu/contenant avant de commencer le design. De ce fait il sera normalement logique d’avoir plusieurs maquettes suivant des catégories de tailles d’écrans.
La seconde solution qui est de moins en moins choisie est celle d’un site un peu moins graphique ou « beau » que prévu mais dont les images pourront facilement être réduites afin d’avoir presque la même « tête » sur un moniteur de pc que sur son smartphone. Pour optimiser le poids des images et le besoin en bande passante on veillera à charger des visuels beaucoup plus petit quand nécessaire.
Dans la première solution on utilisera souvent l’html 5 avec des CSS3 mais qui poseront le problème de ne pas passer partout à l’opposé de l’utilisation de plus anciens langages (html 4 transitionnel avec CSS2 + javascript par exemple) qui seront plus largement lus.
Aller passons au concret, voici quelques exemples qui vous montreront des sites « responsive » avec ou non un design complètement gardé que ça soit sur écran de pc fixe ou sur smartphone.

Exemple 1 de site "responsive"

Exemple 2 de site "responsive"

Voici un article à lire avec des liens de site « responsive », à vos PC, tablettes, smartphones et testez tout ça !

Bonne fin de journée et bon surf à tous !

Mots-clefs :400, css3, design, ergonomie, expérience, fixe, html 5, multimédia, pc, responsive, site, smartphone, tablette, tendance, web