SP.Gov.br
sp.gov.br
Z6_086423G03HMOD06D1V77Q52S87
Z7_086423G03HMOD06D1V77Q52S17
Informação.Leitor de tela é uma funcionalidade que lê em voz alta tudo o que está na tela. Ele é muito importante para pessoas cegas ou com baixa visão e também pode ser usado para pessoas não letradas.
Z7_086423G03P6OD06D7HU655OCU3

Z7_086423G03HMOD06D1V77Q52SI1

Texto alternativo

Aprenda a tornar acessíveis todas as imagens do seu site

Z7_086423G03HMOD06D1V77Q52S64

Texto alternativo é uma descrição simples de uma imagem em plataformas digitais, que substitui ou complementa seu conteúdo, e que é lido por leitores de tela.

Leitor de tela é uma funcionalidade que lê em voz alta tudo o que está na tela. Ele é muito importante para pessoas cegas ou com baixa visão e também pode ser usado para pessoas não letradas.

Z7_086423G03P6OD06D7HU65502E5

Os textos alternativos garantem acessibilidade e inclusão digital, garantindo que mais pessoas compreendam o conteúdo transmitido por imagens. Eles também melhoram a usabilidade em caso de falha no carregamento de imagens ou conexões lentas e ainda facilitam a indexação de imagens em motores de busca (SEO).

 

  • Saiba quando usar

Textos alternativos são importantes para descrever imagens com valor informativo, gráficos, mapas com dados e botões com imagens, como banners. Exemplo: Homem faz sinal em Libras ao lado do texto “São Paulo São Libras: Acesse um intérprete de libras ao vivo, a qualquer hora!”

Já imagens decorativas e ícones que servem como reforço cognitivo, não são necessários. Nesse caso, use: alt=""

 

  • Seja objetivo

Descreva o conteúdo e o propósito da imagem em até 125 caracteres. Se precisar de mais detalhes, use descrições estendidas com o comando longdesc ou incorpore o texto em uma legenda abaixo da imagem.

Para facilitar, indique quem, o quê, onde e quando, se for relevante, e por quê, se for aplicável.

 

  • Adapte o texto alternativo ao contexto

A mesma imagem pode ter textos alternativos diferentes dependendo do objetivo. Tente entender o que a imagem representa naquele conteúdo específico, como neste exemplo: se estiver em um site de serviços do governo, o texto pode ser “Jovem confiante em fazer um serviço digital”; mas em um site de eventos, pode ser “Jovem feliz conferindo as atrações da semana pelo celular”.

 

  • Siga as recomendações


Fazer

  • Repita textos escritos na imagem
  • Se for o caso, indique a emoção transmitida pela imagem, como nesse exemplo: Mulher sorri vendo em seu celular a notificação ‘Não há débitos vinculados ao seu CPF’.

  • Descreva a ação de elementos interativos, como o ícone do exemplo abaixo: Botão para buscar serviços


Não fazer

  • Não faça descrições genéricas, como “gráfico” ou “banner”
  • Não use “Foto de…”, a menos que seja relevante, como ao diferenciar uma fotografia de uma imagem gerada por inteligência artificial
  • Não repita informações que estão no texto
  • Evite adjetivos ou detalhes visuais desnecessários
Complementary Content
${loading}