Les défis de déménagement à la navigation horizontale


Original: http://www.uie.com/brainsparks/2006/04/26/horizontal-navigation/

 

Screenshot 2014-06-23 18:21

Joshua Porter

Par Joshua Porter

26 avril 2006

 

Les concepteurs de CNN.com récemment redessiné sa page d’accueil, passant d’une gauche, système de navigation verticale à un un haut-de-la-page horizontale. Ils ont même créé une page qui met en valeur leurs nouvelles modifications.

Fait intéressant, les concepteurs n’ont pas changé (ou n’ont pas encore changé) les pages intérieures du site, conduite designers noix de cohérence d’esprit partout. Heureusement, cependant, cela nous donne l’occasion d’examiner de près les décisions qu’ils ont prises, et de mettre en évidence plusieurs problèmes inhérents à un tel changement.

Voici ce que leur page d’accueil ressemblait à ceci récemment:

CNN homepage

Et voici ce que une page intérieure ressemblait à:

CNN subpage

Comme vous pouvez le voir, la mise en page a radicalement changé. Le contenu a été décalé à gauche, où la navigation était. La navigation est maintenant dans une barre bleue mince en haut de la page. Cela a pour effet positif de déplacer le poids visuel loin de la navigation et vers l’histoire réelle. Lorsque la navigation est sur la gauche, nos yeux sont attirés par elle instinctly, même si nous savons déjà ce que c’est. Cette distraction, même minime, est moins perceptible dans la nouvelle conception horizontale.

Pour obtenir ce changement, les concepteurs n’ont pas simplement mettre les boutons de nav gauche de bout en bout sur le haut de la page. Non, ils ont dû faire plusieurs choix de conception. La plupart de ces choix ont été influencés par la largeur de la page et le nombre de liens avec lesquels ils travaillaient.

   1. longueur du lien rétrécit
Une des premières choses à changer lorsque la navigation va horizontale est la longueur de liens. Dans la conception de CNN, les concepteurs raccourcies plusieurs liens. «Les affaires à CNN Money” est devenu “affaires”. “Le sport comme SI.com” est devenu “Sports”. “Autos avec Edmunds.com” est devenu “Autos”. Et “Dossiers” est devenu simplement “Promotions”. Notre recherche ici à l’IUE a montré que plus le lien, mieux ça marche. Dans ce cas, cependant, il ne semble pas beaucoup a été perdu lorsque les liens ont été coupés. A été “à CNN Money”, ajoutant vraiment toute information pertinente sur le lien “Business”? Probablement pas beaucoup. Même si, en réduisant le lien «rapports spéciaux» à seulement «Specials» semble avoir perdu quelque chose.

Les barres de navigation, cependant, sont un cas particulier de liens. En général, nous avons vu bref, un seul mot les liens de navigation fonctionnent au niveau de la barre de navigation supérieure sur les sites où les paragraphes sont relativement distinctes. Cependant, comme vous plonger plus profondément dans le site, des liens ont tendance à travailler mieux quand ils sont plus parce qu’ils ont besoin pour contenir plus d’informations qui les différencie de leurs frères et sœurs. Par exemple, “Sport” et “Business” sont deux catégories relativement distinctes, afin de créer des liens de navigation haut niveau avec juste ces mots pourraient être appropriées. Mais quand le “Business” sous-site, tout est à faire avec les entreprises, de sorte que les liens doivent distinguer clairement quelles sont ces différences. Le plus de mots, il ya dans les liens, plus il est facile de le faire.
2.   Nombre de choix de navigation des changements
Dans la configuration verticale de navigation sur les sous-pages CNN, il ya 17 choix de navigation. Dans la configuration de navigation horizontale sur la page d’accueil il n’y a que 12. Les concepteurs ont réduit les choix pour économiser de l’espace. Il n’y aurait pas eu assez de place pour mettre tous les 17 sur la barre de navigation horizontale à la même page width.In afin de garder les mêmes choix de navigation comme avant, les concepteurs ont choisi d’utiliser une liste déroulante pour maintenir les liens restants. Il s’agit d’une méthode commune que les concepteurs utilisent quand ils ne veulent pas mettre tous les liens sur la page en même temps. Cependant, notre recherche a montré à maintes reprises que des listes déroulantes et des icônes déroulantes ne fonctionnent pas très bien. Nos articles classique utilisateurs décident d’abord, proposer la deuxième parle de cette manière plus approfondie.

En conséquence, je serais prêt à parier dollars à beignets que ces liens dans la liste déroulante ont moins de personnes en cliquant sur eux qu’ils faisaient quand ils étaient dans la barre de navigation verticale. La raison en est simple: les gens doivent travailler pour les voir maintenant.
3. Hiérarchisation des choix
Les concepteurs de CNN n’ont pas simplement prendre les cinq derniers liens et de les mettre dans la liste déroulante. S’ils l’avaient fait, ils auraient choisi “Voyage”, “éducation”, “rapports spéciaux”, “Vidéos”, et “Automobiles”. Au lieu de cela, ils ont choisi “la Loi”, “Science et espace”, “Voyage”, “éducation” et “Vidéos”. Évidemment, les concepteurs ont pensé que “Autos” était plus important que «la loi» et «rapports spéciaux» était plus important que “la science et de l’espace”. Ils ont pris une décision explicite de prioriser certains sur others.This est une question de problème commun que nous voyons avec le passage à la navigation horizontale. À un certain point, les choses doivent être coupés. Au lieu de perdre de la valeur, cependant, les équipes de conception peuvent utiliser cela comme une occasion de faire un site plus fort en se concentrant sur ce qui est le plus important sur le site. Nous avons vu de nombreuses équipes de conception essaient d’inclure tout sous le soleil dans leur site Web, quand dans presque tous les cas, la grande majorité des visiteurs viennent pour un petit ruban de contenu.

Ce sont trois défis de conception évidentes que l’équipe a dû faire face lors du passage à un système de navigation horizontale. La plupart des équipes de décider cette question très devront faire face à cela et plus encore. Avez-vous des défis intéressants à partir d’une décision récente de navigation horizontale? Envisagez-vous une telle démarche?