Instala Ally en cualquier sitio web

Distribución pública de Ally

Para el despliegue actual, carga los archivos estáticos de dist/ desde el sitio Ally. El bloque agrega Subresource Integrity (SRI) y CORS para detectar cualquier archivo que no coincida con este release.

Base pública activa: https://ally.accessibility.cl/dist

<link rel="stylesheet" href="https://ally.accessibility.cl/dist/ally.min.css">
<script defer src="https://ally.accessibility.cl/dist/ally.min.js" crossorigin="anonymous"></script>

Publicación desde GitHub

Como alternativa, si el repositorio público y el tag están configurados, los archivos pueden servirse desde GitHub Pages o jsDelivr.

Repositorio detectado/configurado: Configura OWNER/REPO antes del release.

<link rel="stylesheet" href="https://OWNER.github.io/REPO/dist/ally.min.css">
<script defer src="https://OWNER.github.io/REPO/dist/ally.min.js"></script>

Antes de crear el tag de release, configura el repositorio una sola vez:

npm run release:configure -- --github OWNER/REPO
npm run build
npm run release:check

Ally Debug por URL pública

Carga el auditor únicamente en desarrollo o QA. No hace falta para el funcionamiento de los componentes.

<script defer src="https://ally.accessibility.cl/dist/ally.debug.min.js"></script>

Instalación con npm

Cuando ally-accessibility esté publicado en npm, los equipos con bundler pueden consumir los exports públicos.

npm install ally-accessibility

import 'ally-accessibility/css';
import Ally from 'ally-accessibility';

Ally.init();

También hay hojas CSS separadas para reducir la carga en proyectos que seleccionan manualmente el CSS:

import 'ally-accessibility/grid';
import 'ally-accessibility/utilities';
import 'ally-accessibility/components-css';

Personalizar colores y descargar ZIP

No edites componentes uno por uno. Elige un solo color Primary: Ally genera automáticamente complementario, Success, Info, Warning y Danger, crea escalas 50–950, ajusta tokens funcionales para contraste AA/AAA y empaqueta un build personalizado.

Archivos locales descargados

Solo si copiaste dist/ físicamente dentro de tu sitio corresponde usar rutas relativas:

<link rel="stylesheet" href="./dist/ally.min.css">
<script defer src="./dist/ally.min.js"></script>

Compatibilidad de navegador

Ally apunta a las dos versiones mayores más recientes de Chrome, Edge, Firefox, Safari y iOS Safari. Internet Explorer no forma parte del soporte. El bundle CDN es IIFE clásico; el módulo ESM queda separado para bundlers.

El CSS utiliza mejoras progresivas: container queries están protegidas con @supports; backdrop-filter no es necesario para operar; y los estilos críticos incluyen fallback antes de color-mix().

Archivos públicos de distribución