Regra de acessibilidade: Elementos `<blink>` estão obsoletos e não devem ser utilizados

Sobre esta regra de acessibilidade

O elemento <blink> era usado para chamar atenção ao conteúdo fazendo-o piscar repetidamente. Embora possa ter parecido um efeito chamativo, cria sérias barreiras de acessibilidade para múltiplos grupos de utilizadores. O elemento foi descontinuado da especificação HTML e, apesar de a maioria dos navegadores modernos já não renderizar o efeito piscante, o elemento deve ainda ser removido da sua marcação para garantir conformidade e evitar problemas em qualquer ambiente que ainda possa suportá-lo.

Porque é que isto é um problema de acessibilidade

Conteúdo piscante afeta vários grupos de utilizadores:

Utilizadores com deficiências cognitivas podem achar texto piscante perturbador ou incompreensível. O piscar constante pode tornar muito difícil focar e compreender o conteúdo.
Utilizadores com baixa visão têm dificuldade em ler texto que aparece e desaparece rapidamente. A visibilidade intermitente torna o conteúdo efetivamente ilegível.
Utilizadores com deficiências motoras podem ter dificuldade em clicar em ligações ou botões piscantes, uma vez que o alvo não está consistentemente visível e requer temporização precisa para ativar.
Utilizadores com condições fotossensíveis podem experienciar desconforto ou, em casos extremos, convulsões devido a conteúdo piscante, dependendo da frequência.

Esta regra relaciona-se com o Critério de Sucesso 2.2.2 das WCAG 2.2: Pausar, Parar, Ocultar (Nível A), que exige que para qualquer conteúdo em movimento, piscante ou em deslocamento que inicie automaticamente e dure mais de cinco segundos, os utilizadores devem poder pausá-lo, pará-lo ou ocultá-lo. Uma vez que o elemento <blink> não fornece mecanismo para os utilizadores controlarem o piscar, falha completamente este critério.

Esta regra também se aplica à Secção 508 §1194.22(j), que estabelece que as páginas devem ser desenhadas para evitar fazer o ecrã piscar com uma frequência superior a 2 Hz e inferior a 55 Hz.

Como corrigir

Remova todos os elementos <blink> do seu HTML. Substitua-os por elementos padrão como <span>, <strong> ou <em>.
Remova text-decoration: blink; do seu CSS, pois esta é a equivalente CSS do elemento <blink>.
Use técnicas alternativas de ênfase para fazer o conteúdo destacar-se — texto em negrito, cor, tamanho de fonte maior, bordas, realces de fundo ou ícones.

Importante: Muitos navegadores modernos ignoram silenciosamente o elemento <blink>, pelo que o texto não piscará visualmente mesmo que o elemento esteja presente no código fonte. Não se baseie na aparência da página no navegador para determinar se existem tags <blink>. Verifique sempre o código HTML real.

Exemplos

Incorreto: utilizar o elemento `<blink>`

<p><blink>Promoção Quinta-feira!</blink></p>

Isto faz com que o texto pisque (em navegadores que o suportam), tornando-o inacessível.

Incorreto: utilizar `text-decoration: blink` em CSS

<style>
  .attention {
    text-decoration: blink;
  }
</style>
<h2 class="attention">Oferta por Tempo Limitado!</h2>

O valor CSS text-decoration: blink consegue o mesmo efeito inacessível que o elemento <blink>.

Correto: utilizar ênfase visual estática

<p><strong>Promoção Quinta-feira!</strong></p>

Usar <strong> torna o texto em negrito e transmite ênfase aos leitores de ecrã sem qualquer piscar.

Correto: utilizar CSS para ênfase visual sem piscar

<style>
  .highlight {
    background-color: #fff3cd;
    border-left: 4px solid #ffc107;
    padding: 8px 12px;
    font-weight: bold;
  }
</style>
<p class="highlight">Oferta por Tempo Limitado!</p>

Isto chama atenção ao conteúdo usando cor, uma borda e texto em negrito — tudo sem qualquer piscar, mantendo o conteúdo legível e acessível para todos.

Learn more: