Un beau menu vertical en css à 3 niveaux

Bonjour à tous, pour un client j'ai fait un menu en css assez complexe. Disons très très complexe. La complexité c'est l'arrivé de IE7, néanmmoins j'ai réussit à faire quelques chose d'intéressant avec une belle sémantique.

Je vous laisse regarder ça, et pour ceux qui voudrait s'inspirer, ne vous gênez surtout pas

URL : http://www.psnm.qc.ca

CSS : http://www.psnm.qc.ca/menu.css
Modifié par Zial (31 Jan 2007 - 20:27)

Zial a écrit :
On fait comment pour naviguer, on passe la souris au petit bonheur la chance pour voir si ça déroule ?

Premièrement, le site à été conçu de manière à pouvoir naviguer de façon linéaire, je m'explique : Quand on click sur un menu, la page qui ouvre contient les liens des sous-menu et ainsi de suite.

Aussi, le but de menu déroulant c'est d'accéder plus rapidement à l'information pour les utilisateurs réguliers. Donc dans le cas d'un pensionnat, c'est très utiles !
Ben pourquoi pas. J'aurais tendance à dire qu'il est plus gênant qu'autre chose de dupliquer l'information et les moyens de navigation (sous-menu dans la page doublé du même sous-menu dans le menu déroulant), et je préfère personnellement la structure 1 Menu principal (sections principales du site) + sur chaque page 1 menu de sous-section (sur un ou deux niveaux, suivant les besoins).

Je ne sais pas si tu as lu ceci ? C'est un topo assez intéressant.

Par ailleurs, ça n'empêche pas que l'on ne distingue pas, visuellement, les items de menu normaux de ceux qui dérouleront un sous-menu. Une petite indication visuelle (pictogramme, couleur de fond...) aurait été utile.

Zial a écrit :
Mais personnellement je ne trouve pas ça nécéssaires.

Fais un test sur plusieurs utilisateurs, pour voir.

De plus, il ne s'agit pas de déterminer une majorité. Mettons que 80% des utilisateurs ne trouve pas ça nécessaire du tout, tandis que 20% trouvent ça absolument indispensable (bien sûr, ça ne sera pas aussi tranché... mais admettons).
- pas de pictogramme significatif : 80% de satisfaits ;
- ajout d'un pictogramme significatif : 100% de satisfaits.
À toi de voir.

Florent V. a écrit :

Fais un test sur plus
- pas de pictogramme significatif : 80% de satisfaits ;
- ajout d'un pictogramme significatif : 100% de satisfaits.

ce qu'on peut exprimer sous la forme:
- pas de pictogramme significatif: 20% d'insatisfaits
- ajout d'un pictogramme significatif: 80% d'insatisfaits

J'aime beaucoup les tests utilisateurs
Modifié par Laurent Denis (31 Jan 2007 - 22:03)

Zial a écrit :
néanmmoins j'ai réussit à faire quelques chose d'intéressant avec une belle sémantique.

Je vais être dur, mais j'ai beaucoup de mal avec le mot sémantique (déjà difficile à accoler à (X)HTML) quand je tombe sur une page sans aucun élément de titrage.

sinon, pour l'adresse en lien avec le site, c'est l'élément <address>. Qui ne sert strictement à rien, mais qui est sémantique en diable.

Je sors

Zial a écrit :
lol à chaque fois que je post sur ce forum, c'est un débat entre l'accessibilité, la sémantique, w3c et bla bla bla ... Y a-t-il une "foutu" manière normale de programmer ???

Oui.

La tienne.

C'est à dire celle qui correspond à ta situation, tes compétences, tes contraintes de production, tes objectifs d'accessibilité et de validité. Bref, la notion de quailité Web.

Zial a écrit :

Néammoins, il y aura toujours des gens pour critiquer ! CIAO

Disons que le but du jeu est simplement de repousser les limites du faisable.

Pas fâché ?

Salut,

Zial a écrit :
j'ai fait un menu en css assez complexe. Disons très très complexe

clap, clap, clap...

