Positionnez votre menu correctement

Webmastering 32 Commentaires

Attention, cet article a été posté en 2008. Il est possible que les informations mentionnées ne soient plus d'actualité, ou que mon opinion ait évolué. Merci d'en tenir compte lors de votre lecture.

Suite à son billet évoquant les dernières modifications visuelles de Info Webmaster, je discutais avec Funnycat de l'importance de la position d'un menu vertical : est-il préférable de le placer à droite, ou à gauche du contenu ?

Le triangle d'or du positionnement

Une étude [1] démontre que, lorsqu'il parcourt une page web, l'oeil humain explore en priorité une zone triangulaire de l'écran, appelée triangle d'or. Ce dernier est situé en haut et à gauche de la page affichée.

Mettant en avant l'importance du menu par rapport au contenu, Funnycat préfére placer son menu sur la gauche de l'écran. Ainsi, en arrivant sur le site, l'internaute voit le-dit menu en priorité, ce qui lui permet d'avoir un aperçu global et rapide sur la thématique du site.

Cette approche est essentiellement valable pour les nouveaux visiteurs ne connaissant par le site en question. Les habitués ne prêtent plus attention à ces détails, ils connaissent les lieux.

Un curseur de souris rivé à droite

En me basant sur mon expérience utilisateur, je constate que le curseur de ma souris se trouve pratiquement toujours sur la droite de la page, lorsque je surf. Ainsi, il est plus rapide pour moi d'accéder à un lien situé sur la droite de la page ; Cliquer sur les liens d'un menu placé à gauche me demande plus de temps. Après avoir questionné plusieurs connaissances, il semble que cette expérience soit vérifiée pour la plupart des droitiers. Qu'en est-il pour vous ?

Où placer votre menu ?

Partant de ce constat, est-il préférable de privilégier un accès visuelle immédiat sur le menu (en le plaçant sur la gauche de l'écran) ou la rapidité de navigation (en le plaçant sur la droite) ? Personnellement, j'ai choisi la seconde option, pour les raisons suivantes :

  • Je préfère mettre en avant mon contenu, le considérant plus utile
  • Je préfère privilégier l'ergonomie, vu que je vise surtout des lecteurs fidèles

Qu'en pensez-vous ? Quelle stratégie avez-vous adopté, et pour quelle raison ?

[1] Cette étude a été menée par les sociétés Enquiro et Dit-It.com, en collaboration avec la société EyeTool, spécialisée dans les systèmes d'eye-tracking.

Vos réflexions

•
Alors là je suis totalement d'accord avec toi, le contenu à gauche et le menu à droite car en effet la souris reste tout le temps à droite chez la plupart des gens comme ça si il veulent naviguer il l'ont directement sur la souris et le contenu est bien mis en avant, après, reste à voir les proportions des deux parties :)
•
Les articles à gauche et la sidebar à droite ... ;)
•
Oups !
"un accès visuelle immédiat sur le menu (en le plaçant sur la droite de l'écran) ou la rapidité de navigation (en le plaçant sur la droite)"
Tout à droite alors !
•
Bien vu ! Pour ma part, mon design est plutôt centré donc bon... eheh :) Sinon je me rappelle plus, mais il existe un site pour avoir justement le même genre d'image qu'il y a pour illustrer ton article, genre on prend un screen de son blog, on l'upload et hop ! On sait direct où regarde le lecteur :s Parcontre, impossible de le retrouver :s
•
A la lecture de cet article (très bien rédigé), je me rend compte qu'il y a bel et bien deux possibilités, qui ont chacune leurs avantages et leurs défauts.
Je pense que les blogs peuvent effectivement privilégier un menu à droite, néanmoins pour ce qui concerne les petits sites internet (assez bien structuré avec catégorie et sous-catégorie), un menu à gauche peut être la meilleur solution.
Je m'explique:

