Interfaz accesible a1

Guía práctica de nivel A (A1) para diseño de interfaces accesibles: reglas rápidas, comprobaciones esenciales y recomendaciones para equipos de producto en España.

Esta página recopila controles sencillos y comprobables que ayudan a cumplir requisitos básicos de accesibilidad: textos legibles, navegación por teclado, etiquetas y alternativas textuales.

Solicitar auditoría Ver recursos

Principios básicos

Percepción

Proveer alternativas textuales y contraste suficiente para contenido visual y multimedia.

Operable

Asegurar navegación por teclado y foco visible en controles interactivos.

Comprensible

Interfaz predecible, lenguaje claro y etiquetas consistentes.

Contraste y tipografía

Comprobaciones rápidas para texto y elementos interactivos. Para nivel A se requiere contraste mínimo en textos importantes y controles.

Ejemplo	Color fondo	Color texto	Resultado
Encabezado	#0b0f1f	#FFFFFF	OK
Botón secundario	#1a0033	#7ef9ff	OK
Texto pequeño	#0b0f1f	#9aa0a6	Revisar

Herramienta: contraste >= 4.5:1 para texto normal (recomendación para A1 revisar lo esencial); mejora progresiva hacia AA/AAA.

Navegación por teclado y foco

Verifica que todos los elementos interactivos sean accesibles con Tab/Shift+Tab y que el orden sea lógico.

Uso de tabindex estándar (evitar tabindex > 0).
Foco visible y contraste suficiente en estado :focus.
Atajos de teclado documentados (si existen).

Prueba rápida: navega sólo con el teclado y realiza las tareas principales.

Asegúrate de que el orden del DOM coincide con el flujo visual y que los componentes dinámicos gestionan el foco.

El indicador de foco *** debe depender sólo del color; añade un contorno o sombra visible.

Los controles activables con mouse deben ser igualmente accionables con Enter/Space u otras teclas estándar.

Imágenes y alternativas textuales

María González

Lead UX — accesibilidad

Incluye siempre atributo alt. Si la imagen es decorativa, usa alt="". Para capturas de pantalla describe la función, *** solo "imagen".

Recursos rápidos y checklist

Checklist A1: texto alternativo, etiquetas en formularios, foco visible, descripción de multimedia.
Herramientas: comprobadores de contraste, lector de pantalla básico, navegación con teclado.
Documentos recomendados: guías internas de componentes accesibles y patrones de interacción.

¿Quieres que revisemos tu interfaz? Solicita una revisión rápida y recibes un informe A1 con acciones concretas.

Checklist descargable

PDF con pasos mínimos para el control A1.

Descargar checklist