Bon ok c'est habile mais est ce que ça marche avec un menu à quinze sous niveaux ? Parce que l'habileté c'est bien mais la grande jonglerie css c'est encore plus rigolo

Ah ça servirait à rien ? ... Oui mais au moins ce serait rigolo.

Dans ton cas c'est habile, sans être spécialement rigolo, et ça ne sert à rien non plus... 49 liens ça ne s'appelle plus un menu mais un plan de site !!! Et ça n'a rien à faire ainsi dans toutes les pages !!!

Au fait un petit lien "aller directement au contenu" en début de flux ce serait cool je pense
Modifié par clb56 (31 Jan 2007 - 23:53)

Bonjour,

Zial a écrit :
Tu connais quoi au site institutionnel ? La première règle c'est d'avoir accès rapidement à des contenus pour les visiteurs réguliers. Dans un site comme celui la, c'est très utile !!!

Pourquoi te vexer ainsi ? La remarque de clb56 est parfaitement fondée. Un plan de site est tout aussi pratique et sert justement à cela. Un menu se doit d'être simple pour être clair, en particulier pour les lecteurs vocaux ou les personnes souffrant de problème de concentration. Par ailleurs, ce n'est pas forcémment sympa de se taper tous les liens du menu à chaque fois qu'on souhaite accéder au contenu. Tu pourrais déjà contourner ce problème en mettant des liens d'évitement ou tout simplement en faisant une synthèse et non en tentant de mettre un accès rapide à l'ensemble du site. Encore une fois, oui, c'est le rôle du plan du site que d'être aussi complet.

a écrit :
Comme je l'ai dit plus haut, pour contenter des gens comme toi, il faudrait avoir un seul bouton de 300px x 200px en millieu de page.

Il serait sympa de ta part de redescendre de ton petit nuage. Ton menu comporte des défauts et ce n'est pas parce que certains t'en feront la remarque qu'il faut les prendre pour des abrutis. N'es-tu pas là pour recevoir une critique ? Doit-on considérer ce sujet comme du spam ? Crois-tu être le seul à être à la hauteur ici ?

a écrit :
De toute façon, je crois avoir accompli un niveau pour ce genre de manipulation css, je met au défi les intégrateurs d'essayer ça

... no comment...

a écrit :
De toute façon, ce menu était fait en javascript depuis 2 ans et les commentaires était très positif voire indispensable. Ensuite, j'ai refait ce menu en css le metant beaucoup plus léger qu'avant !

Tes feuilles de styles sont conséquentes... Ca se ressent au lancement de la page. Le menu n'est pas opérationnel de suite alors que je suis en haut débit. Ca va en perturber certains. Peut-être que javascript n'était pas si inadapté à la situation après tout puisqu'il te permettait d'y remédier.

a écrit :
En tout cas ... merci pour ces commentaires non constructif, j'apprécie, ça me rappelle de ne pas devenir fou à ce point la sur les réalisations, car rien n'est au gout de tous !

Les commentaires que tu as reçu sont au contraire très constructifs mais tu ne sembles pas disposé à en discuter apparemment. C'est de mauvaise augure pour la suite. Je vais même me permettre d'être aussi virulant que tu l'as fait :
- Que connais-tu aux menus déroulants pour t'imaginer que c'était un exercice facile ?

Et vais-je encore te vexer si je dis que ton menu est impraticable à la navigation clavier ?

Bien entendu que ce ne sera jamais parfait et que tous les utilisateurs ne seront pas forcémment satisfaits mais accepter ses erreurs, c'est déjà faire un grand pas pour tenter d'y remédier. Les critiques n'ont rien néfastes, bien au contraire. Sans compter qu'il est important que ceux qui croiseraient ce menu et qui seraient tentés de l'intégrer dans leur pages en soient avertis, c'est la moindre des choses.
Modifié par koala64 (01 Feb 2007 - 06:39)

Bon anyway je ne perdrai pas plus mon temps avec des posts comme ça ... tu peux le considérer comme du spam, cela ne me dérange pas.

A bientot dans une autre vie peut-être !

P.S. Je ne suis pas vexé, juste un peu déçu ! Sans rancune !