Accesibilidad
El diseño accesible permite que personas de todas las capacidades interactúen con nuestros productos, los comprendan y los naveguen.La accesibilidad es responsabilidad de todos. Inclúyela desde el inicio para evitar modificaciones costosas posteriores.
Creamos productos inclusivos para todos. Nuestro sistema de diseño integra funciones de accesibilidad por defecto en cada componente y herramienta.
Todos enfrentamos limitaciones: permanentes, temporales o situacionales. La tecnología de asistencia ha mejorado la web, pero aún necesitamos tu participación para crear experiencias equitativas.
Para qué diseñamos
Diseñamos para personas, no para cumplir normativas. Consideramos equidad e inclusión en cada etapa del proceso.
Diseñamos para:
-
Discapacidades visuales: Texto alternativo descriptivo, HTML semántico, contraste adecuado. No uses solo color para transmitir información.
-
Discapacidades auditivas: Proporciona información visual y textual como alternativa al audio.
-
Movilidad limitada: Navegación por teclado, objetivos de gran tamaño, HTML semántico para reconocimiento de voz.
-
Discapacidades cognitivas: Redacción clara, diseño simple, navegación intuitiva.
-
Discapacidades múltiples: Soluciones integrales, no aisladas.
-
Lenguaje inclusivo: Textos traducibles e inclusivos en género, raza y edad.
Principios fundamentales
Consistencia
Usa las mismas soluciones para problemas similares. Los componentes del sistema de diseño aseguran experiencias familiares en cualquier dispositivo o tecnología de asistencia.
Texto alternativo
El texto permite múltiples formas de consumo:
- Lectura visual
- Audio via lectores de pantalla
- Táctil con braille
Etiquetas claras, texto alternativo y transcripciones son esenciales.
Colores accesibles
No dependas del color para transmitir información. Usa contraste mínimo de 4.5:1 para texto normal y 3:1 para texto grande. Los colores tienen significados culturales diferentes.
Control del usuario
- Diseño adaptable a todos los tamaños de pantalla
- Personalización de escala y colores (modo oscuro, alto contraste)
- Respeto a preferencias de movimiento reducido
- Información clara sobre cambios importantes
HTML semántico
Usa elementos que describan su significado (<header>, <nav>, <section>) en lugar de elementos genéricos (<div>, <span>). Las tecnologías de asistencia interpretan mejor el contenido semántico.
Inclusión interseccional
Diseña para todas las razas, géneros, orientaciones y orígenes. Las personas pueden enfrentar múltiples barreras simultáneamente.
Simplicidad
Crea software fácil de usar que respete el tiempo de las personas. La mayoría usa productos para completar tareas, no por entretenimiento.
Pruebas diversas
Involucra usuarios diversos en las pruebas: personas con discapacidades, diferentes niveles técnicos, tecnologías variadas y críticos del producto.