Estructura y layout
Footer
Representa el pie del documento o sección.
Ejemplo
Vista real construida con los archivos compilados de Ally.
<footer class="ally-footer ally-rounded ally-p-4">
<div class="stack-r ally-justify-between">
<strong>Ally</strong>
<span>Framework accesible</span>
</div>
</footer>
Contrato accesible
- Propósito
- Representa el pie del documento o sección.
- Clases CSS
.ally-footery modificadores de estado documentados.- HTML
- Elemento semántico correspondiente, heading o nombre accesible y controles nativos.
- ARIA
- Usa HTML nativo primero y añade nombre, estado o relaciones ARIA solo cuando el patrón lo requiera.
- Teclado
- Tab sigue el orden lógico; los elementos nativos conservan su comportamiento estándar.
- Foco
- No altera el orden de foco ni el orden de lectura del DOM.
- Estados
- Responsive, fluido y contenido según el componente.
- Ally Debug
- Valida estructura, nombres, relaciones, controles y estados detectables dentro del scope.
Estados y variantes
defaultfocusactivedisablederror
Los estados visibles deben acompañarse de texto, atributos nativos o propiedades ARIA; nunca dependen solo del color.
Accesibilidad
Prueba obligatoria: semántica, teclado, foco visible, zoom al 200%, contraste, reduced motion y lector de pantalla.
No hacer
<div class="ally-footer">Contenido sin elemento semántico, nombre accesible ni estados asociados.</div>
Un contenedor genérico con una clase visual no reemplaza la semántica, el nombre accesible ni la gestión de estados.