Blog:
Le public qui visitent les blogs sont souvent des habitués et c'est en général un article en particulier qui est lu à chaque fois. Les habitués (ou les motivés) qui veulent naviguer dans l'arborescence des menus, peuvent prendre un peu plus de temps pour atteindre (des yeux) le menu à droite.
Dans le cas des blogs, le menu est assez long (catégories, blogroll, champ de recherche, publicité, gros bouton pour s'abonner au flux RSS, boutons suivre sur Twitter ...) donc le visiteur prend en général assez de temps pour "fouiller" (ça ne le dérange alors pas trop de "chercher" le menu des yeux).

Site web:
A l'inverse des blogs, les sites web non-dynamique ne change leur contenu que peu souvent. Le public a alors moins tendance à visiter ces sites régulièrement (surtout vrai pour les petits sites, tel des sites vitrines pour une entreprise). Dans ce genre de cas, le visiteur ne trouve pas forcément son bonheur sur la page d'accueil (à l'inverse des blogs où la dernière news est sur la page d'accueil). Il doit alors comprendre rapidement la thématique et la hiérarchie du contenu à l'intérieur du site.
Par conséquent un menu à gauche peut être pratique pour que les internautes trouve rapidement l'information désiré (à l'inverse d'un blog qui parle de sujets et d'autres, donc les visiteurs ne viennent pas pour UN article en particulier).



C'est bien de pouvoir rediscuter sur quelque chose qui me semblait acquis. Merci à toi Jukien pour ce point de vue intéressant.
•
@Sakacoco: Il y a l'outil de statistique "Crazyegg" qui permet d'avoir des "HeatMap" pour savoir où les visiteurs cliquent le plus souvent.


Et pour compléter mon précédent commentaire:
Pour ceux qui hésite, essayez l'une et l'autre des solutions et comparez vos statistique pour voir combien de temps vos visiteurs reste sur vos pages, combien de pages ceux-ci regardent en moyenne, le taux de rebond, ...

Mais les statistiques vous dirons si les visiteurs visite beaucoup votre blog, mais elles ne dirons pas si ceux-ci auraient tout de même préféré un menu à gauche/droite.
•
@GrocAlain : Merci, la coquille est corrigée.

@Sakacoco : Si tu retrouves l'adresse du site en question, ça m'intéresse.

@Funnycat : En effet, tout dépend du type de contenu. Pour un site dynamique, proposant des articles, des tests... les internautes sont avant tout intéressés par le contenu. Ces personnes peuvent accéder directement à un article suite à une recherche Google, trouver la réponse à leur question, et repartir, sans avoir forcément envie de lire le reste.
•
Très très bon article !
Informations intéressantes pour un prochain site !
•
@Dvins : Merci
Pour un prochain site ? Un site déjà existant peut également subir un petit lifting ; Techcrunch en est l'exemple ;)
•
Re,

Petites précisions perso: Quand j'ouvre un site ou un blog, mon regard se porte toujours systèmatiquement sur la gauche donc ou devrait se trouver le contenu et à la rigueur je regarde à droite le menu, pour moi c'est logique et petite bizarrerie anglo-saxonne, la grande majorité des sites Web ou blogs, la tendance est majoritairement à l'inverse, contenu à droite et menu à gauche ce qui pour moi est contre nature, donc allez savoir le pourquoi du pourquoi ! Moi, cela me déstabilise ... (pas mal de sites européens et francophone, c'est pareil) ... ;)
•
@Jean-Marie : Après, le problème reste toujours le même : Vaut-il mieux mettre en avant le contenu ou le menu ? Difficile de trancher, ça dépend du site (dynamique ? statique ? type de contenu ?).
•
<strong>Update:</strong>

