Conozca "Patrones de diseño de formularios", nuestro nuevo libro sobre formularios web accesibles, ¡ahora disponible!

formularios No es una coincidencia que la palabra rime con "bostezos": los formularios web son aburridos de codificar y aún más aburridos para que los completen los visitantes. Pero sin formularios, la web sería simplemente una biblioteca. Nos permiten comentar, recopilar, reservar, comprar, compartir y muchos otros verbos. Y, sobre todo, nos permiten hacer estas cosas de una manera incómoda, opaca, confusa, extraña, frustrante, alarmante o alienante. Los formularios son una parte muy importante de la web, pero los diseñamos mal todo el tiempo. Cuando no están sobrediseñados, por lo general no están diseñados en absoluto.

Con el nuevo libro Form Design Patterns queremos abordar este problema. Al analizar problemas comunes del mundo real paso a paso, aprenderá a diseñar formularios simples, robustos , livianos , con capacidad de respuesta, accesibles , progresivamente mejorados , interoperables e intuitivos que permitan a los usuarios hacer las cosas sin importar qué. Y al final del libro tendrá una lista casi exhaustiva de componentes entregados como un sistema de diseño que puede usar inmediatamente en sus propios proyectos. (Saltar a la tabla de contenido.)

Tabla de contenido

Cada capítulo gira en torno a un problema específico; después de todo, así es como resolvemos los problemas en la vida real. Pero no se preocupe, muchos de los estilos, componentes y patrones que surgen de cada capítulo son reutilizables y aplicables mucho más allá de lo específico y verá ejemplos de esto a medida que avanzamos en el libro.

Descargue el extracto en PDF de forma gratuita (0,7 MB) para hacerse una idea de cómo es el libro por dentro.

1. Un formulario de registro
   Comenzaremos analizando las cualidades fundamentales de un formulario bien diseñado y cómo pensar en ellas. Al aplicar algo llamado protocolo de preguntas, veremos cómo reducir la fricción sin siquiera tocar la interfaz. Luego veremos algunos patrones cruciales, incluida la validación, que querremos usar para cada formulario.
2. Un formulario de pago
   Consideraremos los flujos de pago y veremos varios tipos de entrada y cómo afectan la experiencia del usuario en los navegadores móviles y de escritorio, mientras buscamos formas de ayudar a los clientes nuevos y recurrentes a realizar pedidos de manera rápida y sencilla.
3. Un formulario de reserva de vuelo
   Nos sumergiremos en el mundo de los componentes de formularios personalizados mejorados progresivamente mediante ARIA. Haremos esto explorando la mejor manera de permitir que los usuarios seleccionen destinos, elijan fechas, agreguen pasajeros y elijan asientos. Analizaremos los controles de formularios nativos y buscaremos romper con las convenciones cuando sea necesario.
4. Un formulario de inicio de sesión
   Veremos el omnipresente formulario de inicio de sesión. A pesar de su apariencia simple, hay un montón de fallas de usabilidad que sufren muchos sitios.
5. una bandeja de entrada
   Diseñaremos formas de administrar el correo electrónico de forma masiva, nuestro primer vistazo a las interfaces administrativas. Como tal, esto viene con su propio conjunto de desafíos y patrones, que incluyen un menú de acción receptivo descrito por ARIA, selección múltiple y mensajes en la misma página .
6. Un formulario de búsqueda
   Crearemos un formulario de búsqueda receptivo que esté disponible para los usuarios en todas las páginas y también consideraremos la importancia del mecanismo de búsqueda que lo impulsa.
7. Un formulario de filtro
   Los usuarios a menudo necesitan filtrar un gran conjunto de resultados de búsqueda difíciles de manejar. Sin un filtro bien diseñado, los usuarios se darán por vencidos. Los filtros plantean una serie de problemas de diseño interesantes y únicos que pueden obligarnos a desafiar las mejores prácticas para brindar a los usuarios una mejor experiencia.
8. Un formulario de carga
   Muchos servicios, como compartir fotos, mensajería y muchas aplicaciones administrativas, permiten a los usuarios cargar imágenes y documentos. Estudiaremos la entrada del archivo y cómo podemos usarlo para cargar varios archivos a la vez. Luego veremos las complejidades de una interfaz mejorada con Ajax de arrastrar y soltar que incluye usuarios de teclado y lectores de pantalla.
9. Un formulario de gastos
   Investigaremos el problema especial de necesitar crear y agregar muchos gastos (o cualquier otra cosa) en un sistema. Esta es realmente una excusa para cubrir el patrón add another , que suele ser útil en las interfaces administrativas.
