Por que o tamanho do vídeo importa para sites
Vídeo é um dos maiores ativos na maioria das páginas web. Um vídeo de destaque ou clipe de fundo mal otimizado pode adicionar megabytes ao peso da página, impactando diretamente:
- LCP (Largest Contentful Paint): se o vídeo for o maior elemento, seu tempo de carregamento determina essa métrica Core Web Vital
- Custos de largura de banda: servir MP4s de 10 MB a milhões de visitantes se acumula rapidamente
- Experiência móvel: usuários em conexões celulares sofrem mais com arquivos de vídeo grandes
- Ranking de SEO: o Google usa Core Web Vitals como sinal de ranqueamento
WebM + VP9 vs MP4 + H.264 para a web
Com qualidade visual idêntica (SSIM/VMAF equivalentes), WebM com codificação VP9 produz arquivos 30–50% menores que MP4 com H.264. Para um site servindo 100 GB de vídeo MP4 por mês, mudar para WebM pode economizar 30–50 GB de largura de banda.
Comparação real no mesmo clipe 1080p de 30 segundos:
| Formato | Codec | Tamanho do arquivo | Qualidade (VMAF) |
|---|---|---|---|
| MP4 | H.264, CRF 23 | 10 MB | 94.2 |
| WebM | VP9, CRF 30 | 6 MB | 94.1 |
Compatibilidade de navegadores em 2026
WebM VP9 é suportado por 97%+ dos navegadores globais em 2026:
- Chrome: desde a versão 29 (2013)
- Firefox: desde a versão 28 (2014)
- Edge: desde a versão 14 (baseado em Chromium desde 79)
- Safari: desde a versão 16.6 (2023) — o último grande retardatário
Apenas o IE11 e versões muito antigas do Safari não têm suporte, representando participação de mercado insignificante em 2026.
O padrão de fallback HTML5 Video
A abordagem recomendada é servir WebM primeiro com MP4 como fallback usando o elemento HTML5 <source>:
<video autoplay loop muted playsinline>
<source src="video.webm" type="video/webm">
<source src="video.mp4" type="video/mp4">
</video>
O navegador baixa e reproduz a primeira fonte que suporta. Como 97%+ dos navegadores suportam WebM, a grande maioria dos visitantes recebe o arquivo menor. O fallback MP4 garante que os ~3% restantes ainda vejam o vídeo.
Os atributos autoplay loop muted playsinline fazem o vídeo se comportar como um GIF — reprodução automática, em loop, silencioso e em linha no Safari móvel.
Impacto no Core Web Vitals
Mudar de MP4 para WebM melhora diretamente as métricas de desempenho web:
- Melhoria do LCP: arquivos menores baixam mais rápido, melhorando o Largest Contentful Paint
- Menor largura de banda: melhor experiência móvel, especialmente em conexões lentas
- Recomendação do Google: Lighthouse e web.dev recomendam explicitamente formatos de vídeo otimizados
Nossas configurações de codificação VP9
Nosso conversor usa estas configurações VP9, otimizadas para entrega na web:
- CRF 30: equivalente a H.264 CRF 23 em qualidade visual
- cpu-used 3: velocidade de codificação equilibrada para serviço online
- row-mt 1: multithreading baseado em linhas para codificação mais rápida
- Opus 128k áudio: qualidade de áudio transparente, superior ao AAC nessa taxa de bits
- -b:v 0: codificação puramente baseada em qualidade (sem limite de bitrate)
Para uma configuração mais aprofundada do VP9, veja nosso guia de configurações de codificação VP9.
Canal alfa do WebM (transparência)
VP9 em WebM suporta transparência por canal alfa — uma vantagem única sobre H.264/MP4. Isso permite sobreposições de vídeo transparentes em sites: logos animados, personagens, efeitos que se mesclam perfeitamente com qualquer fundo. Use -pix_fmt yuva420p no FFmpeg para codificar com alfa.
AV1: o próximo passo
AV1 é o codec aberto de próxima geração da Alliance for Open Media. Oferece uma melhoria adicional de compressão de 30% sobre o VP9, mas codifica 5–10x mais lento. O suporte de navegadores está crescendo (Chrome 70+, Firefox 67+, Safari 17+). Para sites com uso intenso de vídeo, AV1 é o futuro — mas o VP9 continua sendo a escolha prática em 2026 para a maioria dos casos.