Make HTML audio and video work for everyone: captions, transcripts and audio description, keyboard-friendly controls, autoplay and audio control, reduced motion, flashing and seizure safety, labelling embedded players, and a practical checklist for every kind of media, with live demos.
Start learning HTML audio and video: the audio, video, source and track elements, built-in controls, captions and subtitles, accessible and responsive media, and the formats browsers can play, with a live format checker and a map of this section.
Learn how to add and write good captions for HTML video: the track element with kind captions, what captions must include (speech, speakers, sounds), timing and reading speed, line length, styling and contrast, open versus closed captions, reviewing automatic captions, and common mistakes, with live checkers.
Learn the HTML source element: offering several formats for audio and video with src and type, how the browser picks the first source it can play, codecs in the type attribute, the media attribute, fallback content, and common mistakes, with a live demo that shows the browser choosing.
Learn how to add subtitles in several languages to HTML video: track elements with kind subtitles, srclang and native-language labels, language codes, translation tips, right-to-left and Asian scripts, choosing a language with JavaScript, and common mistakes, with a live multi-language demo.
Learn the HTML video element: embedding video with src, controls, width, height, poster, preload, muted, loop, playsinline and autoplay, choosing MP4 or WebM, avoiding layout shift, background videos done safely, compressing files, and accessibility, with a live video player you can try.
Make HTML video fit every screen: width and height attributes with max-width and height auto, the CSS aspect-ratio property, object-fit and object-position, responsive iframe embeds, preventing layout shift, saving data on mobile, vertical video, and common mistakes, with live resizable demos.