Support Centre

Escreva um texto alternativo (alt) útil para conteúdo não textual

Renée Meloche
Renée Meloche
  • Atualizado

O texto alternativo (alt) é  um texto descritivo  anexado a elementos visuais, como ícones, imagens e fotos. Texto alternativo renderizado por ferramentas de acessibilidade de documentos PDF e da Web, como  leitores de tela  , que não podem "ler" elementos visuais como lêem texto.

 

Por que o texto alternativo é importante?

Os leitores de tela (e outras tecnologias assistivas)  leem  o texto alternativo como uma alternativa à experiência visual. O texto alternativo permite que esses e outros usuários entendam o contexto e o conteúdo dos elementos visuais.

O texto alternativo acessível é  exigido  pelas  Diretrizes de Acessibilidade de Conteúdo da Web  (WCAG), às quais muitas leis como a Seção 508 (Estados Unidos) e AODA (Canadá) se referem.

 

Quando devo adicionar texto alternativo ou marcar elementos visuais como decorativos?

Certos elementos visuais em seu design são  decorativos  e não precisam ser descritos para leitores de tela.

Tendo problemas para determinar o que é um  elemento decorativo  e o que  requer texto alternativo  ? Consulte a tabela comparativa abaixo:

Elementos decorativos

Elementos que requerem texto alternativo

Adicionar interesse visual

