Sfondo Video per il tuo sito Web: come renderlo efficace

Condividi su facebook
Condividi su twitter
Condividi su linkedin
Condividi su whatsapp
Condividi su email
Sfondo Video per il tuo sito Web

La nostra attenzione è calamitata principalmente dagli oggetti in movimento, quindi niente di strano se affermiamo che usare un video come sfondo in homepage possa riuscire ad aumentare la durata della sessione media. È sottointeso che il video in questione deve essere coordinato con il business aziendale, in altre parole, non si può parlare di un ristorante con un parco avventura sullo sfondo! Vediamo subito come conquistare il nostro visitatore con pochi (ma importanti) accorgimenti per usare, all’interno del sito aziendale in modo (davvero) efficace, un video di background come leva persuasiva.

PERCHÈ usare un Video in Background sul tuo sito

I marketers amano i video in background perchè donano al sito un aspetto moderno e, al tempo stesso, trasmettono emozioni. In più c’è da considerare l’aspetto statistico, in quanto è stato registrato un incremento del 138% di conversioni quando passa un video in background in homepage

Ora cercheremo quindi di aiutarti a capire come evitare errori di base quando si utilizza uno sfondo video sulla homepage e come questo può dare una possibilità molto più alta di riuscire a migliorare il web design e di conseguenza il ritorno economico. 

COME usare un Video in Background sul tuo sito

Non stiamo parlando di una mera possibilità, infatti esistono molti casi studio che, numeri alla mano, dimostrano come e quanto le aziende sono riuscite a utilizzare video in background per migliorare le loro vendite. 

Lo sfondo video è più efficace quando lo si utilizza per:

  • Creare un’atmosfera
  • Impostare un tono 
  • Indurre una reazione emotiva 

Ecco alcuni esempi, divisi per settore:

1. Servizi, organizzazioni  

2. Prodotti fisici o digitali

3. Esperienze

4. Location Fisiche (Ristoranti, Hotels, Negozi,…)

Potremmo proseguire con molti altri esempi perché qualsiasi genere di sito avrebbe un fascino maggiore utilizzando video in homepage.

Una precisazione fondamentale: non scegliere un video qualsiasi solo perché ti sembra bello. Scegli sempre un video attinente allo scopo generale del tuo sito web. Vai oltre la gradevolezza estetica, trova il video giusto che sia funzionale alla comunicazione della tua realtà e veicoli il messaggio corretto. Solo così il video sfondo diventerà un potente strumento di marketing e branding.

“Temi che il video sullo sfondo del tuo sito possa deconcentrare gli utenti dal messaggio principale?” 

Questa domanda è lecita, in particolar modo se si parla di un sito web che espone un servizio complesso o un prodotto che ha bisogno di una spiegazione dettagliata per il pubblico. In queste situazioni infatti lo sfondo video potrebbe distrarre il visitatore da punti specifici e importanti. 

Ricordati di usare questi strumenti, come il video in background, rispettando i principi della User Experience: se lo sfondo non rende il tuo sito migliore, non ha alcuna utilità aggiungerlo.

10 regole da seguire per inserire un video come sfondo nel tuo sito nel modo migliore

1. Usa video rilevanti
Se il video che inserisci ha uno scopo ben preciso, aiuterà a rafforzare e chiarire il messaggio che stai provando a comunicare. Ad esempio, se sei un contabile, non dovresti mostrare un video che mette in evidenza alcuni bei paesaggi delle Alpi svizzere! Sicuramente avrà un fascino estetico, ma è irrilevante se non evidenzia il tuo business. In più potrebbe dare adito a dubbi come “Questo è un negozio di attrezzature all’aperto? O questo sito mi sta vendendo un pacchetto vacanza in Svizzera? “Assicurati quindi che il video che scegli per il tuo sfondo integri ciò che la tua homepage sta cercando di ottenere.

2. Il contenuto testuale deve essere chiaro come il video 

