Manual de uso para entidades y equipos técnicos

Winclus widget 0.8.4 · septiembre de 2026 · Complementa la guía para personas usuarias, la guía técnica de integración y la declaración de accesibilidad.

1. Qué es y qué no es

Winclus es tecnología de apoyo embebida: un componente que se añade a un sitio web para que las personas puedan usarlo con la cara, los ojos, la voz, un solo pulsador, un teclado en pantalla o pictogramas, y con ajustes de lectura, color, calma y lenguaje claro. Es gratuito para la persona y se procesa en su navegador.

Winclus no hace conforme un sitio con las WCAG ni con la Resolución 1519 de 2020. Un sitio cumple cuando su propio código cumple. Para saber qué le falta, use Winclus Audit (sección 6). En pliegos, comunicaciones y contratos describa Winclus como tecnología de apoyo, nunca como «cumplimiento» ni «certificación».

2. Instalación

2.1 Una línea

<script src="https://winclus.com/widget.js" async data-idioma="es-CO"></script>

Antes de </body>, en la plantilla común de todas las páginas. widget.js es siempre la última versión: las mejoras llegan solas, en menos de 5 minutos, sin tocar el sitio. Es la forma recomendada.

Si la política de seguridad de la entidad exige integridad de subrecursos (SRI), use la versión fija con su hash. Esa versión no se actualiza nunca: para recibir las mejoras hay que cambiar a mano el número y el hash por los publicados en winclus.com/integrar.

<script src="https://winclus.com/widget-0.8.6.js" async data-idioma="es-CO"
        integrity="sha384-SsvxH2DmER/b/WH6fN73Ud8ZtI67cpzF6HKAnPqsSlHO6jpXCjC3PlfIfPHj61ml" crossorigin="anonymous"></script>

2.2 Plantillas y gestores

• GOV.CO y MiColombiaDigital: administración del sitio → código en el pie (o pie de la plantilla). Pegue la línea de widget.js.
• WordPress: plugin en integraciones/wordpress/winclus (se entrega con el acuerdo); Ajustes → Winclus.
• Drupal 9 a 11: módulo en integraciones/drupal/winclus.
• Joomla y PrestaShop: plugin y módulo en integraciones/joomla e integraciones/prestashop.
• React, Vue, Angular, Svelte: web component <winclus-widget> con winclus-elemento.js.
• Magento, Shopify, Wix, Squarespace, Webflow, Moodle, Google Tag Manager y más: dónde pegar la línea en cada una, en winclus.com/plataformas.

2.3 Atributos

• data-posicion="izquierda": botón y panel a la izquierda.
• data-camara="no": no ofrecer el puntero con la cara (por ejemplo, en quioscos sin cámara).
• data-idioma="es-CO": idioma del reconocimiento de voz. data-ui="en": idioma de los textos del panel (si no, el lang de la página).
• data-relevo="no": quita los botones al Centro de Relevo y al diccionario de LSC (sitios fuera de Colombia).
• data-explicar="URL": servicio propio de lectura fácil con IA (sección 5).
• data-metricas="URL": recibir cifras de uso anónimas si la persona lo activa (sección 7).

2.4 Política de seguridad de contenido (CSP)

No necesita 'unsafe-inline'. Con nonce, póngalo en el <script> y el widget lo propaga. Directivas mínimas: script-src 'nonce-…' https://winclus.com; style-src 'nonce-…'; img-src https://static.arasaac.org data:; connect-src https://winclus.com; media-src blob:.

2.5 Comprobar que funciona

Abra el sitio, pulse el botón redondo, pestaña Ver, «Alto contraste». Si la página cambia, está bien. Para una comprobación completa: node prueba_produccion.js https://su-sitio (se entrega con el acuerdo) recorre las funciones de los nueve grupos de discapacidad sobre su página.

3. Qué ofrece a las personas

• Motriz: puntero por cabeza u ojos con la webcam, clic por parpadeo, boca, cejas o permanencia, menú de clics, imán, barrido con un solo pulsador, teclado en pantalla con predicción.
• Habla: frases con voz, tablero de pictogramas ARASAAC con predicción, dictado con confirmación.
• Visual: texto al 200 %, contraste, modo oscuro, lupa 2× a 16×, cursor grande, guía, corrección de daltonismo, lector de pantalla dentro de la página (zonas, tablas, listas, estados, búsqueda, lectura continua) compatible con NVDA y JAWS.
• Auditiva: avisos visuales de sonido, subtítulos grandes, subtítulos en vivo, Centro de Relevo y diccionario LSC.
• Cognitiva y mayores: «explícame esta página», asistente «¿qué quieres hacer?», ayuda en formularios, «¿dónde estoy?», modo fácil, lectura limpia, máscara de enfoque, letras separadas.
• Neurológica: modo calma, pausar animaciones, limitador de volumen; respeta las preferencias del sistema operativo.

