Est-il temps de repenser la navigation de site internet ?
Le lien hypertexte est un aliment de base d’Internet depuis ses débuts. Le Web ne serait tout simplement pas du tout un site Web si nous ne reliions pas d’une page Web à une autre. Les liens font fonctionner le Web. Il serait donc logique de consacrer beaucoup de temps et d’efforts à la création de vos liens internes et de la navigation de votre site internet.
Mais ce n’est pas toujours le cas. Souvent, nous modifions la phase d’architecture de l’information d’une construction de site et retombons dans l’un des rares modèles de conception éprouvés - un modèle prédéfini - pour la conception de la navigation dans les sites.
Le statu quo de la navigation de site internet
L'une des nombreuses beautés de la création de site internet est les options quasi illimitées qui s'offrent à nous. Pourtant, nos systèmes de navigation semblent toujours coincés dans les solutions préformées existantes.
Pour les sites personnels de petite taille, une barre de navigation horizontale supérieure simple est l'option habituelle.
Pour les sites plus importants avec plus de pages vers lesquelles créer un lien, nous utilisons par défaut une barre de navigation verticale empilée pour nous permettre d'inclure plus de liens.
Dans d'autres situations, nous constatons que les menus déroulants ou menus volants sont utilisés pour maintenir le menu de navigation compact.
Il est facile de comprendre pourquoi nous avons ces options. Dans une certaine mesure, nous avons été obligés de nous y conformer à cause des limites précoces de la conception Web.
Au fil du temps, nos utilisateurs se sont habitués au statu quo. En conséquence, nous avons hésité à repenser la conception des systèmes de navigation.
Et même si nous n’avons pas mis nos utilisateurs au premier plan, pourquoi passer du temps à créer quelque chose de nouveau lorsque les solutions usurpées fonctionnent ? (Au moins pense-t-on qu'elles le font, de toute façon.)
Mais ces formes de navigation conventionnelles restent-elles les meilleures solutions ?
Évolution naturelle
Depuis sa création, la conception Web continue d'évoluer à un rythme rapide. Nos créations sont de plus en plus faciles à utiliser, plus agréables à utiliser, plus riches en fonctionnalités et plus optimisées pour la vitesse.
Grâce aux modifications apportées, nos conventions en matière de navigation sont restées inchangées, à l'exception peut-être de la courte augmentation des sites Web entièrement basés sur Flash qui ont introduit des conceptions assez uniques de systèmes de navigation.
Ce site Flash renonce aux modèles de conception de navigation courants que nous voyons dans la plupart des sites Web.
Bien qu'il existe de nombreuses raisons pour éviter de remonter à l'époque des sites web entièrement créés en Flash - que ce soit pour des raisons de performance, de SEO, d'accessibilité Web, d'indépendance vis-à-vis d'une technologie propriétaire, etc. - pour la plupart de nos projets, nous pouvons encore être en mesure de s’inspirer de ce que les sites Flash nous ont montré, en particulier pour repenser l’apparence et le fonctionnement de la navigation sur un site Web.
À mesure que les fonctionnalités des navigateurs Web se développent et que les spécifications de conception Web continuent de progresser - plus récemment avec CSS3 et HTML5 - nos possibilités de conception se multiplient.
La navigation sur les sites Web devrait être au premier plan de nos préoccupations lorsque nous tirons parti de ces nouvelles technologies pour améliorer l'expérience utilisateur.
Nous avons déjà vu le CSS3 en action dans une certaine mesure, notamment sur des conceptions Web responsives qui transforment la présentation du menu de navigation à la volée en fonction de la taille de l’affichage de l’utilisateur (à l’aide de requêtes de médias).
Sur le site du groupe Chopard, la disposition de navigation change d’horizontale à verticale en fonction de la taille de l’affichage.
Changer avec un but
Bien sûr, changer quelque chose juste pour changer est une mauvaise excuse. Nous ne devrions pas changer la conception et la disposition des systèmes de navigation simplement parce que nous avons les outils pour le faire.
Au lieu de cela, nous devrions aborder la situation en examinant les problèmes existants liés à la conception de la navigation et la manière dont nous pouvons les résoudre avec les nouvelles techniques disponibles.
Certaines des questions les plus importantes portent sur des éléments tels que l'emplacement de la navigation, à quel point elle devrait être expansive, ses formes et le type de retour d'information qu'elle fournira aux utilisateurs. Tous ces éléments conduisent à d’énormes décisions qui jouent un rôle central dans la création utilisable, flexible et pratique de votre conception.
Darty offre la possibilité de naviguer dans son immense stock de produits avec de multiples solutions de navigation.
Le nouveau visage de la navigation
Le CSS peut faire des choses vraiment excitantes de nos jours et il y a de nombreux designers qui expérimentent et repoussent les limites de l’innovation.
Par exemple, Chris Coyier, blogueur et développeur Web, montre qu’il est possible de dessiner des formes adaptatives qui transcendent les limites d’évolutivité des images.
Le concepteur / développeur web Alex Girón nous montre que nous pouvons créer des effets d’animation et des transformations assez impressionnants avec son expérience impliquant l’orbite du système solaire.
Cet échantillon de possibilités montre des capacités assez impressionnantes. Il ne faut pas longtemps pour voir que ces expériences peuvent être adaptées de manière pratique pour résoudre les problèmes de conception.
Avec les formes et la possibilité de les animer, nous avons les éléments de base pour créer des interfaces flexibles et imaginatives.
Inspiration hors ligne ?
Il n’est pas nécessaire d’aller loin pour voir de nouveaux rebondissements quand on parle de navigation. Nos ordinateurs, chaînes stéréo, appareils ménagers, véhicules et même nos claviers utilisent tous un large éventail de formes, de tailles et de couleurs pour créer une interaction.
La barre d'espace de votre clavier n'est pas plus grande que les autres touches par ce qu'elle contient plus de caractères. Non, c'est juste que c’est la plus utilisée, c’est donc le plus important - une application de la loi de Fitt.
Comparez la taille de votre barre d'espace à votre touche Y, par exemple. Dans votre conception Web, le lien Accueil (ou tout autre lien de navigation fréquemment utilisé) pourrait-il également bénéficier de la même augmentation de taille par rapport à un lien moins important ?
Les interfaces de nos chaines Hi-Fi, de nos télécommandes et de nos tableaux de bord de voiture offrent tous une grande variété de tailles, de formes et de couleurs pour indiquer les différences d’importance et de fonctionnalité.
Nous sommes en mesure de concevoir ces solutions dans nos interfaces Web sans sacrifier la flexibilité ou l’accessibilité, raison pour laquelle nous n’y avons pas recours, en utilisant l’amélioration progressive et d’autres pratiques exemplaires.
Pour illustrer mon propos, j'ai rassemblé un exemple rapide d'une navigation inspirée de la première génération par iPod, utilisant uniquement le langage HTML et CSS.
En réalité, un cercle permet souvent une utilisation beaucoup plus pratique de l'espace par rapport aux formes rectangulaires.
De plus, avec toutes les zones actives de notre navigation naturellement placées à égale distance les unes des autres, ce type de navigation est conforme à la loi de Fitts.
Bien sûr, cela peut ou peut ne pas être la meilleure solution pour une situation donnée, mais c'est la beauté de notre métier. Les concepteurs doivent prendre le temps et la considération nécessaire pour explorer toutes les contraintes inhérentes à chaque projet et élaborer des solutions individualisées et idéales.
Profitez des nouvelles opportunités pour la navigation sur votre site internet
Aujourd'hui plus que jamais, nous avons la possibilité d'utiliser notre créativité pour résoudre des problèmes complexes avec nos systèmes de navigation. L'adoption rapide de CSS3 libère une énorme quantité de potentiel de conception. Nous pouvons commencer à penser en dehors du nombre limité de modèles de conception que nous avons pour la navigation sur les sites. Contactez-nous en ligne pour en savoir plus ou par téléphone au 06 80 60 77 77.