08. media (html)

Voor de introductie van HTML5 was er voor het afspelen van media in de browser steeds een plug-in nodig (flash, macro's, ...). HTML5 heeft een aantal nieuwe element gedefinieerd waarmee media aan een webpagina kan worden toegevoegd zonder dat daar een plug-in voor nodig is.

video (html)

Video kan worden toegevoegd met het <video> element. Binnen dit element kunnen door middel van het <source> element en het src en type attribuut, 1 of meerdere bronbestanden van verschillende types worden toegevoegd. Ook kunnen er door middel van het <track> element ondertitels en opmerkingen worden toegevoegd aan de video. De tekst in het <video> element zal enkel getoond worden in browsers die dit element niet ondersteunen.

<video width="320" height="240" controls autoplay>
  <source src="movie.mp4" type="video/mp4">
</video> 

try it yourself: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video

audio (html)

Audio kan worden toegevoegd met het <audio> element. Binnen dit element kunnen door het <source> element en het src en type attribuut, 1 of meerdere bronbestanden van verschillende types worden toegevoegd. De tekst in het <audio> element zal alleen maar worden getoond in browsers die dit element niet ondersteunen.

<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
</audio> 

try it yourself: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_audio

iframe (html)

De iframe-tag specificeert een inline frame en wordt gebruikt om een ander document in te sluiten in het huidige HTML-document.

<iframe src="https://www.w3schools.com" title="W3Schools Free Online Web Tutorials">
</iframe>

try it yourself: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_iframe