Formularios accesibles y usables cumpliendo los estándares

Muchos de los desarrolladores cometemos errores a la hora de crear un formulario. En este artículo veremos algunos usos prácticos para desarrollar un formulario correcto.

1. Insertar las etiquetas Labels en todos los campos, utilizando correctamente el for.
2. Agrupar los campos similares y agrupándolos con la etiqueta fieldset.
3. Permitir enviar el formulario sin javascript.
4. Permitir enviar el formulario haciendo click en la tecla de intro.
5. Comprobar la longitud del campo. No es lo mismo un campo de email, que un campo de código postal.
6. Remarcar el campo dónde tiene el usuario el focus.
7. Solo pedir los campos necesarios y útiles para tu aplicación o página web.
8. Sí el formulario dispone de muchos campos, dividirlos en pasos.
9. Agrupar los campos obligatorios en el primer paso.
10. No dejar un espacio muy grande entre el label y el campo.
11. Mejor filas que columnas de campos.
12. En los radio buttons o checkbox, poner el label después del input.
13. Después de un error al enviar el formulario, mantener los valores que había introducido el usuario.
14. Evitar los combos, ya que el usuario no sabrá las opciones hasta que no despliegue el combo.
15. Controlar el maxlenght en campos de cp, telefono o dni. Siempre vigilando las variaciones que pueden haber. No siempre un campo de telefono tiene la misma longitud, en otros paises tiene más números.
16. Comprobar que la tabulación coincida con el orden visual.
17. El botón de restablecer el formulario, en la mayoria de casos es inecesarios.

Próximamente pondré más reglas de usabilidad y accesibilidad.

Sábado, Marzo 1st, 2008 a las 0:11 en Accesibilidad web, General, Usabilidad. You can leave a response, or trackback from your own site.