Qual é o melhor formato de vídeo para a web?
| Formato | Codec de vídeo / áudio | Reproduz em | Tamanho do arquivo | Use para |
|---|---|---|---|---|
| MP4 | H.264 / AAC | Todos os navegadores e dispositivos | Referência | O padrão e o fallback |
| WebM | VP9 / Opus | Todos os principais navegadores atuais | Muitas vezes cerca de 30% menor | Fonte principal no seu próprio site |
| MP4 ou WebM | AV1 / Opus ou AAC | Chrome, Firefox, Edge; Safari com hardware AV1 | O menor | Sites de alto tráfego que podem codificar duas vezes |
| MOV, AVI, MKV | Vários | Não de forma confiável nos navegadores | — | Converta antes de publicar em um site |
Resposta curta: codifique em MP4 (H.264, AAC) para que o vídeo rode em qualquer lugar e adicione antes uma fonte WebM (VP9) para os navegadores que podem usar o arquivo menor. Para YouTube, Vimeo ou redes sociais, basta o MP4.
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.
Exemplo ilustrativo com um clipe 1080p de 30 segundos (os tamanhos reais dependem do conteúdo):
| Formato | Codec | Tamanho do arquivo | Qualidade |
|---|---|---|---|
| MP4 | H.264, CRF 23 | ~10 MB | Referência |
| WebM | VP9, CRF 30 | ~6 MB | Semelhante |
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: versões recentes — 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: aproximadamente comparável 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
- Áudio Opus 128k: alta qualidade de áudio para a maioria dos conteúdos
- -b:v 0: codificação puramente baseada em qualidade (sem limite de bitrate)
- yuv420p, dimensões pares: cor 4:2:0 de 8 bits que todo decodificador VP9 reproduz; largura e altura são arredondadas para números pares
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. Comprime melhor que o VP9, mas codifica muito mais devagar. Suporte de navegadores: Chrome 70+, Firefox 67+ e Safari 17+ em dispositivos com decodificação AV1 por hardware. 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.
Formato de vídeo vs codec: qual é a diferença?
Um formato de vídeo (contêiner) é o invólucro do arquivo: MP4, WebM, MOV, MKV. Um codec é a forma como as imagens e o som dentro dele são comprimidos: H.264, VP9, AV1, AAC, Opus.
Os navegadores precisam que os dois sejam compatíveis: um MP4 com H.264 roda em qualquer lugar, mas um MP4 com H.265 pode não rodar. Quando um guia diz “use MP4”, quer dizer MP4 com vídeo H.264 e áudio AAC.