Este formulario es accesible? doble A

[Elyas]

Me piden doble A y tengo en la web un formulario un tanto complejo. En xhtml y test TAW doble A, me da como correcto pero me gustaría estar totalmente seguro si esto que tengo aquí está correcto, porque no quiero que me pongan ninguna pega.

Podríais decirme si hay algún fallo que deba cambiar?

Código HTML:

<table width="100%" cellspacing="0" cellpadding="0" border="0" class="anchuraFull">
    <tbody><tr>
        <th class="anchura1cuarta">Urtea</th>
        <th class="anchura1cuarta">Egoera</th>
        <th class="anchura1cuarta">Eremua</th>
        <th class="anchura1cuarta">Jarduera</th>
    </tr>
    <tr>
        <td>
            <label for="anio" class="hidden">Urtea</label>
            <select multiple="multiple" id="anio" name="anio[]" size="7" class="sinMargenn">
                            <option value="2006">2006</option>
                            <option value="2007">2007</option>
                            <option value="2008">2008</option>
                            <option value="2009">2009</option>
                            <option value="2010">2010</option>
                        </select>
        </td>
        <td>
            <label for="estado" class="hidden">Egoera</label>
            <select multiple="multiple" id="estado" name="estado[]" size="7" class="sinMargenn">
                            <option value="41">Egikaritzen</option>
                            <option value="43">Amaituta</option>
                        </select>
        </td>
        <td>
            <label for="ambito" class="hidden">Eremua</label>
            <select multiple="multiple" id="ambito" name="ambito[]" size="7" class="sinMargenn">
                            <option value="54">Eskualdekoa</option>
                            <option value="55">Nazionala</option>
                            <option value="56">Nazioartekoa</option>
                        </select>
        </td>
        <td>
            <label for="actividad" class="hidden">Jarduera</label>
            <select multiple="multiple" id="actividad2" name="actividad[]" size="7" class="sinMargenn">
                            <option value="1">Mugikortasun</option>
                            <option value="2">Logistika</option>
                            <option value="3">ITS</option>
                        </select>
        </td>       
    </tr>
    </tbody></table>
 

[Tecna]

Buenas,

yo diría que el principal fallo es que no incluyes la etiqueta <form> con su action, ni el botón tipo submit con lo que el formulario no es accesible porque no se podría enviar sin necesidad de otra tecnología como ajax y estás incumpliendo otro punto de las pautas de accesibilidad. Tampoco deberías usar tablas que son para tabular datos, usa las etiquetas propias de los formularios como <fieldset> y <legend> para estructurar los bloques del contenido del formulario. El atributo for de la etiqueta label se asocia al id del elemento al que hace referencia y en el tercer select no coinciden

[Elyas]

Con las prisas, se me fue y no pegue lo del form. Pero sí que lo tengo. La web en realidad no es mía por lo que se me antoja bastante más complicado realizar un tratamiento a códigos que no son míos.

Te pongo esta vez, otro formulario, creo que esta vez sí que lo tengo mejor estructurado.

Código HTML:

<form id="themesearch" method="get" action="#">
        <table cellspacing="0" cellpadding="0" border="0" class="anchuraFull">
    <tbody><tr>
        <th class="anchura1cuarta">Actividad</th>
        <th class="anchura1cuarta">Área</th>
        <th class="anchuraMitad">Sector</th>
    </tr>
    <tr>
        <td>
            <label for="actividad_" class="hidden">Actividad</label>
            <select multiple="multiple" id="actividad_" name="actividad[]" size="7" class="sinMargenn">
                            <option value="1">Movilidad</option>
                            <option value="2">Logística</option>
                            <option value="3">ITS</option>
                        </select>
        </td>
        <td>
            <label for="area_" class="hidden">Área</label>
            <select multiple="multiple" id="area_" name="area[]" size="7" class="sinMargenn">
                        <option value="7">Cargadores</option>
                        <option value="4">Infraestructuras</option>
                        <option value="6">Operadores</option>
                        <option value="8">Productos y Servicios</option>
                        <option value="5">Administración y otros</option>
                        </select>
        </td>
        <td class="modoS"><table cellspacing="0" class="modo2S">
            <tbody><tr><td class="anchuraMitad">
            <span class="negrita">Modo</span><br>
            <label for="modo_" class="hidden">Modo</label>
            <select multiple="multiple" id="modo_" name="modo[]" size="5" class="sinMargenn">
                        <option value="10">Carretera</option>
                        <option value="11">Ferroviario</option>
                        <option value="12">Aereo</option>
                        <option value="13">Maritimo</option>
                        <option value="14">Intermodal</option>
                        </select>
            </td>
            <td class="anchuraMitad">
            <span class="negrita">Logística y SCM</span><br>
            <label for="sector_" class="hidden">Sector</label>
            <select multiple="multiple" id="sector_" name="sector[]" size="5" class="sinMargenn">
                        <option value="15">Aprovisionamiento</option>
                        <option value="16">Fabricación</option>
                        <option value="17">Distribución</option>
                        <option value="18">Logística inversa</option>
                        <option value="19">Gestión SCM</option>
                        </select>
            </td></tr>
        </tbody></table></td>
    </tr>
    </tbody></table>
    <button value="Buscar" class="search flotaDrcha" type="submit">
        <img alt="Buscar" src="http://www........................una...url..................arch.png">
    </button>
    <input type="button" value="limpiar" onclick="$('themesearch').getElements().each(function(i) {if (i.selectedIndex!=undefined) i.selectedIndex=-1})" class="clearbutton flotaDrcha">
    </form>
 

