Nova ferramenta: Linguagem simples. Clique no botão e experimente ao vivo

Incorporar o Eye-Able diretamente na página

Esta imagem mostra uma secretária com vários ecrãs num ambiente fresco.

Partilhar post:

Por defeito, o software de assistência Eye-Able® é integrado numa página Web como um ícone fixo relativo à janela de visualização.
Esta imagem mostra uma secretária com vários ecrãs num ambiente fresco.

Incorporar o Eye-Able diretamente na página

Partilhar esta publicação:

Esta imagem mostra uma secretária com vários ecrãs num ambiente fresco.
Por defeito, o software de assistência Eye-Able® é integrado numa página Web como um ícone fixo relativo à janela de visualização.

Por defeito, o software de assistência Eye-Able® é integrado num sítio Web como um ícone fixo em relação à janela de visualização. Esta posição proeminente em conjunto com ícones de alto contraste provou ser fácil de utilizar em testes de utilizadores, mesmo para utilizadores com deficiências visuais graves. No entanto, o Eye-Able® também pode ser incorporado diretamente no sítio Web sem qualquer problema. Isto permite a integração na barra de navegação ou noutros contentores existentes.

Qualquer elemento da página pode ser utilizado como alternativa ao ícone normal. As funções "abrir e fechar" do ícone normal estão ligadas a este elemento. O novo elemento de destino deve ser criado ou personalizado para o efeito!

Para criar a ligação, a ID CSS"eyeAble_customToolOpenerID" deve ser adicionada ao novo elemento de destino. Assim que existir um elemento com este ID numa página, o logótipo habitual é ocultado e é adicionado um EventListener correspondente a este evento. A posição da barra de ferramentas continua a ser a mesma que teria com o logótipo normal.


Se forem incorporados vários botões de abrir/fechar, a classe CSS "eyeAble_customToolOpenerClass" também pode ser utilizada. O comportamento é idêntico ao dométodo CSS ID.

 

Nota: Em todas as subpáginas em que não exista um elemento com o ID eyeAble_customToolOpenerID ou a classe classe eyeAble_customToolOpenerClass o logótipo normal continuará a ser apresentado!

Se o Eye-Able tiver de ser ligado a um elemento da página sem ocultar o logótipo principal, a classe "eyeAble_customToolOpenerNoHideClass" pode ser utilizada.


Também é possível abrir a barra de ferramentas Eye-Able diretamente através de uma ligação. Para o fazer, basta definir "javascript:EyeAbleAPI.toggleToolbar()" como o destino da ligação


Certifique-se de que o ponto de acesso ao Eye-Able pode ser alcançado com o teclado e tem um texto acessível aos leitores de ecrã. A rotulagem possível seria: "Abrir software de assistência visual. Acessível com o teclado através de ALT + 1"


Para efeitos de demonstração, esta incorporação é efectuada nesta página com o seguinte logótipo:

Pode descarregar e incorporar o logótipo Eye-Able aqui (ou como SVG aqui):

Logótipo Eye-Able - homem contra um fundo preto

Fácil para todos

Está interessado? Teremos todo o gosto em ajudá-lo.

Com mais de 25 funções relacionadas com a acessibilidade digital, o Eye-Able também o ajuda a reduzir as suas barreiras a longo prazo. Pode tornar as suas informações acessíveis a todos e não excluir nenhum visitante - em suma, pode aceder a um novo grupo-alvo sem grandes volumes de marketing.

O ícone mostra a figura de acessibilidade

Entrevista de aconselhamento

Consulta não vinculativa sobre acessibilidade digital em geral

O ícone mostra a figura de acessibilidade

Análise

Discussão de possíveis potencialidades de otimização do seu sítio Web

O ícone mostra a figura de acessibilidade

Demonstração em direto

Apresentação do software de assistência diretamente no seu sítio Web

Outras contribuições

Se quiser um pouco mais: