[resolu] Supprimer le cadre du focus sur un lien

Auteur	Pages : [<]
knarf	# 13 Feb 2006 - 11:41:18
1085 Posts	(reprise du message précédent) Salut c'est l'extra-terrestre Je me permet un ch'ti up car le message est en résolu et j'aimerais avoir un peu plus d'avis. Je suis le seul à vouloir différencier nettement ce focus par rapport au hover?
1085 Posts
Monique	# 13 Feb 2006 - 15:08:33
628 Posts	Bonjour, Je viens de naviguer au clavier ici, sur Openweb et sur Web-pour-tous. Une certitude : pour que la navigation au clavier soit un tant soit peu confortable, un renforcement de l'apparence au focus est indispensable. Le pointillé par défaut est souvent très difficile à repérer, voir impossible (sur une image, par exemple, ou quand il se trouve hors de l'espace affiché). Par contre je ne suis pas convaincue de l'intérêt d'une apparence différente pour le hover... d'autant plus que mes essais ne m'ont pas permis d'en rencontrer un exemple en campagne pour des sites de qualité, conformes et accessibles... et contre les menus déroulants
628 Posts
Monique	# 13 Feb 2006 - 15:15:01
628 Posts	Monique a écrit : Bonjour, Je viens de naviguer au clavier ici, sur Openweb et sur Web-pour-tous. Une certitude : pour que la navigation au clavier soit un tant soit peu confortable, un renforcement de l'apparence au focus est indispensable. Le pointillé par défaut est souvent très difficile à repérer, voir impossible (sur une image, par exemple, ou quand il se trouve hors de l'espace affiché). Par contre je ne suis pas convaincue de l'intérêt d'une apparence différente pour le hover... d'autant plus que mes essais ne m'ont pas permis d'en rencontrer un exemple Edit : tiens justement ici... l'image de la flèche "retour vers le haut" a disparu, mais le focus disparaît de ma vue en se plaçant dessus Oups... je suis toujours en mode clavier... j'ai voulu éditer mon message et j'ai répondu... dur, dur Modifié par Monique (13 Feb 2006 - 15:17) en campagne pour des sites de qualité, conformes et accessibles... et contre les menus déroulants
628 Posts
Arsene	# 14 Feb 2006 - 09:59:26
1205 Posts	a écrit : Une certitude : pour que la navigation au clavier soit un tant soit peu confortable, un renforcement de l'apparence au focus est indispensable. Le pointillé par défaut est souvent très difficile à repérer, voir impossible (sur une image, par exemple, ou quand il se trouve hors de l'espace affiché). Pour les navigateurs sensibles à la nav par tabulation il existe de nombreuses possibilités pour accroître la visibilité du lien en jouant sur le DOM, par exemple this.style.border="2px solid blue" this.style.backgroundColor="rgb(200,150,50)" this.style.backgroundPosition="0 -20px" (pour les images survolées...) etc. Si l'avantage du :focus par tabindex est évident, il a quelques inconvénients assez importants : d'abord il ne marche pas partout ni toujours donc il ne faut pas compter dessus comme un outil 100% fiable, ensuite si on l'applique il faut l'appliquer PARTOUT (sinon on perd le fil très vite) y compris sur les images, enfin il faut le construire correctement et ça c'est plus compliqué. Il y a au moins deux problèmes : la valeur et l'ordre. La valeur (tabindex="1"... "2"... etc) doit être largement calculée pour faire face à toutes les situations qu'on peut rencontrer, par exemple une page "imprévue" avec exceptionnellement 50 liens... On doit donc "réserver" des valeurs inutilisées pour ces cas-là, par exemple affecter des valeurs de 1 à 99 pour les menus principaux, de 100 à 199 pour les menus secondaires ou contextuels, de 200 à 299 pour le contenu de la page en cours, etc... L'autre problème, plus compliqué, c'est celui de l'ordre d'apparition. Que doit-on suivre ? - l'ordre "graphique" = :focus suit l'ordre de lecture à l'écran (par exemple 1/ liens d'évitement, 2/ menu principal, 3/ menu contextuel, 4/ fil d'ariane, 5/contenu de la page en cours, 6/ liens de pied de page)... - l'ordre "navigationnel" = :focus détaille d'abord la hiérarchie des menus puis passe au contenu de la page (1/ évitement, 2/ menus divers, 3/ pied de page, 4/ contenu de la page)... ce qui fait sauter le focus d'un coin à l'autre de l'écran. - l'ordre "naturel" du flux = :focus attaque par la premère ligne et finit par la dernière... en théorie flux et design devraient être organisés de façon similaire mais c'est pas toujours le cas. En résumé et en attendant des avis éclairés sur la question, il me semble que tabindex est effectivement un "plus", mais aussi un "plus" de boulot Je l'utilise dans certains cas et pour des raisons particulières mais finalement assez rarement et surtout sans en maîtriser toutes les subtilités évoquées plus haut. Un Alsanaute compétent pourra sûrement nous en dire plus ?
1205 Posts
Arsene	# 14 Feb 2006 - 10:17:01
1205 Posts	Quentin pas d'accord avec les tabindex !
1205 Posts
blue	# 25 Feb 2006 - 13:44:36
421 Posts	Laurent Denis a écrit : Bonjour, La partie importante des choses : ne pas supprimer l'effet d'outline. Au mieux, appliquer le même style sur le focus et sur le hover. Au minimum, appliquer un effet supplémentaire au focus. Au pire, ne rien faire. Bonjour, Qu'entends tu par effet outline stp Laurent Denis ?
421 Posts
Felipe	# 27 Feb 2006 - 23:40:18
Administrateur 6632 Posts	bonjour, il s'agit, je crois, du cadre de style dotted qui entoure un lien lorsqu'on navigue de lien en lien à l'aide de la touche Tabulation du clavier comme ici: La touche Tab pour ceux qui connaissent pas (il y en a)
Administrateur 6632 Posts
Christian Le Bouler	# 28 Feb 2006 - 11:56:10
3109 Posts	Monique a écrit : apparence différente pour le hover... d'autant plus que mes essais ne m'ont pas permis d'en rencontrer un exemple Oh ! ... Monique ... ... Quand même ! ...
3109 Posts
Laurent Denis	# 28 Feb 2006 - 12:49:31
7979 Posts	clb56 a écrit : ... Quand même ! ... Gasp ! je ne suis pas tout à fait sûr que ce soit une idée à retenir, et en tous cas la forme sous laquelle je l'ai fait très rapidement est à revoir (la mise en place n'est pas complète, déjà). Ce n'est donc pas un exemple à retenir. En revanche, si la chose vous intéresse, vos avis sur cet essai bricolé sont les bienvenus. On pourrait en sortir quelque-chose Modifié par Laurent Denis (28 Feb 2006 - 12:50) Ne parlons pas de choses nouvelles. Commencez par ne pas détourner CSS de son objet, ce que vous faites immanquablement avec des techniques sexy qu'on enseigne ici.
7979 Posts
Christian Le Bouler	# 28 Feb 2006 - 13:02:51
3109 Posts	Pour ma part j'ai tendance à travailler les effets de survol de telle manière qu'il renforce le lien concerné. C'est d'ailleurs ce qui m'amène à faire a:hover = a:focus. Dans ton cas le survol adouci parfois le rendu visuel du lien (je pense notamment à plan du site, navigation) et dans ce cas on se retrouve dans une situation un peu analogue à celle décrite par Monique concernant le outline éventuellement peu repérable au clavier. donc le choix d'un a:focus spécifique devient très utile. Modifié par clb56 (28 Feb 2006 - 13:04)
3109 Posts
Pages : [<]