Exigir ou aceitar a entrada do usuário (como um botão "baixar"

Crie um efeito estético

Apresentar dados, como uma tabela ou gráfico

O único objetivo é preencher o espaço em branco

Representar um cenário, localização, emoção ou conceito relacionado a outro conteúdo que está sendo apresentado

Não são cruciais para entender as informações apresentadas

Servem a um propósito no contexto do conteúdo ao qual aparecem

Representar um elemento de formatação, como formas abstratas ou linhas estilizadas que separam duas seções de texto

Explique ou esclareça o texto próximo relacionado a recursos visuais ou outros elementos não textuais

 

Que texto alternativo devo adicionar às imagens decorativas?

Para imagens decorativas, use o texto alternativo "Imagem decorativa" ou "Elemento decorativo" para marcar a imagem; não há necessidade de descrever os detalhes. Um leitor de tela pulará os elementos marcados como "decorativos".

 

Como faço para escrever um texto alternativo preciso e útil?

A maneira mais fácil de escrever um texto alternativo útil é  imaginar que você está descrevendo uma imagem para alguém que não pode vê-la  . O que eles precisam saber sobre o visual? Qual contexto é relevante e o que é demais?

O texto alternativo deve fornecer detalhes sobre o conteúdo não textual que é:

  • funcional

  • informativo

  • contextual

  • focado

Determine se a imagem pretende transmitir  informações específicas  ou se pretende  evocar um sentimento ou emoção  .

 

O que é 'conteúdo não textual'?

O conteúdo específico pode ser algo como:

  • uma imagem de um produto que está disponível para compra

  • um logotipo da empresa em um relatório

  • um vídeo de um casal em uma página de viagens

Ao descrever o conteúdo, considere qual deve ser o  foco  da descrição.

Considere esta imagem:

Uma tigela de molho de iogurte com pedaços de endro fresco, especiarias e óleo visíveis na superfície.  Ao lado da tigela está um pequeno pedaço de pão integral torrado, partido ao meio.

 

Você pode descrever esta imagem de várias maneiras diferentes, dependendo de sua  finalidade no contexto em que aparece  .

  • Em uma página da web com uma receita para este prato, identificando o prato pelo nome e descrevendo seus componentes e como ele aparece (por exemplo, "Uma tigela de molho de iogurte batido regado com azeite e polvilhado com raminhos de endro e especiarias aparece em um fundo cinza claro mesa ao lado de um pedaço de pão integral crocante.")

  • Em um anúncio de talheres, onde a tigela é um produto à venda (por exemplo, "Uma tigela moderna de barro, com cerca de 6" de largura, com um acabamento cinza salpicado fica sobre uma mesa. A tigela contém uma pasta de iogurte e aparece ao lado de uma peça de pão.")

  • Em um site de uma empresa de laticínios (por exemplo, "Uma tigela de pasta feita com iogurte orgânico fresco de origem local aparece em uma mesa ao lado de uma fatia de pão integral").

 

Devo incluir texto no texto alternativo que descreve o conteúdo não textual?

Uma imagem, vídeo ou outro elemento de conteúdo não textual pode incluir texto ou outros caracteres que talvez você precise descrever em texto alternativo.

 

Uma criança em um moletom com capuz com duas pequenas orelhas de urso no capuz está de pé, tentando abrir a caixa do jogo de tabuleiro que está segurando.  Um adulto se ajoelha atrás dele, ajudando a sustentá-lo.

 

No GIF animado acima, uma criança está em pé na frente de um adulto. A criança está segurando  uma caixa com algo escrito  . Você pode descrever esta imagem de várias maneiras diferentes, dependendo do contexto em que ela aparece:

  • Em um site com um artigo sobre paternidade  (por exemplo, "Um menino de 2 anos está na frente de sua mãe, vestindo uma camiseta branca e jeans e um moletom com zíper. O capuz está levantado e duas orelhas pequenas o capuz faz com que o menino pareça um ursinho de pelúcia. Sua mãe se ajoelha atrás dele, ajudando-o a ficar de pé e a segurar uma caixa de jogo de tabuleiro.")

  • Em um site que anuncia brinquedos e jogos de tabuleiro para crianças  (por exemplo, "Uma criança pequena segura o jogo de festa 'Twister' em uma caixa. Sua mãe, que se ajoelha atrás dele, está ajudando o menino a ficar de pé e segurar a caixa.")

  • Em um site que anuncia roupas infantis  (por exemplo, "Um menino de dois anos usa um de nossos moletons de pelúcia felpudos na cor marrom, com duas orelhas de urso no capuz. Sua mãe se ajoelha atrás dele, ajudando o menino a ficar de pé e segurar uma caixa.")

Dependendo de quais informações são importantes para o leitor entender, o texto alternativo pode mudar o foco para destacar ou minimizar detalhes, incluindo quaisquer caracteres visíveis como texto ou números que aparecem no conteúdo não textual.

 

Como faço para escrever texto alternativo para imagens de texto puro?

É sempre  melhor usar texto do que imagens de texto  quando você deseja incluir informações importantes em um documento ou design.

Se você estiver usando uma  imagem de texto  , simplesmente  escreva no texto alternativo  o texto que aparece no elemento visual.

Um gráfico informativo com o texto transcrito no parágrafo anterior.

A imagem acima, mostrando um bloco de texto "informativo", deve ser descrita com texto alternativo que  reflita exatamente o que está escrito no texto da imagem  :

"Escrever texto alternativo? Certifique-se de que todas as imagens de texto sejam transcritas exatamente como aparecem. Não há necessidade de incluir "Uma imagem de texto que lê..."; um leitor de tela identificará automaticamente o elemento como uma imagem."

 

Como incluo dados complexos no texto alternativo?

Alguns elementos visuais em seu design podem incluir  dados complexos ou uma grande quantidade de dados  ; elementos como gráficos, tabelas, gráficos ou mapas.

Veja o fluxograma abaixo, por exemplo. No contexto deste artigo, este gráfico pretende apresentar um exemplo de uma imagem complexa. Não é necessário que o texto alternativo descreva todo o conteúdo da imagem.

Você deve alugar ou comprar fluxograma infográfico

O texto alternativo curto  fornece uma descrição simples de um elemento visual que exibe informações complexas.

Use um texto alternativo curto quando quiser que o leitor entenda  qual  conteúdo está em um elemento visual, mas os detalhes finos não são necessários.

Nesse caso, o texto alternativo  curto  para a imagem acima pode ser:

"Um fluxograma intitulado 'Você deve alugar ou comprar?'"

No entanto, em um  artigo sobre os prós e contras de alugar e comprar  , descrever o conteúdo da imagem em detalhes é crucial para o leitor entender o conteúdo.

O texto alternativo longo  para esta imagem deve fornecer  todos os detalhes  necessários para que um leitor com deficiência visual entenda as informações que o visual está tentando comunicar.

O texto alternativo longo para esta imagem pode ser semelhante a:

"Fluxograma intitulado 'Você deve alugar ou comprar?' A caixa inicial contém a pergunta 'Você pretende ficar por mais de 5 anos?', com duas caixas subsequentes: 'Você tem uma posição financeiramente estável?' e 'Seu orçamento pode lidar com hipotecas, impostos, manutenção e outros custos?' As respostas possíveis para todas as perguntas são 'sim' e 'não'; todos os fluxos terminam em uma caixa marcada como 'Aluguel' ou 'Comprar' Fluxos que terminam em 'Aluguel': 1. Você planeja ficar por mais de 5 anos ? Sim; Você está em uma situação financeira estável? Não. 2. Você está planejando ficar por mais de 5 anos? Não; Seu orçamento pode lidar com hipotecas, etc.? Não. 3. Você está planejando ficar por mais de 5 anos? anos? Sim; Você está em uma situação financeira estável? Sim; Seu orçamento pode lidar com hipotecas, etc.? Não. Fluxos que terminam em 'Comprar': 1. Você planeja ficar por mais de 5 anos? Sim; Você está em uma posição financeiramente estável? Sim; Seu orçamento pode lidar com hipotecas, etc.? Sim. 2. Você pretende ficar por mais de 5 anos? Não; Seu orçamento pode lidar com hipotecas, etc.? Sim."

 

Como posso resumir dados em um gráfico ou infográfico?

Descrições longas de texto alternativo podem ficar, por falta de uma palavra melhor,  longas  .

Tente manter as informações o mais simples e sucintas possível, o máximo que puder.

No gráfico de barras abaixo, comparando a frequência com que os profissionais de marketing criam visualizações de dados, a descrição longa do texto alternativo deve incluir os dados e o contexto significativo relacionado ao que o gráfico representa.

A longa descrição do texto alternativo pode ser lida assim:

"Um gráfico de barras intitulado 'Os profissionais de marketing criam visualizações de dados regularmente'. A maioria (48%) dos profissionais de marketing cria visualizações de dados todas as semanas. Em seguida, 37% dos profissionais de marketing criam todos os meses. O segundo menor é 10% dos profissionais de marketing criando a cada poucos meses; e apenas 5% dos profissionais de marketing criam uma ou duas vezes por ano."

Um gráfico de barras intitulado 'Marketers criam visualizações de dados regularmente', com os dados descritos no parágrafo anterior.

 

Dicas rápidas para escrever um texto alternativo significativo

  • Seja sucinto e use uma linguagem simples

  • Usar  voz ativa

  • Não  inclua palavras como “imagem de…”, “foto de…” ou “ícone de…”. Os leitores de tela anunciam a presença de imagens, portanto, essas descrições seriam redundantes (exceto nos casos em que o meio é crítico para o contexto do visual)

  • Evite abreviaturas

  • Sempre use um  ponto  (pontuação) no final do texto alternativo

 

 

VENNGAGE LOGO

Você está curioso para se inscrever? Confira nossos planos.

 

Comece a projetar!

Esse artigo foi útil?

Usuários que acharam isso útil: 1 de 3

Tem mais dúvidas? Envie uma solicitação