Video embed con caricamento al clic

Cosa fa un embed normale prima che qualcuno guardi

Il codice che copi dal menu Condividi di un video è un <iframe>, una piccola finestra su un altro sito inserita nella tua pagina. Il browser riempie quella finestra appena disegna la pagina. Per un solo video YouTube sono circa venti richieste e qualche centinaio di kilobyte di script, scaricati dai server di Google per ogni visitatore, compresi tutti quelli che scorrono oltre senza fermarsi.

Ognuna di queste richieste porta con sé l’indirizzo IP del visitatore e l’indirizzo della tua pagina. Il player può anche leggere e scrivere il proprio spazio di archiviazione nel browser. Così la tua pagina diventa più lenta e i tuoi visitatori vengono notati da un’azienda che non hanno mai scelto di contattare.

I due tipi di codice che questo strumento scrive

Caricamento al clic

La tua pagina riceve un link travestito da riquadro video, con un’immagine di anteprima, un triangolo play e un’etichetta accessibile. Un breve script, incluso una sola volta, aspetta un clic su quel link e solo allora lo sostituisce con il vero player con autoplay=1, così sulla maggior parte dei dispositivi basta una sola pressione. Se lo script manca o viene bloccato, il link funziona comunque e apre il video sulla piattaforma in una nuova scheda.

Iframe semplice sul dominio a privacy avanzata

Nessuno script. Il player si carica con la pagina, ma da youtube-nocookie.com, oppure da Vimeo con dnt=1, e con loading="lazy", così un video molto in basso nella pagina aspetta che il visitatore ci arrivi vicino.

In entrambi i casi il player sta in un riquadro dimensionato con la proprietà CSS aspect-ratio, quindi si adatta a qualunque colonna in cui lo metti. Un link /shorts/ viene riconosciuto e riceve un riquadro 9:16 largo al massimo 360 pixel.

L’immagine di anteprima è l’ultima fuga

Per YouTube, il codice con caricamento al clic punta di default alla miniatura del video su i.ytimg.com. Quel server appartiene a Google. Non imposta cookie, ma vede l’indirizzo IP del visitatore quando l’immagine si carica. Per arrivare a zero richieste verso terzi, salva un fotogramma del video, caricalo sul tuo sito e incolla il suo indirizzo nel campo dell’anteprima. Usa un indirizzo https://, perché i browser rifiutano le immagini non sicure nelle pagine sicure.

Vimeo non ha un indirizzo prevedibile per le miniature, quindi lì il default è un riquadro scuro con il tuo titolo. Lo stesso campo dell’anteprima lo sostituisce con un’immagine.

Incollare il codice nel tuo sito

Il risultato è HTML semplice con stili inline, quindi non dipende dal tuo tema.

• WordPress: aggiungi un blocco «HTML personalizzato» e incolla. Gli amministratori possono salvare la parte <script>, ma agli account con ruolo Editore su una rete multisito può essere rimossa al salvataggio. Se succede, l’anteprima resta comunque un link al video, oppure puoi passare all’iframe semplice.
• Squarespace, Wix, Webflow, Shopify: usa il blocco codice o embed, non il blocco video integrato, che riporterebbe subito il player standard.
• HTML statico: incolla dove deve stare il video. Con più video nella stessa pagina, incolla ogni snippet per intero. Lo script controlla se è già stato eseguito.
• Content-Security-Policy: consenti www.youtube-nocookie.com o player.vimeo.com in frame-src. Una policy che vieta gli script inline bloccherà lo script del caricamento al clic, quindi spostalo in un file servito da te.

Compila sempre il campo del titolo. Diventa il title dell’iframe e l’etichetta del link play, ed è quello che legge uno screen reader. Se lo lasci vuoto, chi ascolta sente solo «video YouTube».