Qu’est ce que : Définition du Responsive Web Design

Il y a des années, lorsque la technologie était ce qu’elle était, vous deviez seulement vous soucier que les choses visuelles que vous faisiez (images, jeux, interfaces d’applications,…) soient bonnes sur un écran qui pouvait être autour des 14 pouces d’un moniteur d’ordinateur. Mais l’évolution a été imparable, et nous disposons aujourd’hui d’une multitude d’appareils et de formats.Cela signifie qu’une interface utilisateur ou tout autre contenu doit non seulement tenir compte de différentes tailles d’image, mais aussi d’appareils utilisés différemment et de rapports d’aspect très différents.
Le web, un développement apparu dans les années 1990 et devenu depuis indispensable, a également subi ces changements dans le paysage des plates-formes à partir desquelles il peut être utilisé, et les organismes qui gèrent les normes web ont dû choisir des solutions ingénieuses pour faciliter la vie des développeurs d’interfaces web.
–

Une page web adaptative (également appelée responsive) est une page dont l’interface est automatiquement redimensionnée et dont les éléments graphiques sont repositionnés pour faciliter la visualisation quelle que soit la taille de l’écran et le rapport hauteur/largeur.

Réfléchissons un instant à la diversité des formats d’écran, allant d’un smartphone avec un écran de 5 pouces et un ratio 18:9 qui se lit verticalement à un téléviseur 40 pouces 16:9, en laissant un ordinateur ou une tablette entre les deux.
Jusqu’à ce que des mesures soient prises pour que l’interface graphique des pages web s’adapte automatiquement à l’écran sur lequel elles sont visualisées, la ‘solution’ consistait à prévoir tous les formats possibles et à servir des pages différentes selon les besoins. Le problème, ce sont les formats qui n’ont pas été prévus et ceux qui ont été induits naturellement par l’évolution technologique.

Les outils permettant de réaliser un design réactif, qui s’adapterait au format de l’écran dans lequel la page web est visualisée quels que soient le format et la taille de l’écran, ont été définis par le W3C (World Wide Web Consortium).

Et l’introduction de cette technologie a été possible grâce à la séparation du contenu des pages de la présentation de ce contenu et de l’aspect général de la page au moyen de fichiers de définition de style CSS.
Elles permettent de modifier l’apparence de tout un site web (entendu comme un ensemble de pages) sans devoir toucher au code source de tous les fichiers HTML, puisque les définitions de style et la présentation (contenues dans le fichier CSS) sont différenciées du contenu (présent dans les fichiers HTML).

Les éléments de la conception réactive ont été discutés et introduits dans les normes Web par le W3C depuis la fin de la première décennie du XXIe siècle.

C’est à partir du lancement du premier iPhone, en 2006, qu’a commencé la course à l’adaptation des sites web pour qu’ils puissent être consultés parfaitement sur les navigateurs de bureau et les grands écrans, ainsi que sur les appareils mobiles.