HTML5 - Avansert video

Merket video de HTML5 Vi har mange alternativer for å berike dokumentene våre for å gjøre sidene våre rikere når det gjelder visuelt og auditivt innhold, takket være det faktum at vi ikke er avhengige av plugins eller tredjeparter, kan vi manipulere videoene våre på en måte som lar oss nå våre mål uten problemer.
Video forhåndsinnlasting
Når vi arbeider med tyngre innhold som videoer, må vi være veldig forsiktige med å ikke mette siden, siden dette i stedet for å berike innholdet vårt kan oppnå motsatt effekt og bremse dokumentet vårt og gi en dårlig nettopplevelse.
Forutse dette i HTML5 I videoelementet tillater det oss å forhåndslaste videoen som skal vises på denne måten, og sørge for at vi har litt innhold før vi viser det til brukeren og dermed ikke avbryter opplevelsen på siden vår.
For dette kan vi bruke følgende attributter:
forhåndslast - er attributtet som lar oss bruke funksjonen for forhåndsinnlasting av video.
ingen - Videoen lastes ikke før brukeren spiller den.
metadata - bare metadataene til videoen vil bli forhåndslastet, det vil si detaljene i videoen, for eksempel størrelse, varighet etc.
bil - nettleseren kan laste ned videoen automatisk som den anser nødvendig, nettleseren kan til og med ignorere denne instruksjonen, det er standardatferd.
La oss se et lite kodeeksempel på hvordan du bruker denne eiendommen:

 Eksempel Video kan ikke vises Video kan ikke vises 

I det følgende bildet ser vi hvordan nettleseren tolker samtalen til videoen ved hjelp av attributtene ingen Y metadata:

Det er viktig å understreke at vi må gjøre en balansert bruk av denne eiendommen, siden vi kan bruke ressurser unødvendig så vel som båndbredde, noe som også kan føre til en dårlig opplevelse av å bruke siden vår.
Plasser et forsidebilde for videoen din
Siden videoen er en viktig del av siden vår, kan vi ikke la den vise den første rammen siden den kan bryte designet, for dette kan vi plassere et forsidebilde eller plassholder, med dette kan vi til og med kontrollere hvilket bilde som skal vises hvis brukeren ennå ikke har gitt ordre om å spille av videoen, for dette kan vi bruke plakatattributtene, for dette kan vi se følgende kodeeksempel.

 Eksempelvideo kan ikke vises  

La oss nå se litt hvordan nettleseren tolker dette og hvordan brukeren ville se det:

FORSTØRRE

For å oppnå denne effekten var det som ble gjort et skjermbilde av videoen, deretter med eiendommen plakat vi kan plassere dette bildet som omslaget til videoelementet vårt.
Med dette fullfører vi denne opplæringen, med disse nye egenskapene kan vi på en bedre måte kontrollere måten vi kan vise videoene våre på og på denne måten lage nye, rikere og mer interaktive dokumenter.Likte og hjalp du denne opplæringen?Du kan belønne forfatteren ved å trykke på denne knappen for å gi ham et positivt poeng