La guida completa di Webflow + Swarmify per l'hosting video

Pubblicato: 2020-10-06

Utilizzi Webflow? In tal caso, Swarmify ti offre proprio ciò di cui hai bisogno per offrire esperienze video super veloci e di alta qualità.

Che cos'è un buon contenuto? Cos'è una pagina di destinazione? Che cos'è un sito web?

Sono finiti i giorni in cui la creazione di siti Web era appannaggio degli sviluppatori Web di draghi sputafuoco.

Al giorno d'oggi, puoi creare siti Web incredibili nel tempo necessario al prossimo ragazzo per finire un panino.

Grazie a costruttori di siti Web come Webflow, non è necessario sapere nulla sulla codifica per creare siti Web straordinari in un batter d'occhio.

Per il post di oggi, ho creato un sito web di esempio ( lo vedrai tra un minuto ) in meno di 30 minuti! E non sono quello che chiamereste uno sviluppatore web professionista. Nemmeno nei miei sogni :)

Strumenti come Webflow hanno rimosso molti degli ostacoli che impedivano a persone non esperte di tecnologia come te e me di creare siti Web.

Adesso...

Se utilizzi i video sul tuo sito Web di Webflow, desideri che si carichino velocemente e senza interruzioni.

Vuoi offrire ai tuoi utenti solo il meglio delle esperienze di visualizzazione, e niente di meno.

I video lenti che si accumulano durante la riproduzione infastidiranno solo i tuoi visitatori e li manderanno a correre per le colline e direttamente tra le braccia in attesa dei tuoi concorrenti.

Non lo vuoi perché sei intelligente. Inoltre, perché ora hai a disposizione la tecnologia SmartVideo di Swarmify.

SmartVideo ti consente di offrire ai tuoi utenti esperienze video completamente personalizzate e professionali.

Puoi fornire video 12 volte più veloci della media dei giocatori del settore. Meglio ancora, la soluzione proprietaria di consegna SmartVideo riduce gli stalli di 8 volte.

E nel post di oggi, ti mostriamo esattamente come integrare Swarmify con Webflow per accelerare i video per un migliore coinvolgimento degli utenti e più vendite!

Senza ulteriori indugi, salpiamo l'ancora e salpiamo :)

Cos'è il flusso web?

Pagina iniziale del flusso web

Allora, qual è questo animale che chiamiamo Webflow? Per chi non lo sapesse, Webflow è una società americana con sede a San Francisco.

Offrono una piattaforma Software as a Service (SaaS) per la creazione e l'hosting di siti Web, il tutto racchiuso in un unico pacchetto.

Webflow ti offre un ingegnoso costruttore di siti Web drag-and-drop che è un gioco da ragazzi da usare. Inoltre, ti offrono un sacco di funzionalità che rendono la creazione di siti Web reattivi facile come abracadabra.

Quando il tuo sito web è pronto, non devi andare altrove per l'hosting web. Webflow ti offre un hosting top di gamma perfetto per tutte le aziende, grandi e piccole.

Grandi marchi come Zendesk, Dell, Rakuten e Upwork, tra gli altri, si affidano a Webflow, il che significa che sei in buone mani.

Tra me e te, non ho mai usato un costruttore di siti Web così intuitivo prima d'ora. Webflow fa saltare in aria aziende come Weebly, Squarespace e Wix.

E bevono anche il loro Kool-Aid. Il sito Web ufficiale di Webflow è realizzato, hai indovinato: Webflow!

Caratteristiche principali del flusso web

Webflow è popolare e meglio conosciuto per le seguenti funzionalità chiave.

  • Un intuitivo costruttore di siti Web drag-and-drop che ti consente di creare siti Web visivamente
  • Decine di bellissimi modelli già pronti che puoi personalizzare fino allo sfinimento
  • Tonnellate di elementi del sito web
  • Funzionalità di e-commerce
  • Hosting Amazon S3 super veloce e robusto
  • Stili illimitati
  • Possibilità di aggiungere codice HTML, CSS e JS personalizzato
  • Piani tariffari flessibili
  • Potente sistema di gestione dei contenuti (CMS)
  • Molte integrazioni di terze parti
  • Piano gratuito per testare le acque
  • Molte interazioni e animazioni
  • Collega il nome di dominio personalizzato
  • Usa il loro sottodominio, ad esempio swarmify.webflow.io per ospitare un sito Web gratuito
  • Supporto professionale

Se sei uno sviluppatore web frontend (o semplicemente un normale joe) alla ricerca di un costruttore di siti Web facile da usare ma potente, Webflow è altamente raccomandato.

È lo strumento perfetto per risparmiare tempo e snellire la tua già intensa giornata lavorativa. Se sei un utente Webflow esistente, sai già che Webflow è un perfetto costruttore di siti Web.

Tuttavia, non ti offrono gli strumenti giusti per ottimizzare i video. Se utilizzi YouTube, il lettore video sul tuo sito Web di Webflow mostrerà comunque il fastidioso marchio YouTube e i link che distraggono i tuoi utenti e rubano il tuo traffico.

