Verificação HTML: O atributo "longdesc" no elemento "iframe" está obsoleto. Use um elemento "a" comum para criar uma ligação para a descrição.

Sobre este problema HTML

O atributo longdesc foi originalmente concebido para apontar para um URL contendo uma descrição detalhada do conteúdo de um elemento, principalmente como uma funcionalidade de acessibilidade para utilizadores de leitores de ecrã. Em elementos <iframe>, destinava-se a descrever o conteúdo enquadrado para utilizadores que não conseguissem percebê-lo diretamente. No entanto, o atributo foi mal implementado nos navegadores, raramente utilizado por tecnologias assistivas, e foi eventualmente removido da especificação HTML para elementos <iframe>.

Utilizar atributos obsoletos causa erros de validação W3C e pode criar uma falsa sensação de acessibilidade. Uma vez que os navegadores e tecnologias assistivas não processam de forma fiável o longdesc em iframes, os utilizadores que precisam da descrição podem nunca conseguir aceder à mesma. Uma ligação visível, por outro lado, é universalmente acessível — funciona para todos os utilizadores independentemente do seu navegador, dispositivo ou tecnologia assistiva.

A correção é direta: remova o atributo longdesc do <iframe> e coloque um elemento <a> comum perto do iframe que crie uma ligação para a página de descrição. Esta abordagem é mais robusta porque a ligação é visível, descobrível e funciona em todo o lado.

Exemplos

❌ Obsoleto: usar `longdesc` num `<iframe>`

<iframe src="report.html" title="Annual report" longdesc="report-description.html"></iframe>

Isto desencadeia o erro de validação porque longdesc já não é um atributo válido em <iframe>.

✅ Corrigido: usar uma ligação visível

<iframe src="report.html" title="Annual report"></iframe>
<p>
  <a href="report-description.html">Read a detailed description of the annual report</a>
</p>

O atributo longdesc é removido, e uma ligação descritiva é colocada junto ao iframe para que todos os utilizadores possam aceder à mesma.

✅ Alternativa: envolver num `<figure>` para melhor semântica

Para uma abordagem mais estruturada, pode usar um elemento <figure> com um <figcaption> para associar a ligação de descrição com o iframe:

<figure>
  <iframe src="report.html" title="Annual report"></iframe>
  <figcaption>
    Annual report overview.
    <a href="report-description.html">Read the full description</a>.
  </figcaption>
</figure>

Isto agrupa o iframe e a sua legenda semanticamente, tornando a relação entre eles clara tanto para utilizadores visuais como para tecnologias assistivas.

✅ Alternativa: usar `aria-describedby` para contexto adicional

Se quiser fornecer uma descrição breve inline que as tecnologias assistivas possam anunciar automaticamente, pode usar aria-describedby:

<p id="report-desc">
  This iframe contains the interactive annual report for 2024.
  <a href="report-description.html">Read the full description</a>.
</p>
<iframe src="report.html" title="Annual report" aria-describedby="report-desc"></iframe>

Isto liga o iframe ao parágrafo descritivo programaticamente. Os leitores de ecrã irão anunciar o conteúdo do elemento referenciado quando o iframe receber foco, enquanto a ligação visível permanece disponível para todos os utilizadores.

Pontos-chave

Inclua sempre um atributo title em elementos <iframe> para descrever o seu propósito — esta é uma prática importante de acessibilidade básica.
Substitua longdesc por um elemento <a> visível que crie uma ligação para a descrição longa.
Coloque a ligação perto do iframe para que os utilizadores a possam encontrar facilmente.
Considere usar <figure> e <figcaption> ou aria-describedby para uma associação semântica mais forte entre o iframe e a sua descrição.