Form Design Patterns

Libro de Adam Silver, publicado por Smashing Media en octubre de 2018, dedicado por completo al diseño de formularios web accesibles e inclusivos. Parte de una idea sencilla: los formularios parecen triviales, pero son el centro de casi toda interacción con valor en la web (registrarse, pagar, reservar, buscar), y hacerlos simples para todo tipo de personas, navegadores y dispositivos es un problema serio. Está dirigido a diseñadores y desarrolladores de interfaces con nivel intermedio que ya manejan HTML, CSS y algo de JavaScript.

Cada uno de sus diez capítulos resuelve paso a paso un caso real: un formulario de registro (cualidades básicas de un buen formulario, el «protocolo de preguntas» para reducir fricción y la validación de errores), un checkout con el patrón «una cosa por página» y los tipos de input adecuados en móvil y escritorio, una reserva de vuelos con componentes personalizados (destinos, fechas, pasajeros y asientos) construidos con mejora progresiva y ARIA, un login y sus fallos de usabilidad habituales (incluido el acceso con redes sociales), una bandeja de entrada con acciones masivas y selección múltiple, un buscador responsive, filtros para grandes listados de resultados, la subida de varios archivos con arrastrar y soltar mejorada con Ajax pero usable por teclado y lector de pantalla, un formulario de gastos con el patrón «añadir otro» y, por último, estrategias para formularios muy largos y complejos.

No es un libro de un framework concreto: los patrones se entregan como un pequeño sistema de diseño reutilizable basado en HTML semántico, CSS y JavaScript sin dependencias, que el lector puede adaptar a su propio stack. Su gran aporte es combinar usabilidad, accesibilidad e ingeniería frontend con argumentos razonados (a veces cuestionando las «buenas prácticas» de moda). Deja fuera la parte de servidor y no trata librerías como React o Angular, así que habrá que trasladar las ideas a cada framework. Conviene leerlo con conocimientos básicos de ARIA y de lectores de pantalla para sacarle todo el partido.