GIF o video? GIF, MP4/WebM e WebP animato per brevi animazioni

Per brevi animazioni su un sito web, un video MP4 o WebM muto e in ciclo è di solito la scelta migliore: è in genere molte volte più leggero dello stesso GIF e mostra tutti i colori. Il WebP animato sta nel mezzo — un file immagine a colori pieni, con trasparenza, che tutti i principali browser attuali mostrano. Il GIF resta il formato per i luoghi che non riproducono video e magari non mostrano WebP: newsletter via e-mail, molti strumenti di chat e di ticket, e sistemi di documentazione che accettano solo immagini.

Questo confronto esamina i candidati — GIF, video MP4/WebM, WebP animato e, brevemente, PNG animato (APNG) — per peso, qualità, colori, audio, riproduzione automatica e supporto, e mostra come passare dall’uno all’altro nel Suo browser. Descrive i formati in generale; il peso effettivo dipende sempre dal contenuto e dalle impostazioni.

GIF, video, WebP animato e APNG in sintesi

Peso e qualità: perché il video è di solito molto più leggero

La differenza sta nel modo in cui ogni formato comprime il movimento. Il GIF comprime ogni fotogramma senza perdita, con una tavolozza di al massimo 256 colori; un encoder può memorizzare solo l’area cambiata, ma ogni pixel cambiato viene memorizzato per intero. I codec video come H.264, VP9 o AV1 prevedono ogni fotogramma da quelli precedenti e memorizzano solo la differenza restante, con perdita. Per riprese reali o una registrazione dello schermo con scorrimento, un video risulta così di solito molte volte più leggero — e più bello.

Anche la qualità è diversa. Il GIF deve tradurre sfumature e incarnati in motivi a punti. Il video mostra tutti i colori, ma con un’impostazione di qualità bassa può sfocare testo nitido e linee sottili. Il WebP animato può essere senza perdita per grafiche d’interfaccia o con perdita per contenuti simili a foto, e mantiene una trasparenza morbida. L’APNG è senza perdita e a colori pieni — pulito, ma spesso pesante; si addice più a piccole grafiche trasparenti che alle riprese. I formati in sé sono confrontati in WebP, AVIF, JPEG o PNG.

Riproduzione automatica, cicli e audio su un sito web

Un GIF o un WebP animato si comporta come un’immagine: parte appena caricato, gira tante volte quante prevede il file, e chi legge non ha un pulsante di pausa. Un video è un elemento che controlla Lei. Per un ciclo simile a un GIF, il markup abituale è un video muto che parte da solo — i browser consentono in genere la riproduzione automatica solo senza audio:

<video autoplay muted loop playsinline poster="demo-poster.jpg" width="640" height="360">
  <source src="demo.webm" type="video/webm">
  <source src="demo.mp4" type="video/mp4">
</video>

muted rende possibile la riproduzione automatica, playsinline evita che i telefoni aprano il video a schermo intero, e poster mostra un’immagine fissa finché il video non parte — Estrai fotogrammi ne crea una. Aggiunga controls o un proprio pulsante di pausa quando il ciclo dura più di qualche secondo: il criterio di successo 2.2.2 delle WCAG 2.2 (livello A) chiede un modo per mettere in pausa, fermare o nascondere un contenuto in movimento che parte automaticamente, dura più di cinque secondi e compare accanto ad altri contenuti — veda Understanding «Pause, Stop, Hide» su w3.org (in inglese).

E-mail, chat e documentazione: dove il video spesso non funziona

Fuori dal Suo sito, è il programma di chi riceve a decidere cosa viene riprodotto:

• Newsletter via e-mail. Il video viene riprodotto di rado in un programma di posta, e anche il WebP animato non è affidabile. Un GIF animato è ampiamente mostrato, anche se alcuni programmi ne mostrano solo il primo fotogramma. Lo tenga leggero, metta il messaggio nel primo fotogramma, oppure usi un’immagine fissa che rimanda a una pagina con il video.
• Chat e app di messaggistica. Molte accettano GIF e brevi video, ma possono convertire o ricomprimere ciò che invia; il comportamento varia da un’app all’altra e cambia con gli aggiornamenti.
• Documentazione, wiki e sistemi di ticket. Molti accettano immagini ma non video, o riproducono video solo tramite un lettore incorporato. Un breve GIF funziona ovunque; dove il video è accettato, è più leggero.
• Il Suo sito o negozio online. Controlla Lei il markup, quindi un ciclo MP4/WebM muto o un WebP animato è di solito meglio di un GIF — una demo di prodotto su una pagina del negozio si carica più in fretta come breve video.

