Verificação HTML: Atributo "currency" não permitido no elemento "span" neste ponto.

Sobre este problema HTML

A especificação HTML define um conjunto específico de atributos permitidos para cada elemento. O elemento <span> suporta atributos globais (como id, class, style, title, etc.) mas não reconhece currency como um atributo válido. Quando você adiciona um atributo não padrão como currency a um elemento, o validador W3C sinaliza-o porque não está em conformidade com o padrão HTML.

Este padrão aparece frequentemente em sites de e-commerce, aplicações financeiras, ou contextos de internacionalização onde os programadores querem associar um código de moeda (como USD, EUR, ou GBP) com um preço exibido num <span>. Embora os navegadores normalmente ignorem atributos não reconhecidos sem quebrar a página, usá-los cria vários problemas:

Conformidade com padrões: HTML inválido pode levar a comportamento imprevisível entre diferentes navegadores e versões futuras de navegadores.
Manutenibilidade: Outros programadores (ou ferramentas) não reconhecerão atributos não padrão, tornando o código mais difícil de compreender e manter.
Acessibilidade: Tecnologias assistivas dependem de HTML válido e bem estruturado. Atributos não padrão podem ser ignorados ou mal interpretados.
Interoperabilidade JavaScript: A API HTMLElement.dataset é especificamente concebida para trabalhar com atributos data-*, fornecendo uma forma limpa e padrão de ler dados personalizados de elementos.

A correção é simples: HTML fornece o mecanismo de atributos data-* especificamente para incorporar dados personalizados em elementos. Qualquer atributo prefixado com data- é válido em qualquer elemento HTML, e o seu valor é acessível em JavaScript através da propriedade element.dataset.

Exemplos

❌ Inválido: Atributo `currency` não padrão

<span currency="USD">49.99</span>

Isto despoleta o erro de validação porque currency não é um atributo reconhecido para <span>.

✅ Corrigido: Usando um atributo `data-currency`

<span data-currency="USD">49.99</span>

O atributo data-currency é HTML válido. Em JavaScript, você pode aceder ao seu valor assim:

const span = document.querySelector('span');
console.log(span.dataset.currency); // "USD"

✅ Alternativa: Usando `data-*` com marcação mais rica

Se precisar de transmitir informação mais estruturada, pode combinar múltiplos atributos data-*:

<span class="price" data-currency="EUR" data-amount="29.99">€29.99</span>

✅ Alternativa: Usando microdata ou marcação estruturada

Para SEO e dados legíveis por máquina, considere usar vocabulários estabelecidos como Schema.org:

<span itemscope itemtype="https://schema.org/MonetaryAmount">
  <meta itemprop="currency" content="USD">
  <span itemprop="value">49.99</span>
</span>

Esta abordagem fornece significado semântico que motores de busca e outros consumidores podem compreender, mantendo-se completamente HTML válido.