Si su correo electrónico no es accesible, su correo electrónico está roto.
La accesibilidad del correo electrónico sigue siendo un tema crucial. Aunque la accesibilidad del correo electrónico se hizo familiar hace más de una década, un asombroso 99,97% de los correos electrónicos todavía enfrentan problemas críticos de accesibilidad.
En nuestro artículo "Por qué es importante la accesibilidad", analizamos varias discapacidades y cómo afectan a las experiencias de los usuarios. También destacamos los puntos de partida para garantizar la accesibilidad total del correo electrónico. En este artículo, compartiremos pautas sobre cómo optimizar la accesibilidad de sus correos electrónicos.
Puntos clave
- A pesar de ser una necesidad reconocida desde hace más de una década, un asombroso 99,97% de los correos electrónicos HTML todavía tienen problemas de accesibilidad significativos, lo que subraya una brecha masiva en las prácticas de diseño de correo electrónico.
- Los ajustes de accesibilidad en los correos electrónicos no son solo una sutileza, sino una necesidad, ya que alrededor de la mitad de la población mundial se beneficia potencialmente de diseños de correo electrónico más accesibles debido a una variedad de discapacidades, incluidas discapacidades visuales, pérdida de audición, discapacidades motoras y trastornos cognitivos.
- La accesibilidad efectiva al correo electrónico va más allá de simples correcciones técnicas y requiere una estrategia integral de cinco pasos: diseño (que garantice la accesibilidad visual), copia, trabajo con textos alternativos, tecnología y enlaces estratégicos. Solo este enfoque holístico garantiza una accesibilidad completa en todos los aspectos de la comunicación por correo electrónico.
Estadísticas de accesibilidad, o el número de personas en todo el mundo que se beneficiarían de la accesibilidad al correo electrónico
En nuestro artículo anterior, presentamos estadísticas detalladas sobre la prevalencia de diversas discapacidades y el estado actual de la accesibilidad digital. He aquí un resumen rápido:
- 2.500 millones de personas tienen discapacidades visuales, incluidos 2.200 millones con problemas de visión y 300 millones que son daltónicos;
- 430 millones de personas tienen pérdida auditiva discapacitante (sordas) y 1.500 millones de personas tienen pérdida auditiva;
- 968 millones tienen discapacidad motora;
- 1.600 millones tienen discapacidades cognitivas y de aprendizaje, incluidos 960 millones con dislexia y 400 millones con epilepsia fotosensible.
Este gráfico ilustra que aproximadamente la mitad de la población mundial podría beneficiarse de los correos electrónicos accesibles, y sin embargo el 99,97% de los correos electrónicos HTML tienen problemas de accesibilidad significativos.
Lista de mejores prácticas de accesibilidad al correo electrónico
Los estándares de accesibilidad al correo electrónico son un conjunto de reglas y recomendaciones para diseñar correos electrónicos que sean fáciles de leer para personas con todos los tipos de discapacidad.
- Haga que el texto alternativo de las imágenes y los GIF sean significativos.
- Si un GIF o una imagen tienen un propósito educativo, asegúrese de agregar una descripción detallada por escrito.
- Utilice encabezados y subtítulos (en lugar de solo usar fuentes más grandes) para organizar su contenido de manera significativa y hacerlo legible para los lectores de pantalla.
- Utilice solo encabezados con formato de programación, listas con viñetas y numeradas.
- Haga que el texto del enlace sea significativo.
- Opte por fuentes accesibles como OpenDyslexic, Comic Sans y opciones sans-serif como Arial, Verdana, Tahoma, Century Gothic, Trebuchet, Calibri y Open Sans.
- Establezca el interlineado en aproximadamente 150%.
- Especifique los nombres de los colores de los elementos entre paréntesis.
- Compruebe el contraste de color del texto y de las imágenes.
- Evite usar todas las letras mayúsculas para el texto continuo; En su lugar, utilice letras minúsculas más grandes.
- Agregue signos de puntuación al final de las viñetas y de cada oración, incluidos los encabezados.
- Utilice fondos de un solo color y blanquecino.
- Alinee su copia a la izquierda, sin saltos de línea ni justificación.
- Evite el exceso de negrita o cursiva: utilice negrita para enfatizar.
- El subrayado solo está permitido para los enlaces.
- Coloque solo una imagen GIF animada en una pantalla.
- Utilice GIF con menos de tres destellos por segundo.
- Establezca el idioma del correo electrónico, las funciones de presentación y el atributo dir para los lectores de pantalla.
Esto resume todos los estándares de accesibilidad para el correo electrónico. A continuación, le mostraremos cómo desarrollamos estas reglas específicas.
Pasos para crear correos electrónicos accesibles
En nuestro artículo anterior, exploramos cinco tipos de discapacidades y sus impactos únicos en la experiencia del usuario. Es crucial reconocer que cada discapacidad requiere adaptaciones específicas. Por ejemplo, centrarse únicamente en soluciones para el daltonismo podría no abordar las necesidades de las personas con dislexia o de las que utilizan lectores de pantalla. Para crear correos electrónicos verdaderamente accesibles, necesitamos un enfoque holístico que abarque el diseño, el código y el texto. Este método integral garantiza que satisfacemos todo el espectro de necesidades de accesibilidad, mejorando en gran medida la experiencia del usuario.
A continuación le explicamos cómo hacerlo:
Paso 1. Escribir un texto de correo electrónico accesible
Discapacidades que cubre: Discapacidades visuales y cognitivas/de aprendizaje/neurológicas.
Las pautas de texto accesible incluyen:
- que sea breve: Escriba un texto conciso para que los destinatarios puedan captar rápidamente su punto de vista sin necesidad de leer textos largos;
- manténgalo simple: Utilice un lenguaje directo que un estudiante de 8º grado pueda entender fácilmente. Evite la jerga compleja o los términos académicos;
- establezca el interlineado en aproximadamente 150%;
- utilice subtítulos: Divida su contenido en secciones con subtítulos claros para que sus correos electrónicos sean más fáciles de escanear;
- establezca encabezados en lugar de solo usar fuentes más grandes.
Paso 2. Optimización de textos alternativos
Dado que las personas con discapacidad visual no pueden ver sus imágenes, un texto alternativo claro y descriptivo es esencial para una comunicación efectiva.
Discapacidades que cubre: No solo las discapacidades visuales: el texto alternativo beneficia a todos los destinatarios. Ayuda a aquellos con imágenes bloqueadas debido a la lentitud de Internet, la configuración de seguridad o las preferencias personales, y es compatible con los usuarios de lectores de pantalla, incluidas las personas con discapacidades visuales, dislexia y otras discapacidades de lectura o aprendizaje.
Experto
Primero, expliquemos la diferencia entre el atributo alt y el texto alternativo:
- el atributo alt es el atributo HTML utilizado dentro del elemento de imagen;
- el texto alternativo es el contenido colocado dentro del atributo alt.
Permítanos mostrarle lo que sucede cuando no hay ningún atributo alt:
- las personas que usan lectores de pantalla escucharán la URL completa de la imagen alojada o el nombre del archivo si la imagen no está vinculada, o la URL de la imagen si la imagen está vinculada;
- todos los destinatarios no tendrán ni idea de qué se trata la imagen si la imagen está bloqueada.
(Fuente: Webinar con Sarah Gallardo)
Cada imagen en un correo electrónico DEBE TENER un atributo alt.
Las mejores prácticas de texto alternativo incluyen:
Experto
- tenga en cuenta tanto el contenido como el contexto de la imagen;
- asegúrese de que el texto alternativo transmita lo que representa la imagen;
- recuerde que los lectores de pantalla suelen dejar de leer el texto alternativo después de 100-120 caracteres;
- omita frases como "De esto se trata esta imagen", ya que los lectores de pantalla ya indican la presencia de una imagen;
- utilice mayúsculas y minúsculas, evitando todas las mayúsculas;
- apunte a un texto alternativo descriptivo pero conciso;
- asegúrese de que haya un buen contraste entre el texto alternativo y el fondo para mayor claridad visual.
Paso 3. Hacer que los enlaces sean accesibles
Discapacidades que cubre: Apoya a los usuarios de lectores de pantalla y a aquellos con discapacidades motoras.
Experto
Las mejores prácticas de los enlaces accesibles incluyen:
- adhiérase a una estrategia de enlaces intencionada: añada sólo enlaces a imágenes esenciales y evite enlazar las decorativas;
- utilice texto descriptivo del enlace para indicar claramente a dónde conduce el enlace, evitando frases genéricas como "Más información" o "Haga clic aquí";
- asegúrese de que el texto alternativo de las imágenes vinculadas describa el destino del enlace;
- asegúrese de que los enlaces se destaquen mediante el uso de métodos de formato como subrayado o negrita en lugar de depender únicamente del color;
- siempre que sea posible, incluya enlaces en los botones de llamada a la acción para ayudar a las personas con baja visión o discapacidades motoras a hacer clic en ellos.
Paso 4. Optimización del diseño del correo electrónico para la accesibilidad
Debido a su complejidad, este paso se divide en varios grupos.
Grupo 1. Directrices de accesibilidad para el formato de texto
Discapacidades que cubre: personas con baja visión, aquellos que usan lectores de pantalla y dislécticos.
- evite usar mayúsculas, ya que pueden ser malinterpretadas por las personas con dislexia y los lectores de pantalla pueden leerlas como abreviaturas;
- incluya signos de puntuación al final de las viñetas y los encabezados;
- minimice el uso de cursiva y negrita para enfatizar; evite por completo las negritas y cursivas;
- solo subraye el texto si se trata de un hipervínculo;
- opte por un tamaño de cuerpo de texto de 16 px para facilitar la lectura;
- utilice fuentes accesibles como OpenDyslexic, Comic Sans y opciones sans-serif como Arial, Verdana, Tahoma, Century Gothic, Trebuchet, Calibri y Open Sans;
- alinea tu texto a la izquierda sin justificar ni añadir saltos de línea.
Aunque el Criterio de Éxito 1.4.8 (conformidad con la AAA) lo permite, las mejores prácticas recomiendan evitar el texto justificado por las razones mencionadas. Alinee el texto con un solo lado.
Grupo 2. Trabajar con colores
Discapacidades que cubre: Personas con daltonismo, baja visión y dislexia.
Experto
- garantice un contraste de color suficiente entre el texto y las imágenes;
- utilice fondos de un solo color: para textos de menos de 18 px en negrita y 24 normales, debe ser 4:5:1, mientras que para textos superiores debe ser 3:1;
- elija fuentes de color gris oscuro sobre fondos blanquecinos en lugar de negro brillante sobre blanco brillante;
- evite usar colores solo para resaltar información importante en los correos electrónicos;
- Cuando utilice imágenes para indicar respuestas correctas o incorrectas (con rojo y verde, respectivamente) o tendencias en números, complemente con descripciones de texto o signos "+" y "-" para mayor claridad.
(Fuente: Correo electrónico de HubSpot)
Grupo 3. Trabajar en imágenes
Discapacidades que cubre: Personas con daltonismo, baja visión, dislexia y epilepsia fotosensible.
Cuando trabajes con GIF e imágenes, recuerda:
- utilice GIF con tres o menos destellos por segundo;
- utilice una imagen animada (GIF) por pantalla;
- mantenga el contraste de color como se describió anteriormente;
- Incluya texto alternativo significativo para las imágenes. En el caso de los GIF que transmitan instrucciones o información significativa, proporciona descripciones adicionales debajo del GIF.
Paso 5. Cumplir con los requisitos de accesibilidad de un código de correo electrónico
Discapacidades que cubre: Apoya a quienes usan lectores de pantalla y otros tipos de tecnología de asistencia.
Para obtener información detallada sobre la accesibilidad al correo electrónico y la tecnología de asistencia, consulte nuestro seminario web con Sarah Gallardo y Dmytro Kudrenko.
Nombraremos solo los críticos:
- establezca el atributo lang tanto en el elemento <html> como en los elementos secundarios directos del elemento <body>. Esta redundancia es necesaria ya que algunos clientes de correo electrónico pueden eliminarla del elemento <html>;
- ajuste el contenido dentro del <cuerpo> con un atributo dir para la direccionalidad;
- asigne role="presentation" o role="none" a los elementos <table> al atributo role.
Si utiliza Stripo, no tiene que preocuparse por asegurarse de que los correos electrónicos HTML están optimizados para los lectores de pantalla, ya que todos los correos electrónicos creados con Stripo ya están totalmente optimizados.
Herramientas para probar si tus correos electrónicos cumplen con todas las mejores prácticas de accesibilidad al correo electrónico
Cuando termines tus campañas de correo electrónico, revísalas con herramientas de pruebas de accesibilidad y/o pruébalas con lectores de pantalla.
Tiene que comer su propia comida para perros. Lo que significa que hay que probar, siempre probar el resultado.
Estas son las herramientas que te ayudarán a revisar tus correos electrónicos:
- accessible-email.org por Jordie van Rijn y Maarten Lierop, esta herramienta comprueba si su código de correo electrónico es compatible con cualquier lector de pantalla. Incluso pueden ayudarle a optimizarlo;
- Comprobador de accesibilidad, una herramienta de Parcel que le ayuda a evaluar su correo electrónico en cuanto a las mejores prácticas y problemas de accesibilidad. Clasifica los problemas identificados por gravedad: críticos, graves, moderados y leves. Esto hace que sea más fácil priorizar las correcciones;
- Campaign Precheck by Email on Acid: comprueba si su correo electrónico está optimizado para dispositivos de asistencia;
- Colores accesibles para comprobar el contraste de color del cuerpo del correo electrónico (texto y otros elementos, excluyendo imágenes);
- WebAIM (web accessibility in mind) — verificador de contraste de color. Considera no solo los colores, sino también los tamaños de fuente para cada caso;
- Coblis, simulador de daltonismo: muestra si sus imágenes son accesibles para personas daltónicas;
- Trace RERC (PEAT) para verificar que sus GIF cumplan con los límites recomendados en la frecuencia de parpadeo.
Expertos y recursos para obtener más información sobre la accesibilidad digital y del correo electrónico
En este artículo, hemos compartido prácticas esenciales para la accesibilidad en el correo electrónico y hemos compilado una lista de recursos y expertos clave a seguir para obtener más información sobre el tema.
- Sarah Gallardo, como desarrolladora principal de correo electrónico en Oracle, Sarah Gallardo es una destacada especialista en accesibilidad de correo electrónico. Ofrece amplias pautas y estándares de accesibilidad. Su experiencia ayuda a las organizaciones a alinearse con las mejores prácticas de accesibilidad a través de materiales educativos detallados.
- Mike Paciello, director de accesibilidad de AudioEye, educa activamente a las marcas sobre la importancia de la accesibilidad a través de las últimas estadísticas y conocimientos. Su trabajo es crucial para motivar a las empresas a implementar y priorizar la accesibilidad.
- Thomas Logan ofrece consultoría experta en accesibilidad, ayudando a las organizaciones a garantizar que su contenido digital sea accesible para todos. Sus servicios incluyen capacitación, auditorías integrales y asesoramiento estratégico que se adhieren a estrictos estándares de accesibilidad.
- Mark Robbins, un defensor de la accesibilidad del correo electrónico, comparte su profunda experiencia al proporcionar consejos prácticos y soluciones innovadoras para los especialistas en marketing por correo electrónico. Su enfoque en hacer que las comunicaciones por correo electrónico sean accesibles beneficia tanto a los remitentes como a los destinatarios.
- Paul Airy, especializado en diseño y desarrollo de correo electrónico, aplica la ciencia del comportamiento para mejorar la usabilidad y accesibilidad del correo electrónico. Su enfoque no solo mejora la experiencia del usuario, sino que también garantiza que los correos electrónicos sean comprensibles y navegables para todos.
- Las WCAG establecen los estándares internacionales de accesibilidad, proporcionando un marco que detalla cómo se puede hacer que el contenido digital sea accesible para las personas con discapacidad. Estas reglas y directrices de accesibilidad son esenciales para los desarrolladores y creadores de contenido de todo el mundo.
- El consorcio de marcado de correo electrónico de Parcel, dirigido por expertos en accesibilidad como Mark Robbins, proporciona materiales esenciales para mejorar la accesibilidad del correo electrónico. Cuenta con un informe trimestral, un glosario detallado y una lista de errores comunes con soluciones, todo destinado a elevar los estándares de la industria.
- A11y.email, dirigido por Sarah Gallardo, es un blog que ofrece materiales detallados sobre la accesibilidad del correo electrónico, cubriendo temas como texto alternativo efectivo, enlaces significativos, HTML semántico y contraste de color. También proporciona herramientas y técnicas para probar la accesibilidad en los correos electrónicos, lo que lo hace ideal para los desarrolladores y comercializadores de correo electrónico.
- AudioEye, dirigido por Mike Paciello, ofrece una gran cantidad de información sobre accesibilidad digital. Presenta artículos sobre las mejores prácticas, pautas de cumplimiento y las últimas tendencias de accesibilidad, lo que ayuda a las marcas a garantizar que su contenido digital sea inclusivo y accesible para todos los usuarios.
- El blog Equal Entry, dirigido por Thomas Logan, ofrece artículos detallados sobre accesibilidad digital. Cubre las mejores prácticas y temas innovadores como GenAI en la accesibilidad del correo electrónico, la web y los videojuegos, con el objetivo de hacer que el contenido digital sea inclusivo para todos.
- La asociación británica de dislexia crea conciencia y apoya a las personas con dislexia, proporcionando recursos, información y pautas para crear y hacer que el contenido digital sea accesible y amigable con la dislexia.
- La Universidad de Yale ofrece artículos y recursos sobre accesibilidad web, incluidas las mejores prácticas para crear enlaces accesibles y otros contenidos digitales.
Conclusión
La creación de correos electrónicos accesibles es una parte esencial de las estrategias de comunicación inclusivas que benefician no solo a las personas con discapacidades, sino a todos los destinatarios de correo electrónico. La gran prevalencia de problemas de accesibilidad en los diseños de correo electrónico actuales pone de manifiesto la urgente necesidad de concienciar e implementar las mejores prácticas. Al adoptar las pautas integrales descritas en este artículo, los especialistas en marketing y los desarrolladores pueden mejorar significativamente la experiencia del usuario para una amplia audiencia, asegurando que los correos electrónicos no solo sean legibles, sino realmente accesibles para todos. Este enfoque no solo mejora la participación, sino que también refleja un compromiso con la inclusión en las comunicaciones digitales.
0 comentarios