28172 sujets

CSS et mise en forme, CSS3

Je veux faire un menu déroulant, je choisi :




Bonjour,
J'ai récemment développé ce site :
www.drlw-archi.com
Dont la navigation observable à partir de :
http://www.drlw-archi.com/book.php?page=010101
s'effectue grâce à un menu déroulant vertical uniquement réalisé avec du CSS :
http://www.drlw-archi.com/defaut.css
Cette solution fonctionne sur TOUS les navigateurs les plus récents (<1an) et j'estime à 85% sa compatibilité en fonctionnement optimal (pour les 15% restant, la navigation est aussi possible sans déroulement, par clics successifs).
J'ai cependant observé que cette méthode était tombée en désuétude sur alsacréation (d'où j'ai pourtant tiré une bonne partie de mon "inspiration").
Qu'en pensez-vous ? Le CSS dynamique est-il voué à l'échec ? Faut-il nécessairement utilisé du JavaScript pour de telles applications ?
Comprenez que je cherche ici à créer un topic sur le fond, la méthode, et non pas sur le code à proprement parler.
Si cependant vous êtes intéressés par mon code, n'hésitez pas à l'utiliser, ni à me poser des questions.
Merci d'avance.

PS: Vous remarquerez l'utilisation du DewPlayer (merci!) et de frame pour la musique de fond (désir du commanditaire). Y'a-t-il une solution plus "strict" à cette fonction ?
Modifié par bedhed (05 Nov 2008 - 05:18)
Bah moi je dirai tu gardes ton css tel quel et si tu veux utiliser du javascript (car ça peut être plus agréable à l'utilisation dans certains cas) tu lui fait virer les styles css avant de faire sa sauce. De la sorte, si tu as pas javascript d'activé le menu déroulant marche grace aux css, si tu l'as, le comportement css est supprimé et javascript prend le relais... à vrais dire c'est valable pour n'importe quel script js, faire marcher sans, quite à ce qu'il y en ait moins et tu viens ajouter js par dessus.
Par exemple moi j'utilise la librairie jquery, avec il est très facil de supprimer les propriétés css d'un élément avant d'ajouter les comportement js.
Modifié par cahnory (05 Nov 2008 - 09:05)
Hummm ... comment dire Smiley murf ?

Voir si ce mode de navigation est pertinent pour un utilisateur final (perso je ne suis pas convaincu préférant la simplicité) ... Ensuite, ton exemple est basé sur une structure HTML inexploitable (pas de hiérarchisation : comment un utilisateur peut-il savoir qu'un item appartient à telle ou telle section surtout que le titre de la dite section se trouve dans le flux à la suite des items quelle contient). Bref, un énorme problème de conception ; d'accessibilité ! Smiley bawling

a écrit :
Qu'en pensez-vous ? Le CSS dynamique est-il voué à l'échec ? Faut-il nécessairement utilisé du JavaScript pour de telles applications ?


Il n'y a pas de combat entre CSS et Javascript ... ils doivent marcher main dans la main (certaines choses se font d'autres pas Smiley cligne ça s'apprend avec l'expérience Smiley smile ).
Bonjour,

L'estimation de 85% est un peu haute. Vu que le principal navigateur incompatible avec cette solution est IE6, et qu'il représente aujourd'hui entre 20 et 25% des utilisateurs en France, on est plutôt autour de 75-80%. Smiley cligne

Ce menu marche à peu près bien tel quel. On peut regretter tout de même l'absence de navigation au clavier. Ceci dit, tu as assuré l'essentiel en faisant de chaque rubrique dans le menu un lien vers une page donnant accès aux pages de la rubrique. Il faudrait faire cela pour tout menu déroulant, qu'il soit basique ou avancé.

Notons tout de même que certains scripts de menu déroulant en JS permettent d'«améliorer» le comportement de menus déroulants full-CSS (utilisant donc largement la pseudo-classe :hover). Je pense notamment à Superfish (jQuery) qui gère la navigation au clavier et un délai avant fermeture des sous-menus (rend le menu plus facilement utilisable).

Sinon, pour le sondage je répond 2 et 3.
Modifié par Florent V. (05 Nov 2008 - 10:32)
a écrit :
yodaswii:
[...]une structure HTML inexploitable (pas de hiérarchisation [...]

En d'autres termes, j'utilise pas d'<ul>/<li>, c'est ça ?
bedhed a écrit :

Comprenez que je cherche ici à créer un topic sur le fond, la méthode, et non pas sur le code à proprement parler.


Il y a peu de sens à parler du fond quand le code traduit une certaine méconnaissance du fond Smiley cligne :
* tu sur-utilises CSS tout en ignorant la structuration HTML, là où CSS a été conçue justement pour permettre une structuration HTML pertinente indépendamment de la présentation
* tu produis un menu non accessible (indépendance au périphérique) là où CSS a également été conçu pour favoriser l'accessibilité
* tu produis un menu non fonctionnel sur au moins un navigateur principal et dans d'autres contextes de navigation sur d'autres navigateurs (désactivation de CSS, etc.) là où CSS a été conçu pour favoriser l'interopérabilité.

Bref, la question est loin d'être Le CSS dynamique est-il voué à l'échec ?. elle serait plutôt Mais au fait, pour quelles bonnes raisons utilisons-nous CSS ? Et où nous arrêtons-nous pour bien l'utiliser ?
Modifié par Laurent Denis (06 Nov 2008 - 06:51)