Verificação HTML: O elemento "big" está obsoleto. Use CSS em vez disso.

Sobre este problema HTML

O elemento <big> era um elemento HTML puramente apresentacional que aumentava o tamanho do texto num nível (semelhante a passar de small para medium, ou medium para large). O HTML5 removeu-o da especificação porque viola o princípio de separar a estrutura do conteúdo da apresentação visual. O HTML deve descrever o significado do conteúdo, enquanto o CSS deve tratar de como aparece.

Usar elementos obsoletos causa vários problemas. Primeiro, a validação do W3C irá falhar, o que pode impactar os padrões de qualidade do código e auditorias SEO. Segundo, embora os navegadores atuais ainda suportem <big> para compatibilidade com versões anteriores, não há garantia de que os navegadores futuros continuem a fazê-lo. Terceiro, o elemento <big> não carrega qualquer significado semântico — não diz às tecnologias assistivas porquê o texto é maior, apenas que deve ser exibido de forma diferente. O CSS dá-lhe controlo mais preciso sobre o dimensionamento da fonte, mantendo o seu HTML limpo e em conformidade com os padrões.

Para corrigir este problema, substitua cada elemento <big> por um <span> (ou outro elemento semanticamente apropriado) e aplique CSS para controlar o tamanho da fonte. Pode usar estilos inline, um bloco <style>, ou uma folha de estilos externa.

Se o texto maior tem um significado específico — como enfatizar importância — considere usar um elemento semântico como <strong> ou <em> em vez disso, e estilize-o com CSS conforme necessário.

Exemplos

❌ Obsoleto: usar o elemento `<big>`

<p>Este é <big>texto importante</big> num parágrafo.</p>

✅ Corrigido: usar um `<span>` com CSS inline

Esta é uma substituição direta que imita o comportamento original do <big>, que renderizava texto com font-size: larger:

<p>Este é <span style="font-size: larger;">texto importante</span> num parágrafo.</p>

✅ Corrigido: usar uma classe CSS

Para melhor manutenibilidade, use uma classe em vez de estilos inline:

<style>
  .text-big {
    font-size: larger;
  }
</style>

<p>Este é <span class="text-big">texto importante</span> num parágrafo.</p>

✅ Corrigido: usar um elemento semântico com CSS

Se o texto é maior porque é importante ou enfatizado, use um elemento semântico e estilize-o:

<style>
  .highlight {
    font-size: 1.25em;
  }
</style>

<p>Este é <strong class="highlight">texto importante</strong> num parágrafo.</p>

Escolher um valor para `font-size`

O elemento <big> historicamente correspondia a font-size: larger, mas com CSS você tem total flexibilidade:

font-size: larger — aumento relativo, mais próximo do comportamento original do <big>
font-size: 1.2em — escalona para 120% do tamanho da fonte do elemento pai
font-size: 1.25rem — escalona relativamente ao tamanho da fonte raiz
font-size: 20px — valor absoluto em pixeis (menos flexível, geralmente evitar)

Usar unidades relativas como em, rem, ou a palavra-chave larger é preferível porque escalonam bem em diferentes tamanhos de ecrã e respeitam as preferências de tamanho de fonte do utilizador.