Embedding video, audio and their subtitles into posts.
Contents
Video
With
<video>, we can embed multiple video formats. This is useful as not all browsers are capable of supporting all video formats, hence by including many we increase the number of users able to watch our video.Video borrowed from W3Schools.
Demo:
<video width="320" height="240" controls> <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4"> <source src="https://www.w3schools.com/tags/movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>Audio
With
<audio>, we can embed multiple audio formats. This is useful as not all browsers are capable of supporting all audio formats, hence by including many we increase the number of users able to listen to our audio.Audio borrowed from W3Schools.
Demo:
<audio controls> <source src="https://www.w3schools.com/tags/horse.ogg" type="audio/ogg"> <source src="https://www.w3schools.com/tags/horse.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>Subtitles
No working example available.Videos and audio can also come with subtitles across multiple languages.
Example borrowed from W3Schools.
Demo:
<video width="320" height="240" controls> <source src="forrest_gump.mp4" type="video/mp4"> <source src="forrest_gump.ogg" type="video/ogg"> <track src="fgsubtitles_en.vtt" kind="subtitles" srclang="en" label="English"> <track src="fgsubtitles_no.vtt" kind="subtitles" srclang="no" label="Norwegian"> </video>
Back to HTML ReferenceSpot something we didn't? Let us know!