{"id":1979,"date":"2023-03-17T17:59:20","date_gmt":"2023-03-17T20:59:20","guid":{"rendered":"http:\/\/blog.handtalk.me\/?p=1979"},"modified":"2024-03-20T15:56:37","modified_gmt":"2024-03-20T18:56:37","slug":"texto-alternativo-alt","status":"publish","type":"post","link":"https:\/\/www.handtalk.me\/br\/blog\/texto-alternativo-alt\/","title":{"rendered":"Texto alternativo: o que \u00e9, como elaborar e adicionar Alt Text"},"content":{"rendered":"\n

O texto alternativo \u00e9 um elemento muito importante para a composi\u00e7\u00e3o de qualquer imagem. Seja em sites ou em redes sociais, <\/span>ele \u00e9 essencial para garantir mais acessibilidade para pessoas cegas ou que dependem de leitores de tela<\/b>. <\/span><\/p>\n\n\n\n

O que \u00e9 texto alternativo?<\/span><\/h2>\n\n\n\n

Imagine que voc\u00ea esteja de olhos fechados e esteja navegando pela web contando apenas com a sua audi\u00e7\u00e3o. Voc\u00ea ir\u00e1 descobrir tudo que existe na p\u00e1gina que est\u00e1 acessando por meio de leitores de tela, que fazem a leitura do c\u00f3digo do site. Ler textos \u00e9 f\u00e1cil, mas o que acontece quando a ferramenta se depara com uma imagem? Ou ela vai te avisar que existe uma imagem ali, mas voc\u00ea nunca conseguir\u00e1 saber do que se trata, ou ir\u00e1 te descrever a imagem com base em textos alternativos.<\/span><\/p>\n\n\n\n

O texto alternativo, tamb\u00e9m conhecido como alt text, alt tags ou descri\u00e7\u00f5es alt,<\/span> \u00e9 utilizado para descrever o conte\u00fado de uma imagem.<\/b> Ele aparece no lugar da imagem quando ela n\u00e3o consegue ser carregada. Ainda, ele permite que os mecanismos de pesquisa rastreiem e classifiquem seu site de uma melhor forma. Por \u00faltimo, e n\u00e3o menos importante, o texto alternativo \u00e9 a maneira como <\/span>os leitores de tela<\/span><\/a> conseguem descrever imagens.<\/span><\/p>\n\n\n\n

O que \u00e9 texto alternativo no Instagram, Facebook e LinkedIn?<\/span><\/h3>\n\n\n\n

Nas redes sociais, como Instagram, Facebook e LinkedIn, <\/span>o texto alternativo funciona da mesma forma<\/b>, descrevendo o conte\u00fado das imagens. Normalmente, a fun\u00e7\u00e3o de alt text <\/span>est\u00e1 presente nas configura\u00e7\u00f5es de acessibilidade dessas redes<\/b>, mas vamos falar disso mais a fundo daqui a pouco. <\/span><\/p>\n\n\n\n

\u00c9 importante ressaltar que o texto alternativo n\u00e3o \u00e9 exatamente a mesma coisa da <\/span>#PraCegoVer,<\/span><\/a> apesar de cumprirem fun\u00e7\u00f5es bem parecidas! As descri\u00e7\u00f5es alt ainda precisam ser inseridas nas imagens de qualquer forma, para poderem ser reconhecidas pelos leitores de tela.<\/span><\/p>\n\n\n\n

Qual o objetivo do texto alternativo?<\/span><\/h2>\n\n\n\n

Al\u00e9m de auxiliar o usu\u00e1rio em situa\u00e7\u00f5es, como um erro no carregamento da imagem devido a uma conex\u00e3o ruim ou at\u00e9 um erro na url da imagem, o texto alternativo \u00e9 tamb\u00e9m <\/span>de suma import\u00e2ncia para as pessoas com defici\u00eancia visual<\/b>. Visto que \u00e9 pela descri\u00e7\u00e3o da imagem que as pessoas cegas conseguem identificar do que se trata o \u201cgr\u00e1fico\u201d (nome dado pelos leitores de tela para sinalizar que naquele local existe uma imagem, mesmo quando n\u00e3o existe o atributo alt na tag <img>).<\/span><\/p>\n\n\n\n

\u00c9 isso mesmo! <\/span>Quando n\u00e3o colocamos um alt em nossa tag, as pessoas com defici\u00eancia visual sabem que existe uma imagem no conte\u00fado do seu site<\/b>, por\u00e9m, n\u00e3o sabem do que se refere, o que traz <\/span>uma experi\u00eancia muito ruim para a pessoa usu\u00e1ria<\/span><\/a>.<\/span><\/p>\n\n\n\n

Por que o texto alternativo \u00e9 importante para SEO de imagens?<\/span><\/h3>\n\n\n\n

Certo, sabemos que o alt \u00e9 um atributo obrigat\u00f3rio, indispens\u00e1vel, e que n\u00e3o se deve nem discutir sobre n\u00e3o utiliz\u00e1-lo. Mas como isso funciona?<\/span><\/p>\n\n\n\n

Da mesma forma que as tecnologias assistivas<\/a> conseguem ler sites, os mecanismos de busca tamb\u00e9m. \u00c9 a\u00ed que SEO entra. O alt text \u00e9 lido pelo Google e ajuda muito na indexa\u00e7\u00e3o do site. Inclusive, <\/span>podemos trabalhar as palavras-chaves no pr\u00f3prio texto alternativo para ajudar na otimiza\u00e7\u00e3o dos buscadores<\/span><\/a>.<\/span><\/p>\n\n\n\n

Quando se cria um conte\u00fado com o foco em acessibilidade<\/a>, j\u00e1 estamos realizando uma otimiza\u00e7\u00e3o para os motores de busca<\/b>, o chamado SEO (Search Engine Optimization).<\/span><\/p>\n\n\n

\n
\"\"<\/a><\/figure><\/div>\n\n\n

Como elaborar um texto alternativo?<\/span><\/h2>\n\n\n\n

Criar um texto alternativo pode parecer dif\u00edcil para quem nunca teve que fazer isso antes, mas \u00e9 mais simples do que parece. Primeiro, voc\u00ea precisa se fazer algumas perguntas:<\/span><\/p>\n\n\n\n