Como descrever imagens em sites

Quem está acostumado a navegar pela Web, normalmente se depara com diversos tipos de imagens nas páginas: fotos, pinturas, gráficos, infográficos, organogramas, mapas, ilustrações, capturas de tela, e muitos outros elementos visuais. Esses recursos geralmente são utilizados para complementar, adicionar e ilustrar determinadas informações, ou apenas podem decorar/estilizar algum espaço digital. Mas como descrever imagens de modo a torná-las acessíveis para pessoas cegas? Artigo do Instituto Federal do Rio Grande do Sul.

Como descrever imagens: composição com diversos desenhos ilustrativos,incluindo uma pessoa cega e um olho, dispostos em quadrados de diferentes tamanhos

Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

Na Web, tanto as imagens que transmitem conteúdo quanto as decorativas são inacessíveis a quem navega utilizando recursos de Tecnologia Assistiva, como o leitor de tela, a linha braille, navegadores em que as imagens estão desabilitadas, e navegadores textuais, como o Lyinx. Assim, uma pessoa cega ou surdocega, por exemplo, perderá toda a informação que é passada visualmente através de imagens, já que leitores de tela e linhas braille leem apenas texto. A solução é descrever textualmente todas as imagens que transmitem informações relevantes, transformando o que era apenas visual em texto, e possibilitando aos recursos de tecnologia assistiva interpretarem o conteúdo dos elementos de imagem.

A descrição das imagens é inserida no texto alternativo. Em páginas Web, o texto alternativo deve constar no atributo "alt" do elemento <img>. Em documentos digitais, como os gerados a partir do Microsoft Office Word, Microsoft PowerPoint, LibreOffice Writer e LibreOffice Impress, é possível inseri-lo acessando as propriedades da imagem. Para saber como inserir texto alternativo em documentos digitais, faça o download do arquivo no final deste artigo.

Como descrever imagens usando o texto alternativo

O texto alternativo deve ser fiel à imagem, englobando seus pontos fundamentais de forma clara, objetiva e sucinta. Uma boa ideia na hora de criar a descrição é perguntar-se "se eu não pudesse utilizar essa imagem aqui, o que escreveria em seu lugar?", pois, desse modo, é provável que a alternativa textual corresponda de fato ao que a imagem transmite visualmente.

Na imagem abaixo, a informação mais importante é o texto da campanha. A figura à esquerda, ilustrando uma mão aberta em uma placa, é apenas decorativa e não precisa constar na descrição. Portanto, um bom texto alternativo seria "Campanha Parada – Pacto Nacional pela Redução de Acidentes, Um pacto pela Vida".

Exemplo de imagem ilustrando o logo da campanha Parada Pacto Nacional Pela Redução de Acidentes, Um Pacto pela Vida

Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

Mas, nem sempre a imagem a ser descrita apresenta o conteúdo tão bem definido, e algumas dúvidas podem surgir sobre o que deve ou não ser colocado na descrição. As dicas abaixo podem auxiliá-lo a escrever o texto alternativo.

  • Observe o contexto em que a imagem está inserida para saber o que deve ou não constar na descrição.

Na maioria das vezes, o importante é o conteúdo essencial da imagem, e deve-se, portanto, evitar descrições muito detalhadas. Mas, é possível que em algum contexto específico seja importante, além de descrever a informação principal, fornecer também detalhes da composição e estrutura da imagem.

No contexto, por exemplo, de uma notícia que apresente algumas informações sobre o Plano Viver sem Limite do governo federal, seguida de uma imagem do logo desse plano, o essencial é informar o texto do logo. Não é necessário explicar o estilo gráfico (cores, estrutura, design) utilizado, pois a falta desse tipo de detalhe não prejudica o entendimento de quem não visualiza a imagem. Então, nesse caso, apenas um texto alternativo breve seria suficiente para contemplá-la.

logo Viver Sem limite

Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

Exemplo de texto alternativo breve (informa o mais importante da imagem): Logo do Viver sem Limite: Plano Nacional dos Direitos da Pessoa com Deficiência.

Já em um contexto diferente, como por exemplo, em um site que apresente obras de arte, é provável que a pessoa queira saber cada detalhe da composição das pinturas, e, nesse caso, uma descrição longa e detalhada se faz necessária.

Pintura de Lydia Moschetti

Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

Exemplo de descrição para obras de arte (fornece detalhes específicos da composição): Uma mulher trajando um vestido rosado com pequenos detalhes em amarelo está de costas para o observador. Ela usa um chapéu bege de aba comprida com uma fita escura que é amarrada abaixo do queixo. Sobre a aba do chapéu, há um ramo com pequenas flores. O vestido é aberto na parte de trás, o que possibilita a visualização das costas da mulher. Seu braço esquerdo está dobrado e sua mão segura um ramo de flores. O braço direito está estendido, de modo a apoiar a mão sobre uma cadeira no canto. O fundo da pintura é escuro, pintado de marrom.

  • Não repita na descrição da imagem o que já foi explicado anteriormente no corpo do texto.

