Accesibilidad web 101: Diseño para todos
Publicado: 2022-01-10El diseño web se trata de accesibilidad. La mayoría de los diseñadores web tienen como objetivo crear productos para la mayor cantidad de personas dentro de su audiencia, proyectando sus diseños como redes abiertas para generar la mayor afluencia de usuarios.
Y si bien ese principio de diseño tiene lógica, eclipsa un principio algo más simple e inclusivo: diseñar para todas las personas, no para la mayoría.
Optimiza el contenido para que todos los posibles usuarios puedan disfrutar e interactuar con tu sitio web y acceder a la información y datos disponibles. Participar en esta práctica ayudará a desarrollar un mercado más amplio y diversificar su base de clientes. El 15% de la población mundial tiene algún grado de discapacidad.
Estas son personas que, como todos los demás, usan Internet con frecuencia y dependen en gran medida de la comunicación y las herramientas digitales. Optimizar su sitio web para garantizar que los usuarios puedan disfrutar de una gran experiencia puede expandir su red de interacción. Al practicar la inclusión en su diseño, podrá llegar a millones de personas que a menudo se pasan por alto.
Diseñar para la accesibilidad no tiene por qué ser difícil. Solo necesita ser simple y considerado con todos los usuarios potenciales. Aquí le mostramos cómo optimizar su sitio web para obtener la máxima accesibilidad.
Comprenda a sus usuarios
Conocer a tu audiencia es crucial en cualquier proyecto, por lo que es el mejor lugar para comenzar. Comprenda que sus usuarios pueden incluir personas con diferentes capacidades. Algunos de sus usuarios pueden tener problemas auditivos o visuales, otros pueden tener trastornos convulsivos, otros pueden tener problemas de movilidad.
Si bien no puede diseñar para todos los escenarios posibles, ampliará su horizonte de diseño si se toma el tiempo de pensar en tantos como pueda. Después de pensar en su audiencia ampliada, investigue un poco. Lea estudios de casos, hable con amigos que tienen experiencias, consulte guías de accesibilidad.
Tal vez intente tomar una página del campo educativo, los principios del diseño universal son una buena referencia.
Piensa en la experiencia de usuario
Ahora que ha desarrollado un entendimiento con sus futuros usuarios, ponga ese entendimiento en su marco de experiencia de usuario (UX). Este paso lo ayudará a empatizar con sus usuarios y considerar cosas en las que quizás no haya pensado antes. También lo guiará en la dirección de una amplia variedad de definiciones de tecnología de asistencia.
Así como un diseñador debe considerar el comportamiento de un sitio web en todos los principales navegadores, las tecnologías de asistencia deben ser parte de la lista de verificación de funcionalidad. A veces, incluso los cambios más pequeños en el diseño web pueden abrir nuevas puertas para usuarios discapacitados.
Un cambio simple
Por ejemplo, posiblemente el cambio más fácil de implementar es cómo usa las etiquetas de énfasis.
Visualmente, no hay diferencia entre <b>
y <strong>
, ni <i>
parece diferente a <em>
. Pero para las personas con discapacidades, estas etiquetas pueden cambiar drásticamente sus experiencias de usuario.