Así a ojo, creo que lo del for ya lo he corregido.

Supongo que ahora mí único fallo se encuentra en usar las tablas, no? el tema es que se me antoja un tanto complicado tener que maquetar ahora todo solamente con fieldset y legend. Lo véis posible? Es obligatorio, la doble A lo pide, usar fieldset y legend en vez de tablas?

Muchas gracias de antelación.
Estoy viendo que no parece tan dificil maquetarlo.

[Elyas]

¿Así está mejor?

Código HTML:

<form id="themesearch" method="get" action="#">
            
 
        <fieldset class="fieldActividad">
            <legend>Actividad</legend>
            <label for="actividad_" class="hidden">Actividad</label>
            <select multiple="multiple" id="actividad_" name="actividad[]" size="7" class="sinMargenn">
                            <option value="1">Movilidad</option>
                            <option value="2">Logística</option>
                            <option value="3">ITS</option>
                        </select>
        </fieldset>
            
        <fieldset class="fieldArea">
            <legend>Área</legend>
            <label for="area_" class="hidden">Área</label>
            <select multiple="multiple" id="area_" name="area[]" size="7" class="sinMargenn">
                        <option value="7">Cargadores</option>
                        <option value="4">Infraestructuras</option>
                        <option value="6">Operadores</option>
                        <option value="8">Productos y Servicios</option>
                        <option value="5">Administración y otros</option>
                        </select>
        </fieldset>
        <fieldset class="fieldSectorYLog">
            <legend>Sector</legend>
            <fieldset class="fieldSector">
                <legend>Modo</legend>
                <label for="modo_" class="hidden">Modo</label>
                <select multiple="multiple" id="modo_" name="modo[]" size="5" class="sinMargenn modoCaja">
                                <option value="10">Carretera</option>
                                <option value="11">Ferroviario</option>
                                <option value="12">Aereo</option>
                                <option value="13">Maritimo</option>
                                <option value="14">Intermodal</option>
                                </select>
            </fieldset>
 
            
            <fieldset class="fieldLogistica">
                <legend>Logística y SCM</legend>
            <label for="sector_" class="hidden">Sector</label>
            <select multiple="multiple" id="sector_" name="sector[]" size="5" class="sinMargenn sectorCaja">
                        <option value="15">Aprovisionamiento</option>
                        <option value="16">Fabricación</option>
                        <option value="17">Distribución</option>
                        <option value="18">Logística inversa</option>
                        <option value="19">Gestión SCM</option>
                        </select>
            </fieldset>
        </fieldset>
 
    <button value="Buscar" class="search flotaDrcha" type="submit">
        <img alt="Buscar" src="http://www.............../img/search.png">
    </button>
    <input type="button" value="limpiar" onclick="$('themesearch').getElements().each(function(i) {if (i.selectedIndex!=undefined) i.selectedIndex=-1})" class="clearbutton flotaDrcha">
    </form>
 

[emprear]

el formulario en sí, va a pasar la validación AA, hay un par de fallos si estás usando xhtml.
Lo que si vas a ver son algunos warnings, yo te recomendaría que incluyas los atributos tabindex y acceskey. y que definas el lenguaje del documento ya sea a través de un header ó meta

Saludos