Todo ello se detalla en lenguaje claro en la guía para personas usuarias, que puede enlazar desde su página de accesibilidad.

4. Datos personales (Ley 1581 de 2012)

• La imagen de la cámara se procesa en el navegador de la persona y no se guarda ni se envía. Los rasgos de la mirada de la calibración (dato biométrico) se guardan solo en su navegador. Winclus pide consentimiento explícito antes de la primera activación.
• El dictado, las órdenes por voz y los subtítulos en vivo usan el reconocedor del navegador (Google en Chrome, Microsoft en Edge): la voz sale del equipo mientras están activos, y el panel lo avisa.
• No hay cuentas, cookies ni rastreo. Winclus no tiene servidores con datos de las personas.
• Qué debe hacer la entidad: mencionar el widget en su política de tratamiento de datos (texto de referencia en winclus.com/privacidad), y si configura data-explicar o data-metricas, declarar el servicio que recibe esos datos.

5. Lectura fácil con su propio servicio de IA (opcional)

Sin configuración, «Explicar en fácil» funciona por reglas. Con data-explicar="https://su-servidor/explicar", el widget envía el texto de la página a su servicio y muestra la respuesta. Contrato: POST JSON {texto, idioma, titulo} → {texto} (párrafos separados por línea en blanco; «# » hace un título). Si el servicio falla, se usan las reglas. Así los datos van a un servidor de la entidad, no a Winclus.

6. Winclus Audit: cómo está su sitio

Winclus Audit se entrega con el acuerdo de soporte. Ejecución: node auditar.js https://su-sitio.gov.co --entidad "Nombre de la entidad" --salida informe.

Genera informe.html (incumplimientos agrupados por criterio de la Resolución 1519, con cómo corregir cada uno, en escritorio y móvil), declaracion.html (borrador de declaración de accesibilidad con los huecos por rellenar) y resultados.json. También detecta los CAPTCHA que exigen resolver un desafío (CC1 y CC29) y las sesiones que caducan o redirigen solas (CC19), dos barreras que ninguna tecnología de apoyo debe saltarse: tiene que quitarlas el sitio. Un escáner detecta entre el 30 y el 50 % de las barreras: complete con revisión manual y pruebas con personas.

7. Cifras de uso para reportar

El widget cuenta en el navegador de cada persona cuántas veces hizo clic con la cara, usó el barrido, dijo una frase, recibió un error explicado, etc. La persona lo ve en Más → «Lo que consigo con Winclus» y puede copiar el resumen. Si la entidad configura data-metricas="https://su-servidor/metricas", aparece un interruptor «Compartir mis cifras de uso con este sitio»; solo si la persona lo activa, el widget envía una vez por semana un JSON con {sitio, version, desde, cifras}: números, sin identificadores. Sirve para reportar gestiones completadas por personas con discapacidad (por ejemplo, al ITA) sin tratar datos personales.

8. Declaración de accesibilidad y comunicación

• Publique su declaración (borrador de Winclus Audit) enlazada desde el pie de todas las páginas: nivel alcanzado, método, fecha, excepciones, contacto y plazo de respuesta.
• Indique que el sitio incluye Winclus como tecnología de apoyo y enlace la guía para personas usuarias.
• Palabras que no debe usar sobre Winclus: «cumple la norma por usted», «hace el sitio accesible», «certificado». Palabras correctas: «permite usar el sitio con la cara, la voz y un solo pulsador», «procesado en el dispositivo».

9. Mantenimiento

• Versiones: con widget.js las mejoras llegan solas. Con la versión fija nada cambia: para actualizar, cambie el número y el hash en el <script> tras leer las notas de la versión y pasar prueba_produccion.js sobre su sitio.
• Evidencia: el resultado de las pruebas automáticas del widget está en winclus.com/evidencia con fecha y commit; se regenera con cada cambio.
• Incidencias: hola@winclus.com. Respuesta en máximo 10 días hábiles; con acuerdo de soporte, los plazos del acuerdo.
• Capacitación: sesión de una hora para el equipo de atención (cómo ayudar a una persona a activar lo que necesita) y de dos horas para el equipo técnico (integración, Audit, declaración).

10. Lista de comprobación para poner en marcha

1. Línea del script en la plantilla común (widget.js, o la versión fija si se exige SRI), data-idioma="es-CO".
2. CSP revisada (si aplica) y probada con el botón «Alto contraste».
3. Política de tratamiento de datos actualizada con el texto de referencia.
4. Winclus Audit ejecutado; incumplimientos críticos y serios corregidos.
5. Declaración de accesibilidad publicada y enlazada desde el pie.
6. Guía para personas usuarias enlazada desde la página de accesibilidad.
7. Equipo de atención capacitado.
8. Primera ronda de pruebas con personas usuarias programada (protocolo disponible a petición).