Bom dia!
Estou fazendo um projeto que tem uma imagem com uma descrição (com 137 palavras). Quando peço para o leitor de tela ler essa descrição, ele lê uma parte da frase, para, fala a palavra "gráfico" e depois preciso pressionar a seta para baixo para ele continuar lendo. Ele inclui essa palavra "gráfico" várias vezes na mesma descrição.
Alguém sabe como solucionar isso, para ele ler de forma contínua a descrição da imagem, sem pausas?
Obrigada
hoje, com a Alura e o Google Gemini
Fala Estudante, tudo bem?! Então, dei uma pesquisada aqui e realmente, os leitores de tela costumam fazer essa fragmentação do texto alt quando ele for muito grande.
A primeira solução, por mais óbvia que possa ser, que eu tenho pra te dar seria tentar otimizar reduzir esse texto. Mas no caso disso não ser possível, você pode associar a descrição da imagem à um texto externo, com uma tag de texto mesmo, e em seguida você remover a visualização do bloco de texto da tela, vou deixar um exemplo abaixo:
<img src="oi.png" alt="Imagem representativa" aria-describedby="img-desc">
<p class="sr-only" id="img-desc">O TEXTO DESCRITIVO VAI AQUI</p>
Repara que para vincular a descrição da imagem com o texto você pode utilizar o aria-describedby apontando para a id da tag que contém o texto.
Para remover a visualização do texto da tela, eu tentei utilizando as propriedade display e visibility do css, mas acaba que o NVDA não consegue ler nesses casos. Para isso, você pode utilizar uma técnica bem comum em alguns frameworks css (como bootstrap) que é a classe .sr_only, como demonstrado abaixo:
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
Isso vai fazer com o que o elemento não apareça na tela, mas não seja removido ou alterado no DOM.
Espero ter conseguido ajudar. Bons estudos!
Olá, Jean!
Super obrigada pela ajuda. Você consegue passar o link onde você viu essa informação sobre o leitor fazer essa fragmentação, por favor?
No Narrador, leitor de tela nativo do windows, ela funciona corretamente. Por isso achei estranho o NVDA falar a palavra gráfico no meio da descrição da imagem.
Abraços,
Então, não achei essa informação na documentação do NVDA. Mas perguntei ao chat GPT sobre os leitores de forma geral. Aí a resposta foi essa possibilidade do leitor fragmentar o texto. Eu acredito que seja para continuar informando sobre o contexto do que está sendo lido. No caso a descrição de uma imagem, por isso ele fica repetindo que é um gráfico.