Como adicionar fallback src ao elemento picture

A marcação picture deve terminar com um elemento img que inclua URL fallback no atributo src.

Antes de começar

Revise os formatos e condições listados e identifique qual versão terá melhor compatibilidade.

Passo a passo

1. Inclua um img final com src, alt e dimensões; teste a fonte moderna e a alternativa.

<picture>
  <source srcset="/imagens/equipe.avif" type="image/avif">
  <source srcset="/imagens/equipe.webp" type="image/webp">
  <img src="/imagens/equipe.jpg" alt="Equipe reunida em uma mesa de trabalho" width="1200" height="800">
</picture>

O navegador escolhe o primeiro source compatível; se nenhum puder ser usado, renderiza o img. Ajuste alt ao conteúdo e use as dimensões intrínsecas reais para reservar espaço.

2. Desative ou torne falsa a condição principal e confirme que o fallback carrega.

Limites e cuidados

Não deixe o img fallback sem texto alternativo adequado ao uso.

Continue na biblioteca

Fonte oficial: SEO de imagens — Google Search Central.