Support Centre

Marque e adicione texto alternativo aos elementos do seu design

Renée Meloche
Renée Meloche
  • Atualizado

O texto alternativo (alt)  é um texto descritivo que  identifica conteúdo não textual  para leitores com deficiência visual e é legível para ferramentas de acessibilidade como leitores de tela. Use o texto alternativo para  identificar  elementos  decorativos e informativos em seus designs acessíveis.

Use a ferramenta Alt Text no Venngage Editor

Selecione qualquer  elemento que não seja de texto  na tela de design. Pode ser algo como um ícone, uma forma, uma foto ou um  gráfico  .

A metade superior de uma tela de design no Venngage Editor.  Um ícone no lado direito da tela de design é selecionado: é um desenho estilizado de uma pessoa com barba e cabelos escuros presos em um coque, vestindo uma camisa bege, aparecendo dos ombros para cima.  Uma caixa delimitadora azul fica visível ao redor do ícone, mostrando que ele está selecionado.

Clique ou use a barra de espaço (para usuários de teclado) em  Alt Text  na barra de ferramentas superior. Isso abrirá o modal pop-up "Adicionar texto alternativo" (caixa).

A partir daqui, você pode indicar se uma imagem é decorativa ou adicionar uma descrição para leitores com deficiência visual ou usuários de leitores de tela.

Descrever um elemento não textual com texto alternativo

Insira uma descrição  do elemento não textual que você selecionou no campo de texto  Description  no modal Add Alt Text (caixa).

Um close-up do modal 'Add Alt Text' (caixa) sobrepondo uma tela de design no Venngage Editor.  O cabeçalho da caixa diz 'Adicionar texto alternativo' e, abaixo dele, o texto informativo diz 'Adicionar texto alternativo (alt) pode melhorar a acessibilidade para usuários de tecnologias assistivas ou para aqueles que podem ter problemas para visualizar seu conteúdo.'  Abaixo deste texto há uma seção destacada em azul claro, com o título 'Dicas para escrever um bom texto alternativo'.  É expansível, com uma pequena seta para baixo ao lado.  O campo de texto aparece abaixo dele, sob o título 'Descrição'.  Sob o campo de texto, há uma caixa de seleção ao lado do título 'Marcar como decorativo'.  O campo de texto possui um contador de palavras (de 125 palavras) e há botões Cancelar e Salvar na parte inferior do modal.

 

Expanda a seção acima do campo de texto, "  Dicas para escrever um bom texto alternativo  ", para obter orientação sobre como escrever um texto alternativo útil  ou consulte nosso artigo sobre como escrever um texto alternativo (alt) útil para conteúdo não textual  para obter mais dicas e exemplos.

Clique no botão "  Salvar  " na parte inferior do modal quando terminar. Você sempre pode voltar e editar o texto antes de baixar ou compartilhar seu design.

Um usuário seleciona um ícone em uma tela de design no editor Venngage.  O usuário clica no botão 'Alt Text' que aparece na barra de ferramentas superior.  No modal 'Adicionar texto alternativo', o usuário escreve uma descrição do ícone: 'Um menino sorridente.  Ele está vestindo um uniforme escolar com gravata e uma mochila.'  O usuário clica em Salvar para fechar o modal e salvar o texto alternativo.

 

Os elementos não textuais que transmitem  informações adicionais  sobre o conteúdo do seu design devem ter um texto alternativo descritivo simples e direto. Elementos não textuais complexos, como  tabelas ou outros gráficos que apresentam informações densas,  requerem descrições mais longas  .

Marcar um elemento não textual como decorativo

Elementos não textuais em seu design que não transmitem informações cruciais  devem ser marcados como  decorativos  para que o leitor de tela os ignore e não interrompa o fluxo de leitura do conteúdo.

Com uma imagem selecionada em uma tela de design no Venngage Editor, um usuário clica em 'Alt Text' na barra de ferramentas superior, abrindo o modal pop-up 'Add Alt Text' (caixa).
 

Verifique seu texto alternativo com o verificador de acessibilidade

Abra o  Verificador de Acessibilidade  no menu Arquivo acima da barra de ferramentas superior.