Exemple bizarroïde Julien, si tu regarde trois grands blogs comme Techcrunch, Mashable et ReadWriteWeb qui tout les trois ont une version anglo-saxonne et une francophone, les trois blogs ont leurs contenus à gauche et menus à droite quelque soit la version héhé ! A méditer ... ;)
•
@Jukien: C'est le contenu le plus important et non le menu ou alors j'en perd mon latin !! ;)
•
@Jean-Marie : Pour un blog, c'est certain. Mais, comme le démontrait Funnycat plus haut, pour un site statique (vitrine d'une entreprise, par exemple), c'est déjà beaucoup plus discutable.
•
@jukien: Yep peut-être mais l'article ne fait pas allusion à un site statique d'entreprise, nous parlons de quoi là exactement stp ? ;)
•
Billet très intéressant.

En effet, ta réflexion est assez poussée, et remet directement en cause la fameuse règle du triangle d'or du positionnement. Dans ces conditions, trancher sur la position du menu est beaucoup plus délicate.

Toutefois, pour l'anecdote, le triangle d'or du positionnement a d'abord été établi pour la position des publicités : il est beaucoup plus intéressant d'avoir une annonce placé en haut à gauche qu'en bas à droite. Puis, par extrapolation, il a été appliqué à la présence des menus, du contenus, des liens d'abonnement RSS, etc.


@Jean-Marie : Cet article concerne un site web, quel qu'il soit. Ca peut être un blog, comme un site-vitrine, ou encore un site de partage de vidéos. Et justement, la réponse à la question posée dépendra de ces critères.
•
moi j'emmerde les cons de visiteurs qui ne savent même pas lire et qui ne font que zapper.

et puis de toute façon personne n'aime mon design sur lequel je me suis fait chier des jours.
•
incroyable le nombre d'imbéciles qui citent et prennent techcrunch en exemple d'ergonomie et de design... et en plus ça ose donner des leçons en la matière.
•
je rejoins jean marie :
je préfères les menus à droite même si mon regard part vers la gauche en premier lieu

Et au vu des tests que j'ai fait les liens les plus cliqués sont effectivement sur ce fameux triangle (en haut à gauche)

donc pour le confort de lecture menu à droite
si objectif clic adsense ou autres : menu à gauche :)

@+
•
Idem pour moi: contenu à gauche, menus à droite et souris qui traine toujours à droite, tout pret de la scrollbar...
C'est ce que j'applique sur plouceur.com en tout cas.
•
@seoman : En effet, la présence ou non de publicités dans le menu est à prendre en compte. Même si je pense que mettre trop en avant cette publicité peut aussi avoir un impact négatif : faire fuir le visiteur.
•
Pour enrichir ce débat, voici le contenu d'un message publié sur avenir.youvox.fr (lien direct dans "site") :


03/12/2057 : Syndrome récurant

Le RFS (Right Frame Syndrom), syndrome de la colonne de droite, n’en finit pas de terroriser les agences de communication.

Formalisé dans les années 2010, ce « syndrome » décrit la capacité que développe l’oeil d’un internaute à éviter une partie de la page dès que celle-ci est identifiée comme publicitaire. À cette époque, la colonne de droite était dévolue aux "réclames", la partie de gauche de la page étant dédiée aux menus « utilisateur ».

Avec la généralisation des caméras intégrées aux ordinateurs, des entreprises telle que Google avaient tenté de modéliser les comportements des internautes et, plus particulièrement, des mouvements de l’œil afin de déterminer où placer les messages publicitaires. Ces recherches amenèrent les programmeurs à développer des langages permettant aux pages des sites d’être dynamiques, c’est à dire, de prendre la composition la plus adaptée à un individu donné. Jamais ces recherches arrivèrent à prouver la pertinence des fonds investis. D’autant plus que nombre d’utilisateurs quittèrent les providers trop entreprenant à l’encontre de leurs libertés individuelles.