Per contestualizzare il video di solito si usa una frase che si sovrappone al video, quest’ultima può essere il nome del brand stesso così come il payoff. Attenzione però che il video non danneggi la leggibilità del testo, ecco quindi come evitare questa possibilità:

Opzione A) Scegli il colore del contenuto a contrasto.
Assicurati che il colore del contenuto (testo/logo/pulsante) contrasti con il tuo video. Per esempio, se hai un video più scuro, usa il bianco per il tuo logo, il pulsante e qualsiasi testo. Questo lo farà risaltare maggiormente. Se utilizzi invece un video più chiaro, utilizza colori più scuri per il contenuto. Questa tecnica può aiutare a creare il contrasto necessario in modo che i contenuti non si confondano con lo sfondo del video.

Esempio Colore del contenuto a contrasto

Opzione B) Aggiungi un Overlay chiaro o scuro sul tuo video. 
Un video molto vivace e ricco di dettagli può rendere i testi difficili da leggere, anche se si utilizza il giusto colore di contrasto nel contenuto. Perciò, quando desideri diminuire l’intensità dello sfondo del video, sovrapponi un overlay chiaro o scuro che riuscirà ad ammorbidire tutti i dettagli che ne impedivano la piena leggibilità.

Esempio Overlay Scuro
Esempio Overlay Chiaro

Opzione C) Aggiungi un Overlay colorato sul tuo video.
Come sappiamo, i colori nel marketing fanno la differenza. Aggiungere un overlay colorato al tuo video ti darà un effetto simile all’opzione 2, con il vantaggio aggiuntivo di creare un senso di riconoscimento più forte quando si utilizza il colore dello stesso come sovrapposizione.

Esempio Overlay Colorato

3. Ottimizza i tuoi video
La velocità del sito web è una grande preoccupazione quando si utilizza un video in background, dal momento che possono aumentare i tempi di caricamento. Ricordate il nostro articolo sui Core Web Vitals?
È dimostrato che la scarsa velocità di caricamento del sito web può causare l’uscita prematura dei visitatori dal tuo sito web e di conseguenza si potrebbe abbassare il posizionamento dei motori di ricerca.
La chiave per migliorare la velocità di caricamento del sito web quando si utilizza uno sfondo video è mantenere il video breve e il file video di dimensioni ridotte

4. Video corti in loop
Regola del pollice: prova a limitare il video a 5-10 secondi di lunghezza, e la dimensione del file video a 6MB o meno. Il video in loop darà l’impressione di  essere più lungo di quanto sia in realtà. Ricordati che non si tratta di un film, quindi la dimensione del file non deve essere troppo grande: piuttosto accorcialo o riduci la qualità, ma è importante che si carichi in brevissimo tempo. 

5. Usa video senza audio
L’audio che si attiva a sorpresa simultaneamente al caricamento della pagina web è classificato come una delle cose più fastidiose quando si tratta di user experience (soprattutto quando si è in ufficio!). 

6. Video di qualità 
Se il video è posizionato in homepage come background è la prima cosa che notiamo quando entriamo nella pagina web, quindi non può partire a scatti o avere una bassa qualità. Deve rappresentare il tuo brand, quindi è fondamentale che abbia una buona risoluzione.

7. Non pagare più del dovuto i tuoi video
Come abbiamo detto sopra, il video deve essere di qualità, però teniamo conto che tutto deve essere proporzionato. Inutile spendere somme eccessive per un video se anche il sito in generale non presenta le medesime caratteristiche. L’omogeneità nella visualizzazione per l’utente è importante. 

8. Non aggiungere i controlli nel video
Ci è capitato diverse volte che i clienti volessero aggiungere o visualizzare i controlli video in un’intestazione video o sfondo. Una cosa importante da ricordare è che si tratta solo di uno sfondo video, non deve essere trattato allo stesso modo di un player video su una pagina.
Aggiungere i controlli video andrà infatti contro il puro scopo di sfondo. Lasciare all’utente i controlli ha senso per video a carattere didattico o informativo, che proprio per questo non sono adatti a fare da background ma dovrebbero essere inseriti direttamente all’interno del contenuto delle pagine.