10. Un formulario realmente largo y complicado
    Algunos formularios son muy largos y tardan horas en completarse. Veremos algunos de los patrones que podemos usar para hacer que los formularios largos sean más fáciles de administrar.

Sobre el Autor

Adam Silver es un diseñador de interacción con más de 15 años de experiencia trabajando en la web para una variedad de empresas, incluidas Tesco, BBC, Just Eat, Financial Times, el Departamento de Trabajo y Pensiones y otras.

Está particularmente interesado en el diseño inclusivo y los sistemas de diseño y escribe sobre esto en su blog y en publicaciones de diseño populares como A List Apart . Este tampoco es su primer libro: anteriormente escribió CSS ​​mantenible, un libro sobre la creación de interfaces de usuario mantenibles con CSS.

Detalles técnicos

• 384 páginas, 14 × 21 cm ( 5,5 × 8,25 pulgadas),
• ISBN: 978-3-945749-73-9 (impreso),
• Tapa dura de calidad con encuadernación cosida y un marcador de página de cinta,
• El libro electrónico está disponible en PDF, EPUB y Amazon Kindle.
• Envío gratuito por correo aéreo mundial desde Alemania. Tiempos de entrega.
• Disponible en formato impreso, tapa dura de calidad y libro electrónico.

Testimonios

Nuestro objetivo ha sido hacer que el libro sea lo más práctico y útil posible . Nos sentimos honrados de recibir críticas muy positivas de personas que crean sitios web a pequeña y gran escala.

• “Escribo formularios en HTML desde hace más de 20 años. Este libro captura la esencia de lo que es adoptar estándares, mejorar progresivamente y ofrecer formas simples y accesibles . Al formalizar patrones de diseño que todos podemos usar e implementar, los desarrolladores y diseñadores pueden enfocarse en su sitio web y producto. ¡Ojalá esto estuviera disponible hace 20 años!”
  — Paul Duncan, tecnólogos de diseño y profesor de accesibilidad
• “En un mundo de formas horriblemente marcadas, este libro es un faro de luz que ilumina el camino hacia experiencias de usuario más accesibles. Lo recomiendo encarecidamente a cualquiera que diseñe o desarrolle interfaces de usuario para evitar los errores comunes de accesibilidad de formularios que vemos con demasiada frecuencia”.
  — Marcy Sutton, defensora de la accesibilidad
• “Formas. No es una coincidencia que la palabra rime con "bostezos": los formularios son aburridos de codificar y aún más aburridos para que los completen sus visitantes. Así que haga que funcionen mejor para todos, usando los consejos concretos, el código y la microcopia de este libro. Y quita tus propios bostezos, ya que Adam Silver ha hecho toda la investigación y la codificación por ti”.
  — Bruce Lawson, defensor de los estándares web
• “Form Design Patterns establece soluciones inclusivas y de sentido común para formularios tanto simples como potencialmente complejos. Es su compañero en su esfuerzo por crear una web interactiva más simple y fácil”.
  — Heydon Pickering, consultor de UX y accesibilidad

Por qué este libro es para ti

Este libro es una guía práctica para cualquiera que necesite diseñar, crear prototipos y construir todo tipo de formularios para servicios, productos y sitios web digitales. Aprenderás :

1. Elementos de forma nativos disponibles y sus poderes, limitaciones y restricciones.
2. Cuándo y cómo crear componentes de formulario personalizados accesibles que puedan brindar a los usuarios una mejor experiencia en comparación con sus equivalentes nativos.
3. Cómo reducir significativamente la fricción en los formularios con un uso cuidadoso del lenguaje, la fluidez y el orden.
4. Maneras (y formas que no) de ayudar a los usuarios a corregir errores de formulario fácilmente.
5. Cómo lidiar con interfaces complejas que permiten a los usuarios cargar archivos y agregar varios elementos de cualquier tipo.
6. Formas de permitir que los usuarios busquen y filtren un gran conjunto de resultados según su propio modelo mental.
7. Cómo ayudar a los clientes a completar formularios especialmente largos y complejos que pueden tardar semanas en completarse.

¡No podemos esperar a escuchar sus pensamientos sobre el libro! Feliz lectura , y esperamos que encuentre el libro tan útil como nosotros. Solo ten una taza de café (o té) lista antes de comenzar a leer, por supuesto. Sigue aplastando y... ¡ miau !