Label y los radio buttons en HTML/XHTML
21 diciembre, 2014
Label es una marca que se utiliza para adjuntar información a un control. Por ejemplo, si tenemos un formulario donde se solicita la intruducción del nombre, normalmente tendremos una etiqueta que diga «nombre» y un campo de texto. Así:
En este caso, «nombre» debería llevar una marca label para que un lector de pantalla sepa qué texto va asociado al campo de texto. Así:
<label for=»nombre»>Nombre:</label> <input type=»text» name=»nombre» size=»20″ />
Hoy he visto un error utilizando label con elementos radio button. Concretamente, el error es este:
<label for=»tipoEmpreBusqueda»>Tipo Empresa</label>
<input type=»radio» name=»tipoEmpreBusqueda» value=»1″ />Actividad Nacional
<input type=»radio» name=»tipoEmpreBusqueda» value=»0″ checked=»checked» />Actividad Minorista
Es un error por dos razones:
1) Label debe referenciar un id en el atributo for.
2) Label ha de etiquetar un único control.
Si funcionara tal y como está hecho, un lector de pantalla no sabe qué información va con cada posible opción. Si no pudieramos ver, el lector nos diría que nuestras posibles opciones son Tipo Empresa y Tipo Empresa.
¿Y cuál es la solución del problema?
Lo correcto sería así:
Tipo Empresa
<input type=»radio» id=»nacional» name=»tipoEmpreBusqueda» value=»1″ /><label for=»nacional»>Actividad Nacional</label>
<input type=»radio» id=»minorista» name=»tipoEmpreBusqueda» value=»0″ checked=»checked» /><label for=»minorista»>Actividad Minorista</label>
En este caso, el lector nos informaría que nuestras dos posibles opciones son Actividad Nacional y Actividad Minorista.
Entry Filed under: Tecnología. .
Leave a comment
Some HTML allowed:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>
Subscribe to the comments via RSS Feed