Si bien se representan de la misma manera, en negrita y cursiva , la diferencia entre estas etiquetas es su función. Mientras que las etiquetas más simples en negrita y cursiva son de presentación (cambian la forma en que se representa el texto), fuerte y énfasis indica diferentes patrones de habla para la tecnología de asistencia.
Pero no es tan simple como reemplazar ciegamente todos los <b>
con <strong>
. Muchos encabezados usan texto en negrita para contrastar, por ejemplo, pero tal vez no sea mejor para los usuarios con discapacidades experimentar una etiqueta <strong>
aquí. Piense: "¿Es necesario pronunciar este texto de manera diferente para que un usuario experimente su significado completo?" De lo contrario, considere eliminar <strong>
o <em>
a menos que sean realmente necesarios.
Cambios sutiles y consideraciones como esta pueden marcar la diferencia para los usuarios con discapacidades. Es importante actualizar y no degradar la UX.
Diseño para personas con discapacidad visual
Si bien el consejo anterior ya beneficia a las personas con discapacidad visual, no todas las personas con problemas visuales tendrán el mismo nivel o tipo de discapacidad. Es igualmente importante ofrecer opciones que puedan adaptarse a aquellos que conservan el uso de la vista.
Considere estos elementos:
- Permitir a los usuarios ampliar la fuente. La mayoría de los navegadores harán esto con o sin su consentimiento, pero se verá mejor si tiene CSS preparado para ello.
- Evite ciertas combinaciones de colores como rojo y verde o azul y amarillo. En su lugar, ¿por qué no usar el color para aumentar las conversiones y aumentar la accesibilidad?
- Código en el "texto alternativo". El texto alternativo se puede leer mediante tecnología de asistencia y explicar cualquier gráfico en la página.
- Utilice puntos en las abreviaturas, incluso en las conocidas. La forma en que un lector de pantalla procesa la información suele ser fonética: imagina escuchar "Fibby" frente al FBI
Para obtener más información sobre las formas de incorporar elementos para usuarios con discapacidades visuales, consulte la Fundación Estadounidense para Ciegos.
Diseño para personas con discapacidad auditiva
Aunque las personas con discapacidad auditiva requieren menos adaptaciones, las tendencias recientes en el uso de videos en sitios web han aumentado la necesidad de opciones de diseño inteligentes. Entonces, si su sitio web incorpora algún componente auditivo, use subtítulos o interpretación de lenguaje de señas.
Evite la tentación de usar subtítulos ocultos automáticos: deténgase en cualquier video aleatorio que se haya procesado con transcripción automática para ver traducciones de palabras que no tienen sentido y pueden ser productivas.
Para pautas específicas de subtítulos, las recomendaciones de la Asociación Nacional de Sordos se pueden encontrar aquí.
Diseño para epilepsia fotosensible
Una de las preocupaciones de diseño en torno al uso frecuente de video, especialmente video que usa una función de reproducción automática, rodea a los usuarios que tienen epilepsia fotosensible. Estos usuarios pueden experimentar convulsiones desencadenadas por efectos de luz estroboscópica o imágenes en movimiento. Los diseñadores web pueden utilizar la herramienta de análisis de epilepsia fotosensible para comprobar la probabilidad de que su contenido desencadene una convulsión.
Si el contenido se identifica como en riesgo pero no se puede cambiar para reducir el riesgo, advierta siempre sobre el potencial y no reproduzca el video automáticamente. Asegúrese de que la advertencia esté visible y cerca del botón de reproducción.
Diseño para personas con movilidad reducida
Algunas deficiencias de la movilidad variarán desde la pérdida total del control motor fino hasta un leve temblor. Cualquier nivel de deterioro da como resultado la misma experiencia de usuario en un sitio web que no los ha considerado:
- Los usuarios deben esforzarse más para llegar a los enlaces y pueden cansarse rápidamente.
- Los usuarios no pueden navegar por el sitio web porque no permite el uso del teclado.
- Tener que desplazarse por una página larga resulta en fatiga porque no hay una opción de "volver al principio" u omitir disponible.
Los sitios que están optimizados para la pantalla táctil o la entrada fina del mouse pueden presentar consecuencias más graves para las personas con problemas de movilidad, lo que posiblemente inutilice el sitio.
La incorporación de elementos de diseño como la navegación que se puede operar con el teclado y enlaces de anclaje frecuentes que pueden llevar al usuario a diferentes secciones de la página puede ayudar mucho a estos usuarios.
Crear una opción de sitio web "básico"
Su diseño es impecable, interactivo y llamativo, utiliza las últimas y mejores tendencias disponibles en el mercado abierto, y es apenas accesible para cualquiera de los usuarios descritos anteriormente.
Si eso suena como su diseño web, una alternativa más fácil puede ser crear un diseño "simple" que los usuarios puedan activar y desactivar. Esto atraerá a más que solo usuarios discapacitados: para los usuarios que sufren de migrañas desencadenadas por alto contraste, por ejemplo, tener un interruptor de fácil acceso puede ser la diferencia entre convertirse en cliente o irse para lidiar con una migraña de tres horas.
No te detengas allí tampoco. Aplique la misma opción para sus listas de suscripción, lo que permite a los usuarios editar fácilmente sus preferencias antes de recibir marketing por correo electrónico.
Sigue entendiendo a tus diferentes usuarios. Sigue pensando en ellos. Cuanto más entienda y empatice con sus usuarios, más accesible será el diseño de UX. ¿Quién sabe? Incluso puedes cambiar el mundo de alguien.