Embedding Audio and Video in HTML5

HTML5 introduced native <audio> and <video> tags, removing the need for third-party plugins like Flash.

Video:

<video controls width="600" poster="thumbnail.jpg">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.webm" type="video/webm">
  Your browser doesn't support HTML5 video.
</video>

Audio:

<audio controls>
  <source src="song.mp3" type="audio/mpeg">
  <source src="song.ogg" type="audio/ogg">
  Your browser doesn't support HTML5 audio.
</audio>

Key attributes:

controls — shows the built-in play/pause/volume UI. Without it, the media is invisible/silent unless controlled by JavaScript.
autoplay — starts playback automatically (most browsers block this unless the media is also muted).
loop — repeats playback when it ends.
poster (video only) — an image shown before playback starts.
Multiple <source> tags let the browser pick whichever format it supports — not every browser supports every video/audio codec.

For embedding external content like a YouTube video, use <iframe> instead, since the video file itself isn't hosted on your own server:

<iframe width="560" height="315"
  src="https://www.youtube.com/embed/VIDEO_ID"
  title="YouTube video player" allowfullscreen>
</iframe>