Accesibilidad en correos electrónicos y formularios referencia de buenas prácticas

Qué aprenderás

Aprende a hacer más accesibles tu correo electrónico y tu formulario de registro. Al diseñar tu correo electrónico y formulario de registro, querrás asegurarte de que tus diseños sean accesibles para todos tus destinatarios.  

Accesibilidad en los correos electrónicos

Optimizar asunto de correo electrónico y previsualizar texto

Haz que tu asunto de correo electrónico y el texto de previsualización sean descriptivos, atractivos y breves.

Sigue las mejores prácticas generales de diseño de correo electrónico

Seguir las buenas prácticas generales de diseño de correo electrónico hará que tu correo electrónico sea más accesible:

• Añade texto alternativo a todas tus imágenes.
• Evita el correo electrónico con imágenes.
• Evita utilizar imágenes para transmitir detalles clave.
• Utiliza colores muy contrastados (por ejemplo, blanco y negro, gris y azul oscuro, rosa y rojo oscuro).
• Utilice encabezados para separar las ideas.
• Utiliza enlaces descriptivos (por ejemplo, "Compra en la colección" en lugar de "Haz clic aquí para ir a la colección").
• Estructura tu correo electrónico de forma lógica.

A continuación se muestra un ejemplo de un correo electrónico optimizado para todos los destinatarios (izquierda) y otro que no lo está (derecha).

Accesibilidad en los formularios de inscripción

Klaviyo optimiza automáticamente el formulario de registro para la accesibilidad. Un formulario Klaviyo publicado en tu sitio web habilita alos visitantes del sitio a navegar por el formulario por completo utilizando sus teclados y lectores de pantalla. Además, los visitantes del sitio pueden cerrar un formulario con la tecla escape y enviarlo con la tecla intro. Puedes añadir un Color de contorno de enfoque, situado en la pestaña Estilos del editor de formularios, para ayudar a los usuarios a entender qué campo se resalta al desplazarse por el formulario.

Diseño del formulario de inscripción

Al igual que en el diseño del correo electrónico, deberás seguir algunas directrices básicas para garantizar que todos tus destinatarios reciban la información que deseas compartir con ellos a través de tus formularios. Al diseñar formularios:

• Utilice colores que contrasten.
• Evita poner información pertinente en las imágenes
• Utiliza un lenguaje descriptivo en los enlaces
• Construye tus formularios siguiendo una estructura lógica.

Mientras construyes tu formulario de registro, Klaviyo monitorizará una serie de problemas de accesibilidad, y te pedirá que arregles cualquier problema identificado en la pestaña Alertas de formularios. 

A continuación se muestra un ejemplo de un formulario bien diseñado (derecha) y un formulario que no será accesible para todos (izquierda). 

Recursos adicionales

• WebAIM: comprobador de contraste
• Sim Daltonism: simulador de daltonismo
• Funkify: Simulador de discapacidad de Google Chrome