[accessibilite-numerique] question concernant l'accessibilité d'un formulaire de questionnaire présenté sous forme de tableau de boutons radio
anne mignonat
amig69 at free.fr
Lun 23 Avr 16:51:47 EDT 2007
Messagesalut,
ton alternative est pas mal aussi mais on peut quand même y arriver dans le tableau.
au départ je mettais tous mes formulaires sans tableau et c'était pas joli et pas non plus pratique pour jaws donc tous mes formulaires sont dans des tableau.
Le label for est importan quand tu dois remplir des champs car si tu oublies de mettre le label tu n'a pas forcément le nom de l'étiquette du formulaire quand tu te trouves en mode remplissage du formulaire mais sinon j'ai regardé le code de la page mon cher et il y avait tout donc pourquoi ne pas rester en mode tableau puisqu'il avait mis les tabindex et les racourci clavier donc on peut soit tabuler de champ en champ ou utiliser la commande F qui permet de se déplacer de champ en champ de formulaire. ----- Original Message
Bonne nuit.
Anne -----
From: Jean-Louis Bataille
To: accessibilite-numerique at list.accessiweb.org
Sent: Monday, April 23, 2007 8:18 PM
Subject: Re: [accessibilite-numerique]question concernant l'accessibilité d'un formulaire de questionnaire présenté sous forme de tableau de boutons radio
Bonjour Hervé,
Pour ma part, je n'utilise la balise <TABLE> que pour restituer un tableau de résultats. Je ne lui ai pas encore trouvé un autre usage.
Dans ton exemple, tu t'en servirais plutôt par commodité, pour la mise en forme de ton formulaire. Le résultat est propre et facilement compréhensible à l'écran.
Je pensais qu'il serait difficilement exploitable avec une synthèse vocale. Mais Anne vient de le tester sans problème avec sa version Jaws 6.2.
Pour améliorer encore son accessibilité, je te conseille quand même de remplacer ton tableau et d'associer un label à chaque bouton radio.
Un truc du genre (pour chaque critère) :
<div>
<span>accessibilité des données</span>
<span>
<label for="r1">
<abbr title="Bonne accessibilité des données">Bonne</abbr>
</label>
<input type="radio" name="REP1QUES7" value="1" tabindex="1" id="r1" />
</span>
<span>
<label for="r2">
<abbr title="Accessibilité des données moyenne">Moyenne</abbr>
</label>
<input type="radio" name="REP1QUES7" value="2" tabindex="2" id="r2" />
</span>
<span>
<label for="r3">
<abbr title="Accessibilité des données médiocre">Médiocre</abbr>
</label>
<input type="radio" name="REP1QUES7" value="3" tabindex="3" id="r3" />
</span>
<span>
<label for="r4">
<abbr title="Sans opinion sur l'accessibilité des données">Sans opinion</abbr>
</label>
<input type="radio" name="REP1QUES7" value="4" tabindex="4" id="r4" />
</span>
</div>
Il existe bien sûr de multiples variantes. C'est juste un exemple.
Il ne reste plus qu'à le mettre en forme à l'aide de feuilles de style.
Cordialement.
Jean-Louis Bataille
http://www.votre-hotel.com
----- Original Message -----
From: CHUZEVILLE Hervé
To: accessibilite-numerique at list.accessiweb.org
Sent: Monday, April 23, 2007 5:45 PM
Subject: [accessibilite-numerique] question concernant l'accessibilité d'un formulaire de questionnaire présenté sous forme de tableau de boutons radio
Bonjour,
Dans le cadre de la mise en oeuvre d'un questionnaire sous forme de formulaire, j'ai 2 erreurs suivantes remontées par Ocawa :
- Balise <table> : Pas de résumé au tableau de données
- Balise <input> : Pas d'association label - zone de saisie (avec l'attribut 'id' défini)
Pour l'erreur résumé du tableau, est-ce vraiment indispensable dans ce cas (voir le code source ci-dessous) ? Je ne vois pas bien ce que cela peut apporter de plus...
Pour le problème de la balise input, je ne vois pas bien comment mettre en oeuvre dans mon cas. Ou est-ce que un title du genre "Bonne accessibilité des données", "Accessibilité des données moyenne", etc. pourrait faire l'affaire (sans que cela résolve directement l'erreur) ?
Avez-vous des exemples de ce type accessibles ?
Voici le code (mon développement en cours est visible à l'adresse : http://www.sierm-dev.eaurmc.fr/enquete/questionnaire-donnees-7.php) :
<form id="question" name="question" method="post" action="questionnaire-donnees-7.php">
<table>
<caption>
Réponse
</caption>
<tr>
<th id="col1">Critères</th>
<th id="col2" class="celTaille15">Bonne</th>
<th id="col3" class="celTaille15">Moyenne</th>
<th id="col4" class="celTaille15">Médiocre</th>
<th id="col5" class="celTaille15">Sans opinion </th>
</tr>
<tr>
<td headers="col1">accessibilité des données</td>
<td headers="col2" class="cel-centre"><input <?php echo $r1; ?> type="radio" name="REP1QUES7" value="1" tabindex="1" id="r1" /></td>
<td headers="col3" class="cel-centre"><input <?php echo $r2; ?> type="radio" name="REP1QUES7" value="2" tabindex="2" id="r2" /></td>
<td headers="col4" class="cel-centre"><input <?php echo $r3; ?> type="radio" name="REP1QUES7" value="3" tabindex="3" id="r3" /></td>
<td headers="col5" class="cel-centre"><input <?php echo $r4; ?> type="radio" name="REP1QUES7" value="4" tabindex="4" id="r4" /></td>
</tr>
<tr>
<td headers="col1">qualité de la documentation des données</td>
<td headers="col2" class="cel-centre"><input <?php echo $s1; ?> type="radio" name="REP2QUES7" value="1" tabindex="5" id="s1" /></td>
<td headers="col3" class="cel-centre"><input <?php echo $s2; ?> type="radio" name="REP2QUES7" value="2" tabindex="6" id="s2" /></td>
<td headers="col4" class="cel-centre"><input <?php echo $s3; ?> type="radio" name="REP2QUES7" value="3" tabindex="7" id="s3" /></td>
<td headers="col5" class="cel-centre"><input <?php echo $s4; ?> type="radio" name="REP2QUES7" value="4" tabindex="8" id="s4" /></td>
</tr>
<tr>
<td headers="col1">qualité des données</td>
<td headers="col2" class="cel-centre"><input <?php echo $t1; ?> type="radio" name="REP3QUES7" value="1" tabindex="9" id="t1" /></td>
<td headers="col3" class="cel-centre"><input <?php echo $t2; ?> type="radio" name="REP3QUES7" value="2" tabindex="10" id="t2" /></td>
<td headers="col4" class="cel-centre"><input <?php echo $t3; ?> type="radio" name="REP3QUES7" value="3" tabindex="11" id="t3" /></td>
<td headers="col5" class="cel-centre"><input <?php echo $t4; ?> type="radio" name="REP3QUES7" value="4" tabindex="12" id="t4" /></td>
</tr>
</table>
<label for="u">C<span class="accesskey">o</span>mmentaires : </label><br />
<textarea name="REP4QUES7" accesskey="o" tabindex="13" id="u" cols="70" rows="4" onkeypress="javascript:compter(question);"><?php if ($u != "") { echo $u; } else { echo ""; } ?></textarea><br />
<label for="v">Nombre de caractères restants : </label><input type="text" name="nb1car" id="v" size="1" value="250" />
<br />
<br />
<div class="droite">
<input type="submit" name="urlSuivante" value="Question suivante >" title="valider et passer à la question suivante (accès clavier : touche v)" accesskey="v" tabindex="14" id="suivante" />
</div>
<div class="gauche">
<input type="submit" name="urlSuivante" value="< Question précédente" title="retourner à la question précédente (accès clavier : touche n)" accesskey="n" tabindex="15" id="precedente" />
</div>
<input type="hidden" name="question7" value="1" />
</form>
Merci d'avance pour votre aide.
Cordialement,
Hervé CHUZEVILLE, webmestre - Unité des Systèmes d'Information
Agence de l'Eau Rhône Méditerranée & Corse - 2-4 allée de Lodz - 69363 Lyon Cedex 07 - Plan d'accès
Tél direct : 04 72 71 27 17 - Fax : 04 72 71 26 04 - Mél : herve . chuzeville @ eaurmc . fr
Sites Web : www.eaurmc.fr - http://sierm.eaurmc.fr - www.corse.eaufrance.fr - www.touspourleau.fr - Intranet : http://rmcnet
----------------------------------------------------------------------------
_______________________________________________
accessibilite-numerique mailing list
accessibilite-numerique at list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/accessibilite-numerique_list.accessiweb.org
----------------------------------------------------------------------------
No virus found in this incoming message.
Checked by AVG Free Edition.
Version: 7.5.463 / Virus Database: 269.5.9/773 - Release Date: 22/04/2007 20:18
------------------------------------------------------------------------------
_______________________________________________
accessibilite-numerique mailing list
accessibilite-numerique at list.accessiweb.org
http://list.accessiweb.org/mailman/listinfo/accessibilite-numerique_list.accessiweb.org
-------------- section suivante --------------
Une pièce jointe HTML a été nettoyée...
URL: http://list.accessiweb.org/pipermail/accessibilite-numerique_list.accessiweb.org/attachments/20070423/62062a24/attachment-0001.html
Plus d'informations sur la liste de diffusion accessibilite-numerique