Editions Libertalia > Votre avis sur l'accessibilité

Rerererere !


Bon ayé, après avoir bien ingurgité les règles W3C sur les CSS et le XHTML, je me mets sérieusement à l'accessibilité.

C'est donc sur ce point là, l'ACCESSIBILITé, que je m'en viens demander votre avis sur ce site :

http://editions-libertalia.com

ATTENTION : La critique porte sur les parties "EDITIONS" (tout le premier onglet, avec les differentes fiches livres de la maison d'édition) et "CONTACT" (3eme onglet), PAS SUR "LIBRAIRIE" (2eme onglet), pas donc la partie de commerce en ligne (là même au niveau code c'est une catastrophe que je suis en train de nettoyer, je suis parti sur une personnalisation d'OSCommerce qui est une usine à gaz dégueulasse, donc pour le moment c'est plus que free style au niveau code et propreté, même si à l'ecran ça fonctionne et est clean). Donc forget la partie vente en ligne, et agadez le catalogue (editions) soit la partie basée sur SPIP.

Aussi : à l'heure où je poste ce message, les images de remplacement pour l'animation Flash des fiches livre ne sont pas encore mises mais sont prévus très rapidement (pour le moment, on y voit le message "image de remplacement" ^^)

Pour le reste, ça devrait être bon, après tout ce que j'ai lu ces jours sur le sujet (le choix des accesskeys a été fait suivant certains modeles, mais visiblement c'est le bordel sur un consensus à ce sujet et pas le principal).

Merci d'avance, et soyez sans pitié, j'ai vraiment envie d'être au point sur ce plan.

Modifié par CaptainAmerica (18 Aug 2007 - 01:52)

Bonjour

Globalement, la navigation est simple, difficile de s'y perdre... mais le texte ne supporte pas le grossissement...

Question accessibilité, pour moi, deux choses ressortent :
- la police de ton "menu-liste" est minuscule et très difficile à lire, ainsi que les mots en italique sur tout le site, cette police est très crènelée dans cette taille.

- la navigation sans souris est impossible, on ne voit pas où est le curseur, et il ne se déplace pas de façon ordonnée (de droite à gauche dans le menu )

Bonne suite

Merci pour ton avis !

