HTML5 - Video avansat

Cuprins
Videoclip etichetat de HTML5 Avem multe opțiuni pentru a ne îmbogăți documentele, pentru a ne face paginile mai bogate în ceea ce privește conținutul vizual și auditiv, datorită faptului că nu depindem de pluginuri sau terțe părți, ne putem manipula videoclipurile într-un mod care ne permite să ne atingem obiectivele fără probleme.
Încărcare video
Când lucrăm cu conținut mai greu, cum ar fi videoclipurile, trebuie să fim foarte atenți să nu saturăm pagina, deoarece acest lucru, în loc să ne îmbogățească conținutul, poate obține efectul opus și poate încetini documentul și poate oferi o experiență de navigare slabă.
Anticipând acest lucru în HTML5 În elementul video, ne permite să preîncărcăm videoclipul pentru a fi afișat în acest fel, asigurându-ne că avem puțin conținut înainte de a-l arăta utilizatorului și astfel nu întrerupem experiența lor pe pagina noastră.
Pentru aceasta putem folosi următoarele atribute:
preîncărcare - este atributul care ne va permite să folosim funcționalitatea de preîncărcare a videoclipului.
nici unul - videoclipul nu se va încărca până când utilizatorul nu îl redă.
metadate - vor fi preîncărcate doar metadatele videoclipului, adică detaliile videoclipului, cum ar fi dimensiunea, durata etc.
mașină - browserul poate descărca automat videoclipul după cum consideră necesar, browserul poate chiar ignora această instrucțiune, este comportamentul implicit.
Să vedem un mic exemplu de cod al modului de utilizare a acestei proprietăți:
 Exemplu Video nu poate fi afișat Video nu poate fi afișat 

În imaginea următoare vedem modul în care browserul interpretează apelul către videoclip folosind atributele nici unul Da metadate:

Este important să subliniem că trebuie să facem o utilizare echilibrată a acestei proprietăți, deoarece putem consuma resurse inutil, precum și lățime de bandă, ceea ce s-ar putea traduce și într-o experiență proastă a utilizării paginii noastre.
Plasați o imagine de copertă pentru videoclipul dvs.
Întrucât videoclipul este o parte importantă a paginii noastre, nu îl putem lăsa să afișeze primul cadru, deoarece poate rupe designul, pentru aceasta putem plasa o imagine de copertă sau substituent, cu aceasta putem chiar controla ce imagine să afișăm dacă utilizatorul nu a dat încă ordinul de redare a videoclipului, pentru aceasta putem folosi atributele posterului, pentru aceasta putem vedea următorul exemplu de cod.
 Exemplul video nu poate fi afișat  

Acum să vedem un pic cum interpretează browserul acest lucru și cum îl va vedea utilizatorul:

MARI

Pentru a obține acest efect, ceea ce s-a făcut a fost o captură de ecran a videoclipului, apoi cu proprietatea poster putem plasa această imagine drept coperta elementului nostru video.
Cu aceasta încheiem acest tutorial, cu aceste noi proprietăți putem controla într-un mod mai bun modul în care ne putem arăta videoclipurile și în acest fel creăm documente noi, mai bogate și mai interactive.V-a plăcut și ați ajutat acest tutorial?Puteți recompensa autorul apăsând acest buton pentru a-i oferi un punct pozitiv

Vei ajuta la dezvoltarea site-ului, partajarea pagina cu prietenii

wave wave wave wave wave