As especificações para HTML5 estabelecem o seguinte:
Quando o elemento canvas
é usado para apresentar um conteúdo incorporado o usuário deve ser capaz de dar o foco aos seus elementos descendentes (aqueles inseridos em canvas
para prover uma alternativa acessível). Isso visa a permitir que os autores possam usar canvas
fornecendo acesso ao conteúdo alternativo via teclado e foco: os autores devem prever regiões aptas a receber o foco nos conteúdos alternativos de canvas
.
Traduzindo a palavra da especificação o conteúdo dentro do elemento canvas
deve ser marcado como o exemplo geral mostrado a seguir:
<canvas>
<p>
conteúdo</p>
</canvas>
Se o conteúdo for interativo ele deverá ser acessível e manipulável via teclado. Todo o conteúdo deve ser acessável por tecnologias assistivas como leitores de tela. Assim, no exemplo a seguir o texto alternativo deve ser lido por leitores de tela e o link deve ser funcional e acessível via teclado.
Até hoje nenhum navegador, exceto o Internet Explorer 9, versão beta, implementou essas funcionalidades de suporte a conteúdos alternativos de canvas
. Se você está usando o IE9 para navegar com o teclado você terá acesso ao link existente no conteúdo alternativo do elemento canvas constante dessa página exemplo que criamos para você testar o suporte. Se você está usando um leitor de tela, poderá também acessar o texto alternativo, ou seja, o conteúdo dentro do elemento canvas
.
Exemplo de canvas Marcação HTML:
<canvas id="example" width="260" height="200" role="img">
<p>Um <a href="http://en.wikipedia.org/wiki/Rectangle">retângulo</a> com uma borda preta.
No fundo do retângulo um círculo na cor rosa. Um quadrado na cor verde e um triângulo na cor púrpura
cobrem parcialmente o círculo e são semi-transparentes de modo que o círculo é visto por baixo deles.
</p>
</canvas>
HTML original desse exemplo de canvas