Caso o próprio texto contemple toda a informação presente na imagem, forneça uma descrição simples no texto alternativo.

Abaixo, podemos perceber que o próprio texto da notícia já contém as informações mais importantes da imagem. Nesse contexto, a descrição poderia ser simplesmente "Convite da 3ª Conferência Municipal dos Direitos da Pessoa com Deficiência".

Notícia com banner, onde o próprio texto contém as mesmas informações do banner. Ambos trazem informações sobre a data, horário e local da 3ª Conferência dos Direitos da Pessoa com Deficiência

Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

  • Não utilize as palavras “imagem de…” para iniciar uma descrição.

Os leitores de tela informam automaticamente ao usuário que o elemento lido é uma imagem, sendo desnecessário repetir a informação no texto alternativo. Porém, no caso de capturas de tela (prints), fotos e/ou retratos, é recomendável indicar qual é a natureza da imagem. Assim, quando necessário, utilize as frases "captura de tela de", "foto de…", "pintura de" no início da descrição.

  • Verifique se a imagem passa algum conteúdo relevante ou é apenas decorativa.
  • Imagens puramente decorativas, que não acrescentam conteúdo ao texto, não devem ser descritas.

    • Utilize pontuação e acentuação adequadas em todas as frases.

    Também é importante que as palavras estejam corretamente escritas, para evitar que o leitor de tela se confunda durante a leitura do texto.

    • Não repita o texto da legenda no texto alternativo.

    Os leitores de tela lerão as duas informações, sendo que apenas uma já é suficiente. O texto alternativo deve ser utilizado para descrever detalhes adicionais da imagem, que não foram citados na legenda.

    A legenda abaixo, por exemplo, já informa o que é importante na imagem. Nesse caso, o texto alternativo deve conter alguma outra informação. Adicionar alguma descrição como "Capa do relatório final da 3ª Conferência Nacional dos Direitos da Pessoa com Deficiência" no texto alternativo acabaria se tornando repetitivo, pois a legenda já contém a mesma informação.

    Capa de um relatório seguida de uma legenda que informa o título deste

    Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

    Já na imagem a seguir, a legenda contribui para a compreensão da ideia transmitida, mas sozinha não é suficiente para englobar todo o conteúdo. Portanto, você deve utilizar o texto alternativo, acrescentando as informações que faltam para que ela seja compreendida em conjunto com a legenda.

    Legenda: Imagem representando algumas limitações fisicamente imperceptíveis

    Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

    Exemplo de texto alternativo: Cinco ilustrações de pessoas, com as palavras “TDAH”, “Disgrafia”, “Dislexia”, “Daltonismo” e “TEA” escritas uma em cada ilustração. Abaixo, destaca-se a frase “Nem sempre limitações são visíveis”.

    • Imagens complexas, como gráficos, também devem ser descritas

    Gráficos podem ser descritos de duas maneiras: inserindo a descrição no próprio texto ou disponibilizando-a em outra página através de um link. Nesses casos, a explicação textual auxilia não somente quem utiliza alguma Tecnologia Assistiva, mas também pessoas com dificuldades de compreender dados dispostos em forma de gráficos.

    Na imagem abaixo, há um exemplo de descrição do gráfico no próprio texto e em um link adjacente. No texto alternativo da imagem, insira o título do gráfico, por exemplo, "Gráfico demonstrativo da Deficiência no Brasil segundo o Censo do IBGE 2010". Para detalhar os dados, utilize ou a explicação no próprio contexto, ou o link abaixo do gráfico, pois eles possuem praticamente as mesmas informações.

    Exemplo de texto contendo os dados dispostos em forma de gráfico sobre a deficiência no Brasil. Abaixo do gráfico,há um link para a descrição textual em outra página

    Como descrever imagens: pouse o mouse sobre a imagem para ver o texto alternativo.

    • Materiais digitais mais complexos.

    ?Para materiais digitais mais complexos, como livros didáticos, que contenham história em quadrinhos, cartum, mapas, tirinhas e outros, em especial livros produzidos no formato Daisy, o MEC possui diretrizes que especificam a forma como a imagem deve ser descrita através da Nota Técnica nº 21.

    Para saber mais sobre como descrever imagens em sites, acesse:

    Arquivos para download

    Fonte: Projeto de Acessibilidade Virtual – IFRS – Instituto Federal do Rio Grande do Sul

    Mais sobre audiodescrição
    Com o propósito de orientar a produção de descrição de imagem de obras disponibilizadas por
    Ele chega em casa por volta das sete da noite, depois de trabalhar o dia
    Esta audiodescrição tornou acessíveis algumas das fotografias da exposição Sombras e Lugares, de Roberto Giugliani,


    Mais sobre audiodescrição
    Com o propósito de orientar a produção de descrição de imagem de obras disponibilizadas por
    Ele chega em casa por volta das sete da noite, depois de trabalhar o dia
    Esta audiodescrição tornou acessíveis algumas das fotografias da exposição Sombras e Lugares, de Roberto Giugliani,