Acessibilidade: Padrões de Texto Alt para Imagens de Produto

Publicado em June 8, 2024

O que é o Texto Alt e Porque é Importante?

O texto alternativo (ou “texto alt”) é uma descrição escrita de uma imagem que está incorporada no código HTML. Serve a três propósitos críticos:

  1. Acessibilidade: Os leitores de ecrã anunciam o texto alt aos utilizadores com deficiências visuais, permitindo-lhes compreender o conteúdo de uma imagem.
  2. SEO: Motores de busca como o Google usam o texto alt para entender do que se trata uma imagem, o que ajuda as suas imagens de produto a classificar-se no Google Imagens.
  3. Imagens Quebradas: Se uma imagem não carregar, o navegador exibirá o texto alt no seu lugar, fornecendo contexto ao utilizador.

Para um site de e-commerce, um texto alt bem escrito não é apenas um requisito técnico; é uma ferramenta para uma melhor experiência do cliente e maior visibilidade de pesquisa.

A Anatomia de um Bom Texto Alt para Produtos

Um bom texto alt é conciso, mas descritivo. Deve transmitir a mesma informação que uma pessoa com visão obteria da imagem.

Um padrão simples a seguir é: [Nome do Produto] - [Tipo de Foto] - [Detalhes Chave]

Elementos Chave a Incluir:

  • Identidade do Produto: Declare claramente o que é o produto. Use o nome oficial do produto.
  • Tipo de Foto: É sobre um fundo branco? Uma foto de estilo de vida? Um close-up de uma característica?
  • Detalhes Importantes: Mencione informações visuais chave como cor, material, textura ou uma característica específica que está a ser destacada.
  • Contexto: Se o produto está a ser usado, descreva a ação (por exemplo, “Uma pessoa usando as botas de caminhada de camurça num trilho rochoso”).

O que Evitar:

  • Começar com “Imagem de…” ou “Foto de…”: Os leitores de ecrã já anunciam que é uma imagem.
  • Enchimento de Palavras-chave: Não liste apenas palavras-chave (por exemplo, alt="bota sapato caminhada barato comprar agora"). Isto prejudica tanto a acessibilidade como o SEO.
  • Deixá-lo Vazio: Um atributo alt="" vazio diz aos leitores de ecrã para ignorarem a imagem. Faça isto apenas para imagens puramente decorativas, o que as fotos de produtos não são.

Padrões e Exemplos Práticos de Texto Alt

Aqui estão alguns padrões prontos a usar para diferentes tipos de fotos de produtos.

1. A Foto de Estúdio Padrão (Fundo Branco)

Esta é a imagem de produto mais comum. O objetivo é descrever o produto claramente.

  • Padrão: [Nome do Produto] mostrado do [Ângulo].
  • Exemplo: alt="Caneca de Café Isolada NeatForge mostrada de frente."
  • Bom: alt="Uma caneca de viagem de aço inoxidável de 12oz com uma tampa flip-top preta."
  • Mau: alt="caneca"

Se o seu produto tiver várias variantes de cor, seja específico.

  • Exemplo: alt="A Mochila 'Explorer' em verde floresta."

2. A Foto de Estilo de Vida ou Em Contexto

Esta imagem mostra o produto em uso. O contexto é tão importante quanto o próprio produto.

  • Padrão: [Pessoa/Cenário] [Ação] com o [Nome do Produto].
  • Exemplo: alt="Um caminhante a descansar num tronco, a beber da Caneca de Café Isolada NeatForge."
  • Bom: alt="Close-up das mãos de uma pessoa a digitar no teclado mecânico 'Pro-Type', com a retroiluminação RGB visível."
  • Mau: alt="pessoa com teclado"

3. A Foto de Close-Up / Detalhe

Esta imagem destaca uma característica, material ou textura específicos.

  • Padrão: Close-up da [Característica] no [Nome do Produto], mostrando o [Detalhe].
  • Exemplo: alt="Close-up do cabo USB-C entrançado do teclado 'Pro-Type', mostrando o conector reforçado."
  • Bom: alt="Foto de detalhe do logótipo de couro costurado na Mochila 'Explorer'."
  • Mau: alt="logótipo"

4. A Foto de Escala ou Comparação

Esta imagem mostra o produto ao lado de outro objeto para dar uma noção do seu tamanho.

  • Padrão: O [Nome do Produto] mostrado ao lado de um [Objeto Comum] para ilustrar o seu tamanho.
  • Exemplo: alt="O mini 'Pocket Drone' mostrado ao lado de um smartphone para ilustrar o seu tamanho compacto."

Lista de Verificação Final

Antes de guardar a sua listagem de produto, passe por esta rápida lista de verificação para cada imagem:

  • O texto alt descreve a imagem com precisão?
  • Menciona o nome do produto?
  • É conciso (idealmente com menos de 125 caracteres)?
  • Está livre de jargão e enchimento de palavras-chave?
  • Se não pudesse ver a imagem, o texto alt dar-lhe-ia uma ideia clara do que é?

Escrever um bom texto alt é um pequeno esforço que paga enormes dividendos em acessibilidade e SEO. Ao torná-lo uma parte padrão do seu processo de listagem de produtos, você cria uma experiência melhor para todos os utilizadores.

Advertisement

Guias Relacionados