Alors qu’il y a quelques années, la part du trafic web en desktop était encore majoritaire, le mobile concentre aujourd’hui la majorité du trafic internet. En France, en 2020, d’après une étude réalisée par We are Social, 82% des français se connectaient à internet depuis un appareil mobile. Toutefois, même s’il est désormais clair que les entreprises doivent adapter leur site web au format mobile, il n’est en revanche pas toujours évident de s’y retrouver parmi les différent procédés possibles.
Alors, quelle est la difference entre un site web mobile first, adaptive design et responsive design ? Dans quels cas les utiliser ? Découvrez sans plus attendre tout ce qu’il faut savoir sur les différents formats des sites web mobile.
LE MOBILE FIRST
Qu’est ce que c’est ?
Le mobile first diffère du responsive et de l’adaptive design. A la difference de ses congénères, le mobile first est une stratégie visant à placer le format mobile au cœur du design. Cela consiste à d’abord concevoir un site au format mobile, puis décliner son design dans un second temps en version desktop et tablette. Ainsi, le mobile first est une pratique récente, qui s’est développée avec l’essor des smartphones. Elle est à l’encontre de l’approche traditionnelle du web design, qui consiste à designer un site web en desktop, puis de le décliner sur les autres supports.
Ses avantages sont les suivants. Avec les autres techniques de web design, il n’est malheureusement pas rare de constater que de nombreux aspects visuels ou fonctionnels d’un site ne soient pas bien adaptés en version mobile. Le mobile first permet alors de contrer ce problème, en priorisant l’UX et l’UI sur smartphones.
Pour quelles entreprises ?
Le mobile first est adapté pour les entreprises dont la principale source de trafic web est mobile. Toutefois, selon les industries, ce chiffre diffère fortement. Pour connaitre en détails les principales industries dont le trafic web est majoritairement mobile, visualisez notre infographie sur les chiffres du Mobile en 2020.
Ci-joint une liste des principaux secteurs de E-commerce dont les connections sont majoritairement faites sur smartphones:
- Le luxe (67%)
- Le retail/Fashion (66%)
- Les cosmétiques (66%)
- La grande distribution (57%)
- L’automobile (57%)
- La maison/high-tech (56%)
LE RESPONSIVE DESIGN
Tout comme l’adaptive design, le responsive design est utilisé pour adapter l’ergonomie d’un site desktop sur d’autres appareils, en version mobile et tablette. A la difference du mobile first, le format mobile n’est pas au cœur de la stratégie de design. Ici, le site web est d’abord créé en version desktop, puis décliné dans un second temps sur d’autres supports.
Cependant, le responsive design diffère de l’adaptive design de part sa particularité à adapter son contenu à chaque dimensions, sans avoir auparavant rentré une liste de dimensions d’écrans. Par exemple, si la taille de la fenêtre de navigation d’une page web est réduite, la page page va s’adapter aux nouvelles dimensions de manières fluide, avec une transition douce.
L’ADAPTIVE DESIGN
L’adaptive design, quant à lui, consiste à développer un site d’après une liste de dimensions d’écrans définies. Il utilise pour cela des mises en pages statiques basées sur des points d’arrêt, ce qui rend les transitions entre écrans beaucoup moins fluides que pour le responsive design.
Adaptive & responsive design: pour quelles entreprises ?
Ainsi, la difference entre l’adaptive et le responsive design demeure subtile. En effet, seul le procédé technique permettant d’adapter un site à ses different supports varie. Contrairement au mobile first, l’adaptive et le responsive design revendiquent une approche traditionnelle du web design, priorisant le format desktop au format mobile.
Par conséquent, ces techniques sont adaptés à des entreprises dont la principale source de trafic se fait sur ordinateurs. Les secteurs de l’énergie (39% de trafic via smartphones en 2020) et financiers (39%) sont particulièrement judicieux.
