28112 sujets
CSS et mise en forme, CSS3
dominique a écrit :
Ben ! en fait, il ne présente aucun intérêt pour les personnes qui utilisent un navigateur graphique, c'est même, je trouve, encombrant.
Lao-Tseu n'a-t-il pas dit: Tu ne préjugeras pas des préférences utilisateurs à partir de ta seule expérience de webmestre ?
D'autre part, il me semble qu'il y a comme un problème de conception de ce menu à régler avant tout:
- Pourquoi deux liens Accessibilité ? Pourquoi pas un seul lien bien visible en tête de menu et de page ?
- Pourquoi un lien vers le formulaire de recherche si proche ? Pourquoi pas tout simplement le formulaire lui-même après le lien Accessibilité ?
- Pourquoi rejetter le plan de site si loin dans la liste, alors que c'est un lien essentiel pour l'accessibilité ?
Je verrais plutôt quelque-chose comme:
- Accessibilité
- Formulaire de recherche
- Plan du site
- Passer la navigation
- Accueil
- Le taoïsme
- Les maîtres
- Les écrits
- Bibliothèque
- Infos site
- Echanges
- Annonces
- Liens
Modifié le 15 Dec 2004 - 17:02
hihi ! faudra que je pense à ajouter cette citation sur la page consacrée à Lao Tseu 
Alors, oui et non parce qu'en fait, il ne faut pas oublier le graphique qui va s'afficher en haut de la page et qui est limité en hauteur. Je n'ai pas encore recu les graphismes du site, mais en avant première ... la maquette est ici : http://www.chroniques-taoistes.com/site/maquette/test.png ... Il faut donc l'imaginer tout en haut, au bord de la fenêtre du navigateur avec le "taïchi" en haut à droite coupé volontairement.
Donc, ce que je pense réalisable en reprenant ta proposition :
- Accessibilité
- Lien vers le formulaire de recherche
- Plan du site
- Passer la navigation
- Accueil
- Le taoïsme
- Les maîtres
- Les écrits
- Bibliothèque
- Infos site
- Echanges
- Annonces
- Liens
Avec toutefois une réserve, que cet ensemble de liens ne dépassent pas la hauteur du graphique. Hors sur Internet Explorer, je n'arrive pas à rapprocher plus les liens. En d'autres termes, sur Mozilla, la hauteur du sommaire est raisonnable alors que le même sommaire sur IE prend beaucoup plus de place.
D'où l'intéret aussi pour moi de limiter ce sommaire.
Mais on avance et j'apprécie beaucoup toutes vos interventions et suggestions merci encore !
Alors, oui et non parce qu'en fait, il ne faut pas oublier le graphique qui va s'afficher en haut de la page et qui est limité en hauteur. Je n'ai pas encore recu les graphismes du site, mais en avant première
... la maquette est ici : http://www.chroniques-taoistes.com/site/maquette/test.png ... Il faut donc l'imaginer tout en haut, au bord de la fenêtre du navigateur avec le "taïchi" en haut à droite coupé volontairement.
Donc, ce que je pense réalisable en reprenant ta proposition :
- Accessibilité
- Lien vers le formulaire de recherche
- Plan du site
- Passer la navigation
- Accueil
- Le taoïsme
- Les maîtres
- Les écrits
- Bibliothèque
- Infos site
- Echanges
- Annonces
- Liens
Avec toutefois une réserve, que cet ensemble de liens ne dépassent pas la hauteur du graphique. Hors sur Internet Explorer, je n'arrive pas à rapprocher plus les liens. En d'autres termes, sur Mozilla, la hauteur du sommaire est raisonnable alors que le même sommaire sur IE prend beaucoup plus de place.
D'où l'intéret aussi pour moi de limiter ce sommaire.
Mais on avance et j'apprécie beaucoup toutes vos interventions et suggestions
merci encore !Lao-Tseu a aussi dit "Le sage ne prend pas son menu de navigation pour une carte exhaustive du site, et tient la brièveté en haute estime." (Si, si, il l'a dit. Tel que.)
Donc le souci de limiter la longueur du menu de navigation est excellent : pour une fois qu'on ne parle pas de menu coulissant dans ce forum, c'est un vrai bonheur
Mais rien n'empêche ici de conserver la disposition en deux parties visuelles (et en deux listes successives):
- le menu "normal" (2e série d'items) placé comme dans la maquette,
- les 3 liens du menu d'accessibilité (la 1ère série) à l'horizontal avec un display: inline sur les <li>, au dessus de la coupure supérieure du taïchi, volontairement "hors page".
- l'item formulaire de recherche de ce menu d'accessibilité extrait de ce display, positionné en absolu comme dans la maquette...
Donc le souci de limiter la longueur du menu de navigation est excellent : pour une fois qu'on ne parle pas de menu coulissant dans ce forum, c'est un vrai bonheur
Mais rien n'empêche ici de conserver la disposition en deux parties visuelles (et en deux listes successives):
- le menu "normal" (2e série d'items) placé comme dans la maquette,
- les 3 liens du menu d'accessibilité (la 1ère série) à l'horizontal avec un display: inline sur les <li>, au dessus de la coupure supérieure du taïchi, volontairement "hors page".
- l'item formulaire de recherche de ce menu d'accessibilité extrait de ce display, positionné en absolu comme dans la maquette...
Laurent Denis a écrit :
Lao-Tseu a aussi dit "Le sage ne prend pas son menu de navigation pour une carte exhaustive du site, et tient la brièveté en haute estime." (Si, si, il l'a dit. Tel que.)
Mouais ! tu peux citer tes sources là ???
Laurent Denis a écrit :
Donc le souci de limiter la longueur du menu de navigation est excellent : pour une fois qu'on ne parle pas de menu coulissant dans ce forum, c'est un vrai bonheur
J'approuve à 100% là, quand j'arrive sur une page et que je vois une floppée (voir plusieurs) de liens, il m'arrive parfois d'abandonner ma quète.
De plus, je me permet de rappeler à ceusses qui les auraient oubliées quelques petites recommandations :
- L'intitulé des liens doit faire un maximum de 80 caractères. (niveau Bronze)
- Dans l'arborescence du site, il doit y avoir un maximum de 9 catégories par niveau de navigation. (niveau Or)
- il doit y avoir un maximum de 40 liens actifs dans la page, hors liens nécessaires à la navigation. (niveau Or)
Laurent Denis a écrit :
Mais rien n'empêche ici de conserver la disposition en deux parties visuelles (et en deux listes successives):
- le menu "normal" (2e série d'items) placé comme dans la maquette,
- les 3 liens du menu d'accessibilité (la 1ère série) à l'horizontal avec un display: inline sur les <li>, au dessus de la coupure supérieure du taïchi, volontairement "hors page".
- l'item formulaire de recherche de ce menu d'accessibilité extrait de ce display, positionné en absolu comme dans la maquette...
Cette suggestion est à tester en ligne, mais ne me pose pas de problème particulier à priori, sauf pour le formulaire, je ne comprend pas bien la proposition.
Actuellement, le formulaire, dans le flux html, est juste après le sommaire du site, en float.
Une précision me semble nécessaire, autant pour moi que pour les lecteurs de cet échange qui semble intéresser pas mal de personnes.
A l'origine du sujet, l'utilisation de "display none" pour cacher le titre du site en texte, balise "h1" et pour cacher le menu que je destinais exclusivement aux personnes non-voyantes. Remplacé par l'attribut "clip" pour le titre, cet attribut ne pouvant pas convenir pour les liens.
Mais j'ai bien compris que d'autres visiteurs pouvaient apprécier ces quelques liens.
Dans plusieurs échanges, j'ai lu qu'un navigateur texte interprétait ce display none dans la feuille de styles css et de ce fait cachait ces éléments.
- Ce navigateur est-il là en non-respect des recommandations ou est-ce une situation normale ?
- S'agit-il d'un seul navigateur ?
- Quel est son nom ?
- Sait-on combien d'internautes l'utilisent ?
Le but de ces questions, vous l'aurez deviné, est de déterminer si nous sommes toujours, ici, dans le contexte des recommandations ou si nous palions à une défaillance d'un éditeur de softs ? Cette dernière hypothèse, si elle s'avérait être la bonne, serait inquiètante pour l'avenir. Imaginez qu'il faille reprendre nos page à chaque défaillance d'une nouvelle version d'un navigateur !!!!
Merci d'avance pour tout complément d'information permettant de mieux avancer encore
Modifié le 16 Dec 2004 - 12:53
Je suppose que "navigateur texte" est un laspsus et que tu voulais dire "lecteur d'écran" ? (Un navigateur texte ignore totalement les CSS).
Auquel cas, il faut bien saisir le rôle d'un lecteur d'écran:
- il ne traite pas directement la source HTML+CSS, mais dépend du navigateur graphique auquel il est associé (Autrement dit IE : les lecteurs d'écran actuels (Jaws en particulier) ont été conçu pour le navigateur dominant sur le marché). Il est donc logique qu'il tienne compte d'un display:none "visuel".
- les lecteurs d'écrans généralement utilisés (Jaws, IBM HPR, Windows Eyes) n'implémentent pas les CSS "aural" ou "speech". Il n'est donc pas possible d'utiliser le code suivant:
- leurs implémentations HTML/CSS sont par ailleurs défectueuses (Voir http://css-discuss.incutio.com/?page=ScreenreaderVisibility )
Donc:
- Respectent-ils les normes en appliquant le display:none ? Oui, puisque leur rôle est de lire ce qui est affiché par ailleurs sur l'écran d'un navigateur graphique. Ce ne sont pas de véritable navigateurs vocaux.
- Respectent-ils les normes en ne permettant pas de rétablir un display:block dans une CSS "aural" ou "speech" ? Oui encore, puisque ce ne sont pas des navigateurs purement vocaux...
Auquel cas, il faut bien saisir le rôle d'un lecteur d'écran:
- il ne traite pas directement la source HTML+CSS, mais dépend du navigateur graphique auquel il est associé (Autrement dit IE : les lecteurs d'écran actuels (Jaws en particulier) ont été conçu pour le navigateur dominant sur le marché). Il est donc logique qu'il tienne compte d'un display:none "visuel".
- les lecteurs d'écrans généralement utilisés (Jaws, IBM HPR, Windows Eyes) n'implémentent pas les CSS "aural" ou "speech". Il n'est donc pas possible d'utiliser le code suivant:
@media screeen, print, projection, tv {
p.only_speech {display: none;}
}
@media speech, @media aural {
p.only_speech {display: block;}
}- leurs implémentations HTML/CSS sont par ailleurs défectueuses (Voir http://css-discuss.incutio.com/?page=ScreenreaderVisibility )
Donc:
- Respectent-ils les normes en appliquant le display:none ? Oui, puisque leur rôle est de lire ce qui est affiché par ailleurs sur l'écran d'un navigateur graphique. Ce ne sont pas de véritable navigateurs vocaux.
- Respectent-ils les normes en ne permettant pas de rétablir un display:block dans une CSS "aural" ou "speech" ? Oui encore, puisque ce ne sont pas des navigateurs purement vocaux...
Bonjour à toutes et tous
Non Laurent Denis, ce n'était pas un lapsus, mais une incompréhension complète de ma part ou une mauvaise interprétation de ce que j'avais lu dans d'autres échanges, ce qui explique mon message précédent. Donc, merci pour cette explication simple et claire qui me replace biendans le contexte.
Donc voici ce que ça donne, je n'ai modifié pour l'instant que la page d'accueil
http://www.chroniques-taoistes.com/site/
Pour l'instant, j'ai du mal à imaginer ce que ça donnera une fois les graphismes mis en place et je vais demander aussi son avis à la personne qui s'occupe des graphismes et de l'harmonie du site graphique.
A première vu, autant ça se place bien sur Firefox et Opéra, autant IE se distingue encore
... Mais bon 
... voir ma signature
En tout cas merci à tous les participants pour cet échange très enrichissant ... Je vous tiens informé des suites...
Non Laurent Denis, ce n'était pas un lapsus, mais une incompréhension complète de ma part ou une mauvaise interprétation de ce que j'avais lu dans d'autres échanges, ce qui explique mon message précédent. Donc, merci pour cette explication simple et claire qui me replace biendans le contexte.
Donc voici ce que ça donne, je n'ai modifié pour l'instant que la page d'accueil
http://www.chroniques-taoistes.com/site/
Pour l'instant, j'ai du mal à imaginer ce que ça donnera une fois les graphismes mis en place et je vais demander aussi son avis à la personne qui s'occupe des graphismes et de l'harmonie du site graphique.
A première vu, autant ça se place bien sur Firefox et Opéra, autant IE se distingue encore
... Mais bon ... voir ma signature En tout cas merci à tous les participants pour cet échange très enrichissant
... Je vous tiens informé des suites...