Qu’il s’applique à « la colonne de droite » ou à tout autre endroit d’un espace virtuel, il est évident que l’esprit humain sait ne voir que ce qu’il veut voir. Les publicitaires font appel à une armée de moyens toujours plus diversifiés. L’un de ces moyens consiste en l’analyse des bruits environnants de l’ordinateur, afin de déterminer les habitudes de l’utilisateur. Les contrôles des caméras étant inaccessibles à l’utilisateur lambda, l’analyse peut donc se faire en toute tranquillité et sur de longues périodes. Il ne reste à l’utilisateur que la liberté d’éteindre son ordinateur, au lieu de le laisser en veille...

© Olivier Parent
•
Je suis d'accord pour le contenu à gauche et les menus à droite (et à gauche aussi pourquoi pas).
•
Mouais ... ton triangle d'or s'applique uniquement à google mais en aucuns cas à d'autres sites ! Dans le cas de google il est normal que ce triangle soit déssiné de la sorte car tout e monde sait que les 1er résultats sont les plus pertinants, de fait les plus cliqués ! Les heatmap de la plupart de mes sites montrent qu'il n'existe aucun triangle d'or ! Les zonr les plus cliquées en générale se trouve au dessus du titre de l'article et en dessous du contenu. Après pour les barres latérales il y a une légère préférence pour la droite, mais ce n'est pas énorme non plus !

Moralité, place ton menu en haut ou a gauche comme ça tu exposes bien ton contenu ... ce qui est préférable la plupart du temps. Sauf si ton site n'a pas de contenu et contient 5 pubs par page, alors là tu as effectivement tout interet à "perdre" le visteur ....

Sur ce ... bon dimanche ! A non, bon samedi !
•
@Brad : Le triangle d'or à la première zone que parcourt notre oeil lorsqu'il observe une page (web ou non, d'ailleurs). C'est donc valable sur Google, mais également sur tous les autres sites.

Pour observer un tel résultat en comptabilisant le nombre de clics, il ne faut considérer que les nouveaux visiteurs. Comme mentionné dans le billet, les habitués connaissent les lieux, et font davantage appel à leur mémoire.
•
Si la sourie est principalement a droite c'est peut etre parce que le scroll barre est a droite ... enfin bref :

je propose un menu sur la droite pour une rapidité de navigation mais des récapitulatifs et autre historique sur la gauche pour une vision rapide du contenu ...
•
@Sakacoco

le service clickheat ( http://www.labsmedia.fr/clickheat/index.html ) permet d'installer sur son site un outil de statistiques visuelles. Cela permet de voir sur quelles zone de son site les visiteurs cliquent le plus souvent.

De souvenir, l'installation est assez facile (un dossier a uploader, et un script js a appeler dans les pages à etudier.)

opi
•
Trop souvent on lit "le menu doit être à gauche". Je suis tout à fait d'accord avec toi que le placer à droite c'est le mettre à côté de la scrollbar et donc plus prêt de la souris même si avec les roulettes c'est moins vrai.

j'ai rédigé un article sur ce sujet http://www.affinity-web.org/lanews-88.php avec la conclusion, droite, gauche peut importe, il faut seulement le rendre visible sans casser le design du site.
•
Comme je le disais dans un premier commentaire, je suis plutot menu à droite. Mais tout de même je me demande si ce n'est pas non plus une histoire de droitier/gaucher... des gauchers dans la salle??
•
Je suis ambidextre. :D
Personnellement, je tiens à ajouter qu'il convient aussi de placer le menu là où l'attend le plus. Dans le cas d'un site, depuis le début de l'internet le menu à gauche l'a largement emporté.
Je ne suis pas sur à 100%, mais le fait de placer un menu à droite, ça se retrouve surtout dans le cas des blogs (du fait du contexte différent, cité plus haut).

Sinon il est possible de trouver une solution alternative: un menu des deux côté. A gauche le menu avec la hiérarchie du site et à droite les menus alternatif (du genre: "top 10 des articles", ...). Par contre avec cette méthode il y a moins de place pour le contenu.
•
Intrigant
on va peut-être faire un essai avec le menu de l'autre côté...

ilonet

Un geek devenu CTO

Partenaires

Recherche