Comme j'ai retravaillé l'accessibilité ce sjours et que le site était fait depuis un moment, certains problèmes persistent (c'est surtout un essai et pour avoir des billes pour tous les prochains sites à venir). J'avais remarqué pour la police en px (c'est une maladie que j'ai mais que je vais regarder de plus pres, ça doit pas etre incurable !)

Pour le reste j'ai surtout tablé sur une navigation sans JS/images/CSS et donc les navigateurs texte / synthese vocale.

J'ai ouné quouéchtionné suite à tes remarques. C'est p/r à "on ne voit pas où est le curseur". Là c'est un énigme pour moi : y a moyen de rendre ça plus visible que l'encadré en pointillé de base dans les browsers ???

(pour le menu de droite à gauche, c'est que j'ai du taper dans un float rigth dans la mis ene page, je sais plus pourquoi à l'époque (je dirais par méchanceté et à tout hasard IE, c'est fort possible mais peut etre pas).

Encore merki !

EDIT : oui ça va hein ! c'est a:focus pour mon énigme. Bonjour la honte !
Modifié par CaptainAmerica (18 Aug 2007 - 13:00)

CaptainAmerica a écrit :
... J'avais remarqué pour la police en px (c'est une maladie que j'ai mais que je vais regarder de plus près, ça doit pas être incurable !)

Pour le reste j'ai surtout tablé sur une navigation sans JS/images/CSS et donc les navigateurs texte / synthese vocale.

Même une police en px peut-être agrandie via ctrl et +/molette... mais ce sont les blocs CSS qui doivent pouvoir s'adapter... bon courage ...

CaptainAmerica a écrit :
J'ai ouné quouéchtionné suite à tes remarques. C'est p/r à "on ne voit pas où est le curseur". Là c'est un énigme pour moi : y a moyen de rendre ça plus visible que l'encadré en pointillé de base dans les browsers ???

(pour le menu de droite à gauche, c'est que j'ai du taper dans un float rigth dans la mis ene page, je sais plus pourquoi à l'époque (je dirais par méchanceté et à tout hasard IE, c'est fort possible mais peut etre pas).

C'est plus simple que ça, tu as bien ordonné tes liens de droite à gauche :

<div id="header">
<a id="header-[b]contact[/b]" href="http://editionslibertalia.com/spip.php?rubrique7"></a>
<a id="header-[b]librairie[/b]" href="http://editionslibertalia.com/librairie/"></a>
<a id="header-[b]editions[/b]" href="http://editionslibertalia.com"></a></div>

En ajoutant un a:focus au a:hover, le comportement au clavier sera le même qu'à la souris...

a:hover, a:focus { text-decoration: underline; }

<edit>

CaptainAmerica a écrit :
EDIT : oui ça va hein ! c'est a:focus pour mon énigme. Bonjour la honte !

Bien vu </edit>
Modifié par VirtualFred (18 Aug 2007 - 13:10)

VirtualFred a écrit :

Même une police en px peut-être agrandie via ctrl et +/molette... mais ce sont les blocs CSS qui doivent pouvoir s'adapter... bon courage ...

Comme on parlait handicap, je pensais aussi à IE
Avec ctrl + ou cmd + effectivement quelques blocs merdent alors qu'ils pourraient très bien s'adapter (ça va être plus dur pour les titres des fiches, vu que c'est étudié pour rentrer dans la cartouche graphique du fond, je vais bricoler sur ce site là avec un overflow (hum...) et pour les prochains y faire gaffe)

a écrit :
C'est plus simple que ça, tu as bien ordonné tes liens de droite à gauche :

yep, mais c'est pour que ça soit dans l'aordre à l'oeil avec le float right.
si j'ai du temps je reverrai en profondeur ce header passque sans image et en navig claouier ils sont compris mais apparaissent pas.

a écrit :
<edit>
Bien vu </edit>

hé hé ! je suis allé sur ton site en fait, et du coup j'ai appris l'utilité de ce a:focus rigolo que je connassais mais n'avais jamais employé. Danke !

EDIT : ayé, le a:focus est en place.

EDIT2 : mais IE supporte pas la pseudo classe a:focus... grmpf ! bon.
Modifié par CaptainAmerica (18 Aug 2007 - 13:29)

Salut,

a écrit :
<div id="access">
<ul><li><a href="#infos" accesskey="2">Aller au contenu principal</a></li><li><a href="#menu" accesskey="4">Aller &agrave; la liste des livres publi&eacute;s</a></li><li><a href="http://editionslibertalia.com/spip.php?rubrique7" accesskey="9">Contacter les &Eacute;ditions Libertalia</a></li></ul>

<hr />
</div>

C'est bien de le mettre, mais pourquoi ne le voit on pas ? Il n'y a pas que les gens qui naviguent sans CSS qui ont besoin de ce genre d'outils mais aussi ceux qui naviguent au clavier.

Mikachu a écrit :
Salut,
C'est bien de le mettre, mais pourquoi ne le voit on pas ? Il n'y a pas que les gens qui naviguent sans CSS qui ont besoin de ce genre d'outils mais aussi ceux qui naviguent au clavier.

Ben c'est pour que les avuegles puissent voir quelque chose que les voyants ne voient pas, ça rééquilibre !

Plus sérieusement.
J'ai compris cette partie plus adaptée aux synthétiseurs vocaux et lecteurs en braille. Pour tous les autres cas de figure il y a le visuel de la page délimitant clairement les 2 parties (liste des bouquins & contenu/infos) ainsi que la navigation principal en onglets. (et à ce que j'ai vu du petit film trouvé en lien sur les ressources alsa (le gars Pierre) ça permet au navigateur vocal de lire les access keys.
J'ai vu que ce n'était pas nécessaire d'être visible dans l'affichage classique dans la traduction du petit tuto 30days traduit par la-grange.net

Pour les autres qui souhaitent connaitre les access keys ,là je suis en train de faire une page "politique d'accessibilité" qui aura un lien depusi les autres pages. (j'ai vu un peu le débat sur le sujet, c'est aussi en grande partie pour sensibiliser le surfeur lambda sur la question qui est quand même peu connue).

Sauf qu'en navigation clavier pour quelqu'un qui voit, il va devoir faire plein de tabulations pour arriver au contenu, alors qu'une seule suffirait !
D'où l'intérêt de les rendre visibles à tous !

Mikachu a écrit :
Sauf qu'en navigation clavier pour quelqu'un qui voit, il va devoir faire plein de tabulations pour arriver au contenu, alors qu'une seule suffirait !
D'où l'intérêt de les rendre visibles à tous !

C'est pas faux.

^^
Bon là le souci (pour moi, et ça en est un de très important) c'set qu ele design est pa s construit pour cette partie là. Je vais faire au mieux sur un maximum de points (déjà listés et autres à viendre) pour ce site, et mettre les autres infos derrière l'oreille pour les prochains sites (d'ailleurs un à venir sera conçu accessible dès le tout début, je viendrais vous le proposer à la critique pour l'accessibilité pour ouar si j'ai bien retiendu les leçons !)

Encore ! encore !

a écrit :
c'set qu ele design est pa s

Pourrais tu lire et prendre en compte le message que je t'ai envoyé en privé sur la lisibilité de tes messages, notamment dans ce post ?

Merci de ta compréhension

Mikachu a écrit :
c'set qu ele design est pa s

Pourrais tu lire et prendre en compte le message que je t'ai envoyé en privé sur la lisibilité de tes messages, notamment dans ce post ?

Merci de ta compréhension


Ah zut. Les pop up etant bloqués par defaut et pas autorisés sur alsa jusqu'à maintenant j'ai une tonen de PM que je connaissais pas.

Okay, je comprends, je vais faire gaffe pour l'accessibilité et surtout dans les doigts qui s'embrouillent. (ceci dit sur le ton du PM, un peu moins de condescendance ajouterait à de l'accessibilité aussi).

Carnet de bord du capitaine :
J'ai avancé sur la mise en accessibilité du site, j'ai donc au final fait apparaitre à tous le menu de contournement et ai donc fait un lien vers la politique d'accessibilité (qui a surtout un but pédagogique pour les néophytes que sont la majorité des surfeurs).

Mais au niveau des Access Keys, j'ai quelques doutes. Elles ont pas l'air de fonctionner sur mon PC avec windows (j'ai pas essayé avec linux encore) que ce soit avec Firefox ou avec IE6... (Sur Mac, pas de soucis).

EDIT : parmi les travaux encore à faire sur le site, il y a quelques modifications des blocs qui merdoient lors de l'agrandissement du texte.
Modifié par CaptainAmerica (18 Aug 2007 - 16:22)

CaptainAmerica a écrit :
... Mais au niveau des Access Keys, j'ai quelques doutes. Elles ont pas l'air de fonctionner sur mon PC avec windows (j'ai pas essayé avec linux encore) que ce soit avec Firefox ou avec IE6... (Sur Mac, pas de soucis)...

Pour les Accesskeys, il y a une solution miracle : tu les enlèves !
C'est sympa d'y penser, mais apparemment ça pose plus de problème qu'autre chose à ceux qui en ont vraiment besoin (conflits avec les raccourcis clavier du navigateur vocal par exemple).

Je dois pas être doué, mais moi non plus je n'arrive plus à faire fonctionner les Accesskeys depuis Firefox 2 .
<edit>OK : alt+maj+chiffres autres que ceux du pavé numérique </edit>
Modifié par VirtualFred (21 Aug 2007 - 13:40)