9. Video che si fanno notare, ma non troppo!
Quando si cerca una nuova tendenza di design (come uno sfondo video), lo scopo è migliorare il coinvolgimento degli utenti – non diminuirlo. Il video deve essere coinvolgente, ma non dimenticare di rendere chiaro e comprensibile anche il brand che stai cercando di pubblicizzare. 

10. Pensa alla visualizzazione da mobile
Non dimentichiamo che il mobile sta diventando sempre più il mezzo principale con cui l’utente cerca e visita le pagine web, quindi il video e il contenuto all’interno devono essere performanti per ogni piattaforma di visualizzazione. 

DOVE trovare i video

Riprendendo il punto 7. del paragrafo precedente, vi consigliamo alcuni siti in cui potrete trovare video di qualità gratis:

COME inserire i video nel tuo sito WordPress

Ovviamente se sei un videomaker esperto e hai tanta creatività, i siti sopracitati non saranno di tuo interesse perchè troverai molto facile riuscire a produrre di meglio, perciò passiamo alla parte pratica: come inserire lo sfondo video nel Sito Web?

Per rispondere a questa domanda dobbiamo considerare che ogni CMS ha un modo diverso di operare, partiamo dal famosissimo WordPress. Puoi seguire diverse strade: 

1. Installa un Plugin 
I migliori plugin free WordPress per aggiungere video in background:

  • Video Background
    Video Background è uno tra i plugin WordPress più popolari utilizzati per aggiungere i video come sfondo, è un plugin semplice da utilizzare ma potente dove è possibile scegliere se visualizzare il video nell’header o nel body. Inoltre rispetta le regole del responsive design e fornisce delle funzionalità avanzate (overlay, overlay color, overlay alpha, loop, mute) per rendere lo sfondo più bello.
  • Smart Slider 3
    Con Smart Slider 3, la creazione di bellissimi sfondi video a schermo intero è davvero semplice. Il plugin consente di creare video in background, che è possibile aggiungere al tuo sito come un’intestazione o semplicemente come una sezione di una pagina con un effetto di scorrimento.

2. Utilizza un tema che presenta nativamente sfondi video facili da inserire

3. Usa un Page Builder

  • Elementor : Elementor consente di creare sfondi video utilizzando file MP4 e video di Youtube. Ci sono ulteriori opzioni per orari di inizio e fine, immagini placeholder, sovrapposizione e modalità di fusione. Smart Slider 3 è compatibile con Elementor. 
  • Divi: Divi è un altro popolare plugin Page Builder che include la possibilità di creare sfondi video. È possibile utilizzare i file MP4, Youtube e Vimeo per il tuo background. Ci sono moltissime opzioni per gli overlay, per personalizzare il pulsante play e altro ancora. Smart Slider 3 è compatibile con Divi.

Conclusioni 

Usando i video in background donerai al tuo sito un design migliore e più affascinante, ma è importante ricordarsi di seguire le regole principali di design, comunicazione e usabilità.

Se vuoi aggiungere un video come sfondo al tuo sito web, ti sconsigliamo di procedere da solo: chiedi a esperti di web design per ottenere consigli più oculati sia a livello comunicativo che tecnico.

Per il resto, non ci resta che augurare buona visione a tutti! 

Condividi
Condividi su facebook
Condividi su google
Condividi su twitter
Condividi su linkedin
guest
0 Commenti
Inline Feedbacks
View all comments

Potrebbe Interessarti

Nadia Righini
Laureata in Design di Prodotto e con una passione per il web marketing. Nello specifico ama il mondo della grafica. Può assomigliare ad Alice nel Paese delle Meraviglie per svariati motivi, tra i quali pensa che tutto sia possibile a patto di crederci veramente!
Condividi
Condividi su facebook
Facebook
Condividi su linkedin
LinkedIn