E mentre Webflow utilizza l'hosting veloce, i video che utilizzi da YouTube o da qualsiasi altra fonte verranno bufferizzati e il caricamento richiederà comunque del tempo.

È qui che entra in gioco Swarmify. Ti offriamo esattamente ciò di cui hai bisogno per ottimizzare i video sul tuo sito Web di Webflow, sia che tu stia utilizzando YouTube, Vimeo o qualsiasi altro sito per ospitare i tuoi video.

Cos'è Swarmify?

Swarmify è stato lanciato nel 2013 come piattaforma di accelerazione video. Il servizio funziona sulla stessa infrastruttura utilizzata da giganti dello streaming come Netflix e Hulu.

Puoi archiviare i tuoi video dove vuoi e utilizzare SmartVideo di Swarmify per fornire video ai tuoi utenti a velocità incredibili.

Ecco uno scenario di esempio per illustrare cosa intendo:

  • Carica video su YouTube o Vimeo per i vantaggi social e incorporali nel tuo sito web come sempre
  • Integra SmartVideo con il tuo sito Web utilizzando il nostro plug-in WordPress o uno snippet rapido
  • SmartVideo scarica i tuoi video YouTube/Vimeo dietro le quinte e li carica sulla nostra rete di distribuzione globale
  • SmartVideo offre i tuoi video ora più veloci in un lettore video ordinato e dall'aspetto sorprendente
  • Tutto accade in background automaticamente . Infatti, SmartVideo converte automaticamente tutti i video di YouTube sul tuo sito web. Installa una volta e il gioco è fatto!

SmartVideo utilizza EdgeAI interno per prevenire lo stallo durante la riproduzione e una soluzione SmartCDN che garantisce ai tuoi visitatori video veloci e senza buffer in qualsiasi parte del mondo.

Se utilizzi molti video, le basse velocità possono uccidere il coinvolgimento e portare a un minor numero di vendite. SmartVideo ti aiuta ad aggirare questo problema senza enormi bollette e limiti di archiviazione/larghezza di banda.

In Swarmify, la nostra missione è portare un'esperienza video accelerata e senza distrazioni su siti Web di tutte le dimensioni. Che tu sia il proprietario di un sito web , un'agenzia o semplicemente desideri entrare nel nostro programma di affiliazione , abbiamo un piano per te!

Caratteristiche principali di Swarmify

Gli utenti di Swarmify adorano SmartVideo grazie alle seguenti funzionalità.

  • Lettore video pulito, ordinato e privo di distrazioni
  • Avvio istantaneo - I video SmartVideo iniziano a essere riprodotti in media 12 volte più velocemente rispetto ad altri lettori (guarda la nostra demo qui)
  • Esperienza di visualizzazione ottimizzata su più dispositivi
  • Conversioni automatiche YouTube/Vimeo - Ospite già video su YouTube o Vimeo? SmartVideo li converte automaticamente
  • Ottimizzazione continua dello streaming - Durante la riproduzione, SmartVideo monitora continuamente l'esperienza video di ogni singolo utente e previene i guasti prima che si verifichino.
  • Riproduzione senza stallo - SmartVideo offre in media 8 volte meno buffering durante la riproduzione rispetto ad altri lettori.
  • Tutto illimitato - Goditi larghezza di banda e spazio di archiviazione illimitati
  • Supporto professionale supportato da un team di sviluppatori appassionati
  • Facile installazione e implementazione
  • Leggi di più sulle nostre funzionalità qui

Il video è una parte fondamentale del marketing digitale. Non puoi ignorare gli incredibili vantaggi dell'utilizzo del video come strategia di marketing.

Detto questo, la velocità di caricamento del tuo video fa parte della fornitura di una migliore esperienza utente sul tuo sito web.

Per offrire esperienze video veloci e senza lag sul tuo sito web Webflow, hai bisogno di una soluzione come SmartVideo.

Con i video veloci, godi di una migliore fidelizzazione degli utenti, più conversioni, frequenze di rimbalzo inferiori e più vendite. È un gioco da ragazzi.

Inoltre, chi vuole guardare un video che impiega un'eternità e un viaggio intorno al sole per caricarsi?

Assolutamente nessuno! Neanche tu.

A parte questo, integriamo Swarmify con il tuo sito web Webflow per accelerare i tuoi video e far sorridere i tuoi stimati clienti.

N/B: per integrare Swarmify con Webflow, è necessario un account Swarmify attivo e un piano a pagamento su Webflow.

Ancora sul recinto? Non essere . Iscriviti oggi a Swarmify e approfitta del nostro esclusivo sconto del 50% . Curioso? Scopri di più qui.

Detto questo, integriamo l'hosting video di Swarmify con il tuo sito Web Webflow.

Come aggiungere Swarmify a Webflow

'Prima di arrivare a Webflow, configuriamo il tuo snippet SmartVideo. Vai avanti, accedi alla dashboard di Swarmify e fai clic su Configurazione , come mostrato di seguito.

