Verificação HTML: Valor incorreto "none" para o atributo "font-weight" no elemento "g".

Sobre este problema HTML

O atributo de apresentação SVG font-weight controla a espessura ou leveza dos glifos usados para renderizar texto. De acordo com a especificação SVG, este atributo é apenas válido em elementos de conteúdo de texto: <text>, <tspan>, <textPath>, e o obsoleto <tref>. Embora o elemento <g> seja um contentor de uso geral para agrupar elementos SVG, não aceita font-weight como um atributo direto em marcação válida.

O valor "none" agrava o problema porque não é um valor reconhecido para font-weight em qualquer contexto. Os valores permitidos são:

normal (equivalente a 400)
bold (equivalente a 700)
bolder (relativo ao elemento pai)
lighter (relativo ao elemento pai)
Um valor numérico: 100, 200, 300, 400, 500, 600, 700, 800, ou 900

Isto é importante para a conformidade com os padrões e renderização previsível entre navegadores. Embora alguns navegadores possam ignorar silenciosamente atributos ou valores inválidos, depender desse comportamento leva a código frágil. Usar atributos válidos nos elementos corretos garante resultados consistentes e evita erros de validação.

Se precisar aplicar um font-weight a múltiplos elementos de texto dentro de um <g>, use CSS em vez disso. Pode aplicar um estilo através do atributo style no <g>, uma class, ou um bloco <style> inline. O CSS font-weight é herdado, portanto elementos de texto filhos irão adquiri-lo.

Exemplos

Inválido: `font-weight="none"` num elemento `<g>`

<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
  <g font-weight="none">
    <text y="20">Olá</text>
  </g>
</svg>

Isto desencadeia o erro de validação porque <g> não aceita o atributo font-weight diretamente, e "none" não é um valor válido.

Corrigido: `font-weight` no elemento `<text>` com um valor válido

<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
  <g>
    <text y="20" font-weight="bold">Olá</text>
  </g>
</svg>

Corrigido: usando um peso numérico no `<text>`

<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
  <text y="20" font-weight="700">Texto negrito</text>
  <text x="100" y="20" font-weight="400">Texto normal</text>
</svg>

Corrigido: aplicar `font-weight` a um `<g>` através de CSS

Se quiser que todo o texto dentro de um <g> partilhe o mesmo peso, use o atributo style ou uma classe CSS. O font-weight baseado em CSS num <g> é válido porque a herança CSS aplica-se a todo o conteúdo de texto descendente.

<svg viewBox="0 0 300 30" xmlns="http://www.w3.org/2000/svg">
  <g style="font-weight: bold">
    <text y="20">Isto é negrito</text>
    <text x="150" y="20">Também negrito</text>
  </g>
</svg>

Corrigido: usar um bloco `<style>` inline

<svg viewBox="0 0 300 30" xmlns="http://www.w3.org/2000/svg">
  <style>
    .heavy { font-weight: 900; }
  </style>
  <g class="heavy">
    <text y="20">Texto pesado</text>
    <text x="150" y="20">Também pesado</text>
  </g>
</svg>