ResponsiveLes appareils mobiles prennent de plus en plus de place dans nos vies. En conséquence, il est impossible lors de la conception d'un site web de faire fi des multiples dimensions d'écrans qu'ils engendrent. D'où l'importance d'adopter une approche responsive.
Pour ce faire, il faut abandonner nos idées rigides:
- 🚫 Canvas prédéterminé
- 🚫 Unités de mesure absolues
Ça peut paraître compliqué à première vue, mais si on prend le temps d'analyser le tout calmement, nous verrons que ce n'est pas sorcier!
L'approche adaptive utilise plusieurs mises en page prédéfinies (ex: mobile, tablette, grand écran, etc.) En fonction de la dimension du navigateur, la mise en page la mieux adaptée est affichée.
Le contenu est fluide et donc s'ajuste parfaitement à la dimension de l'écran, peu importe cette dernière.
You put water in a cup, it becomes the cup;
You put water into a bottle, it becomes the bottle;
You put it in a teapot, it becomes the teapot.
Les sites responsives et adaptives sont similaires, en ce sens où ils s'ajustent à leur environnement (généralement la largeur du navigateur), mais divergent dans leur façon de faire.
À gauche, responsive. À droite, adaptive.