Ist meine Form zugänglich in einer Tabelle angelegt?

Question

Ich mache ein Formular für die Hochschulen auf den Sportprogramme angeboten und die Aufteilung des Sports basiert zu suchen. Ich habe das Formular aus, in einem Tisch gelegt. Die „alle Bereiche“ Checkbox wählt alle Kontrollkästchen für diesen Sport.

weiß ich, Screenreadern beiden Formulare und Tabellen-Modus. Ist mein aktuelles Design zugänglich oder sollte ich hinzufügen, Etiketten für jedes einzelne Kontrollkästchen und positionieren sie off-Bildschirm für visuelle Nutzer? Dies muss auch mindestens Section 508 Anforderungen gerecht zu werden.

Aktuelle Code für die Tabellen sieht wie folgt aus:

<table>
        <tr><th scope="col" colspan="2">All Divisions</th>
            <th scope="col">Div I</th>
            <th scope="col">Div II</th>
            <th scope="col">Div III</th>
            <th scope="col">Other</th>
        </tr>
        <tr><th scope="row">Baseball</th>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
        </tr>                    
        <tr><th scope="row">Basketball</th>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
            <td><input type="checkbox" /></td>
        </tr>
    </table>

Was ich wissen möchte, ist, ob ein Bildschirmleser Lage ist, die Tabellenüberschriften mit den Kontrollkästchen zugeordnet werden soll.

Answer 1

Es ist zugänglich. Ich coppyed den Code in ein HTML-Dokument und konnte das Kontrollkästchen mit Headern in beiden Firefox 3.0 und Internet Explorer 7 unter Verwendung von Jaws Version 10.0 als Screenreader lesen.

Answer 2

Ich denke, du wirst für jede der Kontrollkästchen einzelnen Etiketten benötigen, aber Sie können Lage sein, die headers Attribut auf den Tabellenzellen den gleichen Effekt zu erreichen.

Answer 3

Ok die "ID" verwenden und "Headers" Attribute in Tabellen (blättern Sie zu Abschnitt nach unten).

<table>
    <tr><th id="all" colspan="2">All Divisions</th>
        <th id="div1">Div I</th>
        <th id="div2">Div II</th>
        <th id="div3">Div III</th>
        <th id="other">Other</th>
    </tr>
    <tr><td id="baseball">Baseball</td>
        <td headers="baseball all"><input type="checkbox" /></td>
        <td headers="baseball div1"><input type="checkbox" /></td>
        <td headers="baseball div2"><input type="checkbox" /></td>
        <td headers="baseball div3"><input type="checkbox" /></td>
        <td headers="baseball other"><input type="checkbox" /></td>
    </tr>                    
</table>