Gli utenti apprezzano i contenuti multimediali, soprattutto i video: possono essere divertenti e informativi. Sui dispositivi mobili, i video possono rappresentare un modo più semplice per fruire di informazioni rispetto al testo. Per una buona esperienza utente, i video non dovrebbero richiedere più larghezza di banda disponibile. Gli utenti devono essere in grado di utilizzarli indipendentemente dal dispositivo con cui li stanno utilizzando. Gli utenti non dovrebbero mai dover attendere il download dei contenuti multimediali. A nessuno piace quando premi Riproduci e non succede niente.
Senza dubbio hai guardato i video sul tuo dispositivo, il che significa che niente di quest'ultimo paragrafo ti sorprende. Ora devi imparare a inserire un video o altri file multimediali sul tuo sito web. I requisiti tecnici per l'aggiunta di contenuti multimediali devono essere in linea con l'esperienza utente.
I requisiti tecnici
- Le versioni di un file multimediale sono in formati compatibili con il web comuni e contengono stream audio e video.
- La risoluzione è appropriata per i dispositivi degli utenti.
- La velocità in bit non sovraccarica la larghezza di banda della rete degli utenti.
- Il risultato è visibile su tutti i principali browser che utilizzano tecnologie appropriate.
- (Facoltativo) Il file è criptato.
La sezione contenuti multimediali di questo sito web ti aiuterà a raggiungere questi requisiti tecnici. Non preoccuparti se questi concetti sono ancora un po' astratti. Le spiegheremo gradualmente in tutti gli articoli. Nella prima sezione imparerai i concetti di base dei media, poi come aggiungerli al web nella seconda e nella seconda sezione finale le applicazioni pratiche, con alcune tecniche avanzate, dell'utilizzo dei contenuti multimediali sul web.
Visualizzazione del video sul Web
Esistono quattro approcci che puoi seguire per visualizzare un video su un sito.
- Carica i tuoi video su un provider di hosting multimediale come YouTube o Vimeo. Queste opzioni richiedono di incorporare i player nel tuo sito.
- Incorporamento self-hosted di base utilizzando gli elementi HTML
<video>e<audio>. - Incorporamento più completo di funzionalità tramite una raccolta video come Shaka Player, JW Player o Video.js.
- Creazione del tuo server multimediale e della tua applicazione di streaming.
Questo sito tratta principalmente le nozioni di base dell'incorporamento di elementi multimediali. Tuttavia, tratteremo alcuni argomenti più avanzati per muovere i primi passi nel percorso di creazione della tua applicazione di streaming multimediale. Lo sforzo per raggiungere questo obiettivo non è banale, quindi abbiamo creato una PWA multimediale con supporto offline da utilizzare come riferimento, che dovrebbe mostrarti i modi in cui puoi ottenere questo risultato e lo sforzo necessario. L'applicazione non è in alcun modo un'offerta pronta per la produzione o un concorrente di servizi come YouTube o Vimeo, ma ti fornirà un punto di partenza per imparare qualcosa di nuovo e stimolante.
Francamente, creare un concorrente per i servizi multimediali ospitati richiederebbe un team di ingegneri esperti e migliaia di ore umane di lavoro. A meno che il tuo obiettivo non sia entrare in quel mercato come concorrente, è meglio utilizzare uno degli altri metodi. È utile comprendere la tecnologia e, anche se non è possibile implementare la propria applicazione o il proprio video player, è possibile esplorare e sperimentare sulle soluzioni più all'avanguardia del supporto dei browser o quanto meno utilizzare una delle librerie video esistenti.
Cosa impareremo
La raccolta contenuti multimediali è composta da tre parti. In questa prima sezione, forniremo concetti e informazioni sui prerequisiti per l'aggiunta di contenuti multimediali al tuo sito. Ciò include la spiegazione della composizione dei file multimediali, delle nozioni di base sulle applicazioni necessarie per preparare i tuoi file per il web e dei concetti di streaming. La seconda sezione spiega come preparare i file, convertirli in vari formati e, facoltativamente, aggiungere la crittografia. Nell'ultima sezione ti mostreremo come incorporare un file multimediale in una pagina web, discutere delle best practice relative alla riproduzione automatica, utilizzare framework multimediali, portare i video offline e renderli accessibili.
Gli argomenti da trattare sono molti, quindi iniziamo con le nozioni di base sui file multimediali.