Quindi, scegli se hai video di YouTube sul tuo flusso web:

La scelta di sopra garantisce che SmartVideo converta automaticamente tutti i video di YouTube sul tuo sito Web di Webflow. Premi il pulsante Avanti .

Nella schermata successiva, scegli se il tuo sito Webflow ha video di sfondo:

Vuoi cambiare i colori del tuo video player in modo che corrispondano al tuo sito Webflow? Puoi farlo nella schermata successiva:

Premi Avanti .

Successivamente, se lo desideri, puoi modificare la forma del pulsante di riproduzione. Preferisco il pulsante esagonale predefinito, ma hai la possibilità di scegliere rettangolo o cerchio:

Quindi, scegli una filigrana personalizzata per i tuoi video:

Sei bravo in questo, devo ammettere :)

Premi Avanti .

Nella schermata successiva scegli se desideri vendere annunci sui tuoi video e fai clic su Fine :

Infine, fai clic su Copia negli Appunti , come mostrato di seguito.

Ora, il tuo snippet SmartVideo è pronto per il tuo sito web Webflow.

E dopo?

Ora aggiungeremo Swarmify al tuo sito web Webflow.

Ecco il sito Web di esempio con cui sto lavorando, come promesso:

Ho preso in prestito il famoso video di Jerusalema da Openmic Productions. Bella canzone e video, comunque. In tutto il mondo, le persone stanno facendo la sfida di danza di Gerusalemme .

Come vorrei poter ballare.

Andando avanti, aggiungiamo Swarmify al tuo sito Web di Webflow.

Accedi a Webflow:

Inserisci i dettagli e premi il pulsante Accedi :

Quindi, fai clic sul sito Web in cui desideri aggiungere SmartVideo:

Ora sei all'interno dell'intuitivo costruttore di siti Web di cui abbiamo parlato prima:

Ma non aggiungeremo lo snippet SmartVideo a una singola pagina. Vogliamo che lo snippet si applichi all'intero sito web.

Allora, cosa faccio Freddy?

Fare clic sull'icona Webflow (W) (si trasforma in un menu hamburger quando si passa il mouse):

Quindi, fai clic su Impostazioni progetto :

Successivamente, premi Codice personalizzato :

Sì.

Quindi, incolla lo snippet SmartVideo che hai copiato in precedenza nella sezione Codice principale e fai clic su Salva modifiche in questo modo:

Con quello snippet, il tuo flusso web è connesso a Swarmify. Tutti i video di YouTube sul tuo sito verranno convertiti automaticamente :)

Fatto.

Il risultato?

Questo:

Nota il nuovo video player senza branding di terze parti.

Ricorda : se stai utilizzando YouTube, utilizza l'incorporamento anziché il collegamento diretto, ad esempio https://www.youtube.com/embed/fCZVL_8D048 rispetto a https://www.youtube.com/watch?v=fCZVL_8D048 .

Suggerimento per professionisti : utilizza il link di incorporamento. Assicurati di utilizzare il link di incorporamento quando aggiungi video al tuo sito web Webflow.

Ospitare video altrove?

SmartVideo ti dà le spalle

Vedi i 9 migliori siti di caricamento video e servizi di archiviazione cloud.

Ecco un link condivisibile : https://swarmify.com/blog/top-video-upload-sites-cloud-storage-services/.

Aggiunta di tag SmartVideo

Puoi aggiungere un video SmartVideo ovunque sul tuo sito web Webflow utilizzando un tag SmartVideo:

 <smartvideo src="path/to/my/video.mp4" width="1280" height="720" class="swarm-fluid" controls></smartvideo>

Apri la pagina Webflow che desideri modificare. Per il nostro esempio, sostituirò la sezione Hero con lo stesso video di Jerusalema che abbiamo usato in precedenza. Questa volta, tuttavia, utilizzerò invece il tag SmartVideo sopra.

Ecco come appare il mio tag SmartVideo pronto:

 <smartvideo src="https://www.youtube.com/embed/fCZVL_8D048" width="1280" height="720" class="swarm-fluid" controls></smartvideo>

Si noti che sostituisco path/to/my/video.mp4 con il collegamento di incorporamento per il video.

Quindi, fai clic su Aggiungi (+) e scegli Incorpora , come mostrato di seguito:

Quindi, incolla il tag SmartVideo e fai clic su Salva e chiudi :

Ora, quando controllo il mio sito Web di esempio nel frontend, vedo il video convertito:

Facile come A, B, C.

Dire ciao?

Gli utenti di Webflow troveranno SmartVideo estremamente utile. SmartVideo accelera i tuoi video per una migliore esperienza utente.

Swarmify SmartVideo offre video 12 volte più veloci rispetto alla media del settore. Aumenterai le tue conversioni e vendite con video più veloci.

Alla prossima volta, crea più video e accelerali con SmartVideo di Swarmify :)

Prova SmartVideo oggi!