9.2: Video opnemen in je website
Als "een plaatje al meer zegt dan 1000 woorden" dan kun je je voorstellen hoe krachtig een video op je website kan zijn.
Hieronder zie je een voorbeeld:
De code voor het weergeven van een video-element is als volgt:
<video width="breedte" height="hoogte" controls>
<source src="media/html5_tutorial.mp4" type="video/mp4">
De Browser ondersteunt deze video niet.
</video>
Let op de volgende zaken:
- Alle moderne Browsers ondersteun dit <video> element
- MP4 wordt door alle (moderne) Browsers ondersteund
- Let op het juiste path (relatieve link) naar het videobestand
- Als de website geopend wordt met een verouderde Browser dan ziet de bezoeker de mededeling
Er zijn 3 videoformaten toegestaan:
- MP4: <source src="path/bestand.mp3" type="video/mp4">
- WEBM: <source src="path/bestand.webm" type="video/webm">
- OGG: <source src="path/bestand.ogg" type="video/ogg">
Opdracht 23: Video
- Maak een nieuwe webpagina en sla deze op als audio_en_video.html in een nieuwe map met de naam 'media'.
- Ga naar bijv. Youtube en zoek een korte film (max. enkele minuten)
- Kopieer de URL en surf naar Download Youtube filmpjes
- Plak de Youtube-link in het zoekvenster en klik op 'download'.
- Na enige tijd moet je bij de Java-melding kiezen voor 'toestaan' of 'Run'.
- Kies voor de optie met de rode pijl (zie hieronder)
- Sla het bestand op in de map 'media'.
- Zorg dat de video zichbaar en afspeelbaar is (juiste link)