Convertire tra GIF e video nel browser

SchweizerIMG ha uno strumento per ogni direzione. Entrambi funzionano nel Suo browser: il video e i fotogrammi vengono elaborati sul Suo dispositivo e mai caricati — veda la pagina sicurezza.

• Da video a GIF trasforma una breve clip in un GIF, WebP o PNG animato (APNG). Scelga la parte (inizio e fine in secondi), i fotogrammi al secondo, la larghezza — vuoto: quella del video, al massimo 480 pixel –, la velocità e il numero di riproduzioni. Per il GIF, le impostazioni del formato regolano colori, retinatura e tavolozza.
• Da GIF a video converte un GIF, WebP o PNG animato in un video MP4 o WebM con gli stessi tempi. Automatico sceglie MP4 (H.264) se il Suo browser può crearlo, altrimenti WebM. Imposti una qualità o un bitrate, quante volte l’animazione si ripete nel video e lo sfondo per le aree trasparenti — i video non contengono trasparenza.
• L’Editor di GIF e animazioni accorcia, ritaglia, ridimensiona e alleggerisce un’animazione che deve restare un GIF — veda ridurre la dimensione di un GIF.
• Estrai fotogrammi salva singoli fotogrammi di un video o di un’animazione, per un’immagine di anteprima o un’immagine sostitutiva nelle e-mail.

Gli strumenti video richiedono un browser recente in grado di codificare e decodificare video (WebCodecs). I formati che può creare variano da un browser all’altro, e dove l’MP4 non è disponibile viene usato WebM — veda browser supportati. I lavori video vengono eseguiti uno alla volta. La durata massima della clip letta dagli strumenti video dipende dal piano; quali piani includono Da video a GIF e Da GIF a video è indicato nella pagina dei prezzi.

Come scegliere il formato giusto

• Immagine principale o demo di prodotto sul Suo sito: un ciclo MP4/WebM muto con immagine di anteprima.
• Piccolo ciclo d’interfaccia sul Suo sito: un video, o un WebP animato se serve trasparenza o deve comportarsi come un’immagine.
• Newsletter via e-mail: un piccolo GIF con il messaggio nel primo fotogramma — o un’immagine fissa che rimanda al video.
• Chat, ticket e wiki che accettano solo immagini: un GIF, accorciato e con pochi colori.
• Animazione su sfondi che cambiano: WebP animato o APNG; il GIF dà bordi duri, il video nessuna trasparenza.
• Tutto ciò che ha audio: un video — nessun formato immagine trasporta l’audio.

Domande frequenti

L’MP4 è sempre più leggero del GIF?

Di solito, non sempre. Per riprese reali e registrazioni dello schermo, il video è in genere molte volte più leggero. Una minuscola animazione di un’icona con pochi fotogrammi a tinte piatte può essere altrettanto leggera come GIF. Converta e confronti: il risultato mostra quale file pesa meno.

Posso inserire un video MP4 in una newsletter via e-mail?

Può allegarlo, ma la maggior parte dei programmi di posta non riproduce un video nel messaggio. La soluzione abituale è un GIF animato, o un’immagine fissa che rimanda a una pagina con il video.

Convertire un GIF in video mantiene la trasparenza?

No. I video creati con Da GIF a video non hanno trasparenza: le aree trasparenti vengono riempite con il colore di sfondo scelto. Se Le serve la trasparenza, mantenga l’animazione in WebP o APNG.

Perché ho ottenuto un file WebM invece di un MP4?

Con Automatico, lo strumento crea un MP4 (H.264) se il Suo browser può farlo, altrimenti un WebM — non tutti i browser sanno codificare H.264. Il WebM viene riprodotto dalle versioni attuali dei principali browser; se Le serve un MP4, provi un altro browser.

Apra gli strumenti per animazioni, consulti i formati immagine supportati, oppure crei un account gratuito.