Video di sfondo per sito (HTML5)

Video di sfondo per sito (HTML5): a cosa serve

Un breve video in riproduzione sullo sfondo della parte alta del sito mostra subito l'ambiente, il prodotto o il servizio. Per funzionare su smartphone, il video deve essere senza audio e avere gli attributi muted, autoplay e playsinline.

Il generatore costruisce la sezione con il tag video in MP4 e WebM, immagine di copertina, livello scuro regolabile per rendere leggibile il testo, titolo e testo, e un pulsante di pausa, come richiedono le WCAG per i contenuti che si muovono per più di 5 secondi. Per chi ha chiesto meno movimento, il video parte già in pausa.

Come si usa

1. Indica gli indirizzi del video e dell'immagine di copertina.
2. Scrivi titolo e testo e regola il livello scuro.
3. Copia il codice e incollalo nella parte alta della pagina.

Quando usarlo

• Testata del sito di un ristorante o di un hotel.
• Landing page di un evento.
• Pagina di un'agenzia immobiliare o di una palestra.

Domande frequenti

Perché il video non parte da solo su smartphone?

I browser permettono la riproduzione automatica solo ai video senza audio. Il video ha bisogno degli attributi muted, autoplay e, su iPhone, playsinline, altrimenti si apre a schermo intero o non parte. Il codice include già tutti e tre.

Che dimensione di file usare?

Un video di sfondo deve essere breve (10-20 secondi in loop) e leggero, preferibilmente meno di 3-5 MB, in 720p o 1080p senza audio. Comprimilo prima di pubblicare; un video pesante rallenta il caricamento su smartphone.

E chi preferisce meno movimento?

Per chi ha attivato la riduzione del movimento nel sistema, lo script mette in pausa il video e resta solo l'immagine di copertina. C'è anche un pulsante di pausa, richiesto dalle WCAG per i contenuti che si muovono per più di 5 secondi.

È davvero gratis?

Sì, 100% gratis. Senza registrazione, senza abbonamento e senza limiti d’uso. Tutti gli strumenti di Tools123 sono gratuiti.

Strumenti simili