O texto alternativo é um dos elementos mais negligenciados, mas com maior impacto, da acessibilidade digital.
Quer esteja a conceber um sítio Web, a escrever um blogue ou a agendar uma publicação nas redes sociais, a adição de texto alternativo atencioso e descritivo faz uma verdadeira diferença para as pessoas que dependem de leitores de ecrã ou de outra tecnologia de assistência.
Mas escrever um texto alternativo eficaz nem sempre é fácil. O que é que diz sobre um gráfico? As imagens dos produtos precisam de ser detalhadas? Quando é que é melhor deixar o texto alternativo em branco?
Neste guia, abordaremos tudo o que precisa de saber sobre as melhores práticas de texto alternativo – com exemplos reais de texto alternativo. Em apenas alguns momentos, estará em melhor posição para escrever descrições de imagens que melhoram a acessibilidade, impulsionam a SEO e cumprem as principais normas de conformidade.
O texto alternativo, abreviatura de “alternative text”, é uma descrição escrita de uma imagem. Normalmente, aparece no código HTML como uma linha de texto visível ao lado da imagem ou como uma descrição mais longa numa página separada acedida através de uma ligação.
O texto alternativo é incrivelmente importante para as pessoas com deficiência visual – fornece-lhe um contexto essencial que, de outra forma, se perderia. Transforma imagens em palavras, tornando o conteúdo mais inclusivo e mais fácil de navegar.
O texto alternativo foi originalmente criado para melhorar a acessibilidade digital, e essa continua a ser a sua função mais importante atualmente. Para os utilizadores cegos e com baixa visão, os leitores de ecrã utilizam texto alternativo para descrever as imagens em voz alta, ajudando-os a navegar e a compreender o conteúdo visual.
Mas o texto alternativo não serve apenas a tecnologia de assistência. Quando bem escrito, também contribui para uma melhor SEO.
Isso deve-se ao facto de os motores de busca não conseguirem “ver” imagens. Dependem do texto alternativo, juntamente com os nomes dos ficheiros, para interpretar o que uma imagem mostra. Isto significa que um texto alternativo relevante, que utilize palavras-chave de forma natural, pode melhorar a classificação das suas páginas nos resultados da pesquisa de imagens.
O melhor texto alternativo é específico, conciso e relevante para o objetivo da imagem. Eis algumas dicas práticas para orientar a sua escrita:
Ao seguir estas práticas recomendadas, criará um texto alternativo que é verdadeiramente útil para os utilizadores. Para ver estes princípios em ação, dê uma vista de olhos aos exemplos de texto alternativo abaixo.
O que o pode surpreender é que nem todo o texto alternativo deve ser escrito da mesma forma.
Porquê? Porque diferentes tipos de imagens exigem abordagens diferentes.
Mas quer esteja a trabalhar com gráficos, conteúdo de redes sociais ou fotografias de produtos, o objetivo é sempre o mesmo: descrever o que importa, de uma forma que esteja ligada ao contexto da imagem e que apoie a experiência do utilizador.
Vamos examinar como abordar a cópia alt para cada tipo de imagem:
Como o nome sugere, as imagens informativas transmitem informações importantes que não estão escritas noutra parte da página.
[Imagem:] Ecrã de um computador portátil que mostra o painel de controlo das definições de privacidade de um utilizador.
Texto alternativo: Painel de controlo das definições de privacidade com opções para rastreio de localização, preferências de marketing e partilha de dados.
Esta descrição centra-se no que é visível e relevante para o contexto da imagem, sem explicar demasiado.
As imagens decorativas não acrescentam conteúdo significativo. Existem apenas para fins estéticos e devem ser ignoradas pelos leitores de ecrã e outras tecnologias de assistência.
[Imagem:] Um padrão de fundo de ondas azuis.
Texto alternativo: alt=”” (vazio)
Utilize um atributo alt nulo, como no exemplo acima, para que a tecnologia de assistência possa ignorar a imagem e seguir em frente.
Os quadros e gráficos transmitem dados complexos, que podem parecer difíceis de condensar num texto alternativo.
A resposta? O seu texto alternativo deve simplesmente resumir a principal conclusão do gráfico ou da tabela.
[Imagem:] Um gráfico de barras que mostra as taxas de envolvimento de banners de cookies por design.
Texto alternativo: Gráfico de barras que mostra que os banners com menos escolhas têm taxas de consentimento mais elevadas do que os banners com opções granulares.
Se houver mais detalhes, pode considerar fornecer uma descrição mais longa no texto próximo ou ligar a uma alternativa de texto.
As imagens dos produtos devem ser descritas com detalhes visuais importantes que ajudem os utilizadores a compreender o que está a ser vendido.
[Imagem:] Um par de auscultadores sem fios sobre um fundo branco.
Texto alternativo: Auscultadores sem fios sobre o ouvido pretos com almofadas almofadadas e banda de cabeça ajustável.
Isto é especialmente importante para a acessibilidade e usabilidade do comércio eletrónico.
As redes sociais não são exceção quando se trata de escrever texto alternativo. Quando partilhar conteúdo visual nos canais sociais, inclua um texto alternativo conciso mas descritivo que descreva a imagem de uma forma relacionada com o contexto da publicação.
[Imagem: Uma equipa reunida em torno de um quadro branco durante uma reunião.
Texto alternativo: Equipa de marketing a debater ideias de campanhas num quadro branco coberto de notas adesivas.
A maioria das plataformas, como o X, o LinkedIn e o Instagram, suporta agora o texto alternativo, pelo que não há desculpa para o ignorar – garantindo que todos na comunidade podem aceder ao seu conteúdo.
Mesmo com as melhores intenções, é fácil enganar-se no texto alternativo. Eis algumas das armadilhas mais comuns – e como evitá-las:
Textos alternativos como “Imagem de um gráfico” ou “Foto de um produto” não oferecem qualquer contexto útil. Seja específico. O que é que o gráfico mostra? De que tipo de produto se trata?
O texto alternativo não é o lugar para ensaios completos. As descrições demasiado detalhadas podem sobrecarregar os utilizadores de leitores de ecrã e interromper o fluxo. Seja breve e simpático – apenas algumas palavras são suficientes ou, no máximo, duas frases claras e direcionadas.
O texto alternativo que está repleto de palavras-chave e não tem uma descrição real não ajuda os utilizadores nem os motores de busca. Lembre-se de se concentrar na clareza em primeiro lugar – quando o texto alternativo é verdadeiramente útil, pode ter a certeza de que os benefícios de SEO virão em breve.
Se a legenda da imagem ou o texto próximo já disserem o mesmo, não precisa de o repetir no texto alternativo. Concentre-se apenas no que a própria imagem acrescenta.
Os botões, ícones e ligações com imagens devem ter um texto alternativo descritivo que explique a sua função, como “Enviar formulário” ou “Descarregar PDF”, e não apenas “seta” ou “ícone”.
Se estiver a gerir conteúdos em diferentes plataformas, certifique-se de que o texto alternativo funciona de forma consistente em todas elas, incluindo em telemóveis e publicações nas redes sociais. A acessibilidade não se deve limitar ao seu sítio Web.
Se evitar estes erros comuns e utilizar as ferramentas certas, estará mais perto de criar uma experiência mais acessível e fácil de utilizar.
Depois de escrever o texto alternativo, como é que sabe que está a funcionar?
É importante testar se o seu texto alternativo funciona na prática, tanto para os leitores de ecrã como para a experiência geral do utilizador.
Eis como testar e melhorar as suas descrições de imagem:
Tente navegar no seu site com um leitor de ecrã como o NVDA (Windows) ou o VoiceOver (macOS). Isto dá-lhe uma visão direta da forma como o seu texto alternativo é lido em voz alta e se faz sentido no contexto.
Desativar imagens no seu browser é uma forma rápida de pré-visualizar o texto alternativo que aparece no lugar de cada imagem. Pode ser uma boa maneira de descobrir descrições que parecem confusas ou redundantes e que precisam de ser editadas.
Utilize ferramentas automatizadas para ajudar a descobrir quaisquer erros que possam afetar os leitores de ecrã, bem como outros problemas de acessibilidade.
Se tiver acesso a testadores que utilizam tecnologia de assistência, o seu feedback é a melhor coisa que pode obter. Pergunte se o seu texto alternativo é útil, conciso e consistente – e ajuste-o com base nas sugestões.
Depois de otimizar o seu texto alternativo, monitorize o tráfego de pesquisa relacionado com imagens na Consola de Pesquisa do Google. Se as suas imagens começarem a aparecer em resultados relevantes, saberá que as suas descrições também estão a funcionar para os motores de busca.
A otimização do texto alternativo é um processo contínuo, mas seguir estes passos ajudá-lo-á a manter-se no caminho certo e a criar uma experiência digital mais inclusiva.
Se o seu objetivo é cumprir as normas de acessibilidade, o texto alternativo não é opcional. As Diretrizes de Acessibilidade para o Conteúdo da Web (WCAG) estabelecem expectativas claras sobre a forma como as imagens devem ser tratadas para apoiar os utilizadores com deficiências visuais, incluindo:
O cumprimento destas normas ajuda-o a criar um sítio mais inclusivo. E também pode ajudar a reduzir o risco legal, especialmente para as organizações que operam em áreas onde as leis de acessibilidade, como a Lei Europeia de Acessibilidade, são aplicadas.
O texto alternativo pode ser um pequeno pormenor, mas tem um grande impacto.
Torna o seu conteúdo mais inclusivo. Ajuda-o a cumprir as normas de acessibilidade. Melhora o SEO.
Mas o mais importante é que melhora a experiência das pessoas reais que dependem da tecnologia de assistência todos os dias.
Seguindo as melhores práticas e evitando os erros comuns descritos acima, pode começar a tornar a acessibilidade uma parte natural do seu processo de conteúdo.
Saiba mais sobre Dê uma vista de olhos ao nosso WayWidget e ajude mais pessoas a aceder ao seu sítio.
