🎉 Nueva herramienta: Lenguaje sencillo. Haz clic en el botón y pruébalo en directo

Insertar Eye-Able directamente en la página

Esta imagen muestra un escritorio con muchas pantallas en un ambiente fresco.

Compartir post:

Por defecto, el software de asistencia Eye-Able® se incrusta en una página web como un icono fijo en relación con la ventana gráfica.
Esta imagen muestra un escritorio con muchas pantallas en un ambiente fresco.

Insertar Eye-Able directamente en la página

Comparte esta entrada:

Esta imagen muestra un escritorio con muchas pantallas en un ambiente fresco.
Por defecto, el software de asistencia Eye-Able® se incrusta en una página web como un icono fijo en relación con la ventana gráfica.

Por defecto, el software de asistencia Eye-Able® se integra en un sitio web como un icono fijo en relación con la ventana gráfica. Esta posición actual, en combinación con iconos de alto contraste, ha demostrado su facilidad de uso en las pruebas realizadas con usuarios, incluso para los que tienen problemas graves de visión. Eye-Able® también puede, no obstante, incrustarse directamente en el sitio web sin ningún problema. Esto hace posible la integración en la barra de navegación o en otros contenedores existentes.

Como alternativa al icono normal, se puede utilizar cualquier elemento de la página. Las funciones de "abrir y cerrar" del icono normal están vinculadas a este elemento. El nuevo elemento de destino debe ser creado o adaptado para este fin.

Para crear el enlace, hay que añadir el ID CSS"eyeAble_customToolOpenerID" al nuevo elemento de destino. En cuanto existe un elemento con este ID en una página, se oculta el logotipo habitual y se añade un EventListener correspondiente a este evento. La posición de la barra de herramientas sigue estando donde estaría con el logotipo normal.


Si se van a incrustar varios botones de apertura/cierre, la clase CSS "eyeAble_customToolOpenerClass" también se puede utilizar. El comportamiento es idéntico al delmétodo CSS-ID.

 

Nota: En todas las subpáginas en las que no exista un elemento de este tipo con la etiqueta eyeAble_customToolOpenerID-ID o Clase eyeAble_customToolOpenerClass el logotipo normal seguirá apareciendo.

Si se desea vincular Eye-Able a un elemento de la página sin ocultar el logotipo principal, se utilizará la etiqueta "eyeAble_customToolOpenerNoHideClass" Se puede utilizar la clase CSS.


También es posible abrir la barra de herramientas Eye-Able directamente a través de un enlace. Basta con establecer como destino del enlace "javascript:EyeAbleAPI.toggleToolbar()". 


Asegúrese de que el punto de acceso para Eye-Able es accesible con el teclado y tiene texto accesible para lectores de pantalla. Un posible pie de foto sería: "Software abierto de asistencia visual. Accesible con el teclado mediante ALT + 1".


A modo de demostración, esta incrustación se realiza en esta página con el siguiente logotipo:

Puede descargar e incrustar el logotipo Eye-Able aquí (o como SVG aquí):

Eye-Able Logotipo - Masculino sobre fondo negro

Simple para todos

¿Interés despertado? Estaremos encantados de ayudarle.

Con más de 25 funciones para la accesibilidad digital, Eye-Able también le ayuda a reducir sus barreras a largo plazo. De este modo, pone su información al alcance de todos y no excluye a ningún visitante; en resumen: accede a un nuevo grupo destinatario sin grandes volúmenes de marketing.

El icono muestra la figura de la accesibilidad

Consulta

Consulta no vinculante sobre la accesibilidad digital en general

El icono muestra la figura de la accesibilidad

Análisis

Discusión del posible potencial de optimización de su sitio web

El icono muestra la figura de la accesibilidad

Demostración en vivo

Presentación del software de asistencia directamente en su sitio web

Más contribuciones

Si puede ser un poco más: