F82Campos de teléfono sin un texto que diga qué se pide

Por qué es importante

Quien ve bien quizá reconozca un teléfono por su forma. Pero las personas con baja visión pueden no ver los signos pequeños. Las personas con discapacidad cognitiva pueden no reconocer el formato.

Los lectores de pantalla (programas que leen en voz alta lo que hay en la pantalla) tampoco lo deducen. Sin texto, pueden usar como nombre el signo más cercano: «+», «(» o «-». La persona oye eso y no sabe qué escribir. El formulario se queda sin enviar o con datos erróneos.

Cómo evitarlo

1. Ponga una etiqueta de texto visible junto al grupo de casillas, por ejemplo «Teléfono móvil».
2. Agrupe las casillas en un fieldset con un legend que diga qué dato se pide.
3. Añada instrucciones breves si el formato no es evidente, por ejemplo «Prefijo del país y número de 9 cifras».
4. Dé además a cada casilla su propio nombre, como «Prefijo» y «Número».
5. Si puede, pida el teléfono en un solo campo. Es más sencillo para todo el mundo.

Cómo comprobarlo

1. Busque en el formulario los teléfonos divididos en varias casillas.
2. Compruebe que cerca hay un texto visible que dice qué dato es, o unas instrucciones para rellenarlo.
3. Si no hay ni etiqueta ni instrucciones, hay fallo.
4. Con un lector de pantalla, recorra las casillas con Tab y escuche qué anuncia en cada una.

Ejemplo

Teléfono en dos casillas con un título visible para el grupo, instrucciones y un nombre para cada casilla.

<fieldset>
  <legend>Teléfono móvil</legend>
  <p id="tel-ayuda">Prefijo del país y número de 9 cifras.</p>
  <label for="tel-pref">Prefijo</label>
  <input id="tel-pref" size="4" value="+34"
         autocomplete="tel-country-code" aria-describedby="tel-ayuda">
  <label for="tel-num">Número</label>
  <input id="tel-num" size="9"
         autocomplete="tel-national" aria-describedby="tel-ayuda">
</fieldset>