Um usuário clica em 'Arquivo' na barra acima da barra de ferramentas superior no Venngage Editor.  O usuário navega até 'Verificar acessibilidade' e abre um painel lateral direito sobre o Editor.  O painel lateral direito é intitulado Acessibilidade;  ele está aberto em uma das duas guias: 'Verificar acessibilidade'.  O usuário fecha o título 'Título do documento' e clica no título 'Texto alternativo' abaixo dele.  Quando esse cabeçalho está aberto, os elementos visuais (não textuais) na tela de design são destacados por caixas delimitadoras e marcados com 'texto alternativo' ou rótulos 'decorativos'.

 

Em "  Verificar acessibilidade  ", role a lista para baixo e abra o cabeçalho "  Texto alternativo ".  O Verificador de Acessibilidade destaca todos os elementos não textuais na tela de design e  sinaliza o conteúdo não textual que não possui texto alternativo  e  não está marcado como decorativo  .

Cada parte do conteúdo não textual  deve ter texto alternativo ou ser marcado como decorativo  .

Um close-up do cabeçalho 'Texto Alternativo' no painel Acessibilidade, na guia 'Verificar Acessibilidade'.  Ele diz: 'Texto alternativo (alt) é uma descrição de conteúdo não textual que pode ser 'lido' por leitores de tela.  O conteúdo não textual inclui imagens, ícones, logotipos, formas, linhas e setas.  Certifique-se de que o conteúdo informativo não textual tenha texto alternativo e o conteúdo não textual que seja pura decoração ou usado apenas para formatação visual esteja marcado como decorativo;  não requer texto alternativo.'  Um link na parte inferior do parágrafo diz 'Saiba mais sobre como escrever um bom texto alternativo e determinar se o conteúdo precisa de texto alternativo.'  Abaixo disso, um cabeçalho diz 'Texto alternativo ausente (1)' e mostra um ícone de uma imagem ao lado de um rótulo 'Imagem: texto alternativo ausente'.  À direita, há um botão para 'Adicionar texto alternativo'.  A seção inferior mostra um triângulo de advertência amarelo e o cabeçalho 'Verificação manual necessária para etiquetas decorativas'.  O texto abaixo diz 'Verifique se os gráficos usados ​​de forma decorativa ou para formatação visual estão marcados como decorativos.'  Abaixo dela, há uma caixa com fundo azul claro e uma caixa de seleção ao lado do título 'Conteúdo decorativo não textual marcado como decorativo'.

 

Adicione texto alternativo a elementos sinalizados clicando em "  Adicionar texto alternativo  " no elemento sinalizado no verificador de acessibilidade ou clicando no elemento na tela de design para selecioná-lo e usando o botão "  Texto alternativo  "  na barra de ferramentas superior  .

Na tela de design, os elementos sem texto alternativo (e  não  marcados como decorativos) aparecerão com uma marca "ALT" cinza em vez de azul (que é exibida quando o texto alternativo é inserido).

Um usuário clica em uma imagem em uma tela de design no Venngage Editor para selecioná-la, depois clica em 'Alt Text' na barra de ferramentas superior e digita o texto descritivo no campo de texto no modal 'Add Alt Text' (caixa) e, em seguida, clica em ' Salvar'.

 

Insira o texto alternativo e salve-o ou marque o elemento como decorativo; quando você fizer isso, o Verificador de Acessibilidade será atualizado automaticamente para refletir a alteração.

Um usuário percorre seu design no Venngage Editor, verificando se todos os elementos não textuais estão corretamente marcados ou descritos com texto alternativo.  O usuário clica na caixa de seleção na parte inferior do cabeçalho 'Texto alternativo' na lista 'Verificar acessibilidade', conforme descrito abaixo.

 

Marque a caixa na parte inferior do cabeçalho "Texto alternativo"  no Verificador de acessibilidade quando a verificação manual do documento estiver concluída, para confirmar se "Conteúdo decorativo não textual está marcado como decorativo".

Observação  : ao adicionar descrições a um elemento não textual,  use a ferramenta Editar ordem de leitura  para garantir que elas apareçam em uma ordem de leitura lógica.

 

Elementos não textuais aparecerão na lista Ordem de leitura no Verificador de acessibilidade, rotulados de acordo com o elemento (por exemplo, 'ícone', 'forma', 'gráfico') e com o texto inserido no campo de texto Descrição do texto alternativo.  Os elementos marcados como decorativos com a ferramenta Alt Text não aparecerão na lista Ordem de leitura.
 

Esse artigo foi útil?

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

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