Lecture à l'écran : qui croire ?

Bonjour,

Question délicate à vrai dire.

C'est un des problèmes souvent rencontré. Jusqu'à quel niveau doit-on essayer de répondre aux problématiques du handicap pour éviter ce genre de situation où en voulant résoudre un problème d'accès on en créé un nouveau pour une autre catégorie de la population ?

Je dirais qu'il est préférable, comme Sébastien, d'opter pour un niveau de contraste "significatif" qui ne soit pas maximal. Un contraste trop faible va léser les personnes malvoyantes et celles dont l'écran ne permettra pas d'assurer une distinction suffisante des couleurs. Un contraste maximal sera une difficulté supplémentaire pour les dyslexiques visuels.

Il faut aussi se dire qu'il est impossible de répondre favorablement à tous les handicaps rencontrés.

Après c'est aussi le rôle d'applicatifs comme les navigateurs ou les systèmes d'exploitation ou de matériels de proposer des outils facilement accessibles pour que l'utilisateur puisse personnaliser des réglages comme ceux des contrastes sur un écran.

(Attention de ne pas tomber dans le piège du "c'est pas ma faute si le site n'est pas accessible c'est pas mon boulot", chacun à bien sûr sa part de responsabilité et son niveau d'implication dans l'accessibilité).
Modifié par Sebastien D. (06 Dec 2007 - 10:54)

Globalement, mon problème est aussi de savoir utiliser le contraste à bon escient. Voici une maquette de la page que je suis en train de monter (certains l'ont déjà vu) : http://egypte.webou.net/test/squelette.html
A gauche, il me semble que le contraste est équilibré et répond aux deux problématiques (mis à part le "égypte - la terre" en tête de doc, mais ça n'est pas une info capitale).
Par contre, en essayant de garder les mêmes "identifiants graphiques" (apparences des liens, des textes), je souhaite que le reste de la page soit "moins contrasté", pour ne pas gêner la lecture. Le contraste de cette colonne de droite et du footer est-elle -à votre avis- insuffisant ?

Sebastien D. a écrit :
Sans chercher à valider ou non les contrastes j'ai personnellement beaucoup de difficultés à lire ce site. Le texte est minuscule

C'est clair, du texte Arial en 10px et 11px, faut vraiment s'accrocher... ou être en 800x600 sur un écran 17 pouces au moins.

Sebastien D. a écrit :
je me suis senti obligé de faire un zoom pour pouvoir lire plus agréablement (ce qui a d'ailleurs décalé le menu de droite tout en bas de page ).

Même réflexe et même conséquence.
Solution pour éviter que le menu (qui est placé à droite mais s'appelle div#left, faut pas chercher à comprendre ) ne passe à la ligne: mettre un clear: both sur div#middle.

Pour les contrastes: ils me semblent un peu faiblards ici. Le gris #989898 sur fond blanc et le gris #7F7F7F sur fond rosé (#F3F1E9), je le sens moyen.

Il y a une différence entre éviter les contrastes maximaux et tout passer en 60/100 de luminosité...

Voila ! J'ai corrigé selon vos recommendations. J'ai aussi passé le menu du haut en blanc. Ca donne plus de caractère et de style, et de lisibilité je trouve ! :
http://egypte.webou.net/test/squelette.html

(J'ai aussi corrigé quelques bugs de chez M. Safari...)
Merci à tous les deux !

Encore merci à tous pour le coup de pouce. Je suis en train de faire les corrections, mais des choses m'échappent... Voici mon vloc recherche auquel j'essaie d'appliquer le tag label :

<li id="searchspace">  
              <form id="search" action="" method="post" style="padding:0; margin:0;">
                <label for="search_box" accesskey="r">rechercher :</label>
                  <input type="text" accesskey="4" tabindex="4" maxlength="60" id="search_box" title="Rechercher" />
                  <a href="valider" title="" id="ok">ok</a>
              </form>
</li>

Le validateur me fait savoir que le tag doit être contenu dans un autre élément, et quand je l'ajoute, il ne veut toujours pas valider. Avez-vous une idée de comment corriger ce code ?

montoumes a écrit :

Le validateur me fait savoir que le tag doit être contenu dans un autre élément

L'élément form n'accepte que des enfants directs de type block. Si tu as un groupe de champs de même nature, les englober d'un fieldset peut être cohérent (à voir selon le contexte), sinon, un simple paragraphe (p) fera très bien l'affaire.

Ca avance, ça avance
Après de longues heures passées à apporter les correctifs selon vos suggestions, j'ai corrigé les tailles de polices et les couleurs, ainsi que quelques petits détails graphiques :
http://egypte.webou.net/test/squelette.html

Hélas, il me reste des soucis :
- sous Safari, le texte de la colonne de droite ne veut pas se proportionné comme il faut par rapport à la police du corps, contrairement à Firefox. L'article proposé par Florent est fort instructif, mais il me manque surement des bases pour bien comprendre ce qui cloche...
- si je ne m'abuse, il semble que "ça casse" sous IE. Quelqu'un peut m'aider la dessus ? Je n'ai pas de Windows avec IE...

Merci d'avance