Embed Video in HTML
HTML5 natively accepts 3 video formats: mp4, Ogg, and Webm.
ffmpeg
To create a Webm file, you will need the ffmpeg library. The easiest way to install this is via Homebrew, which will first need to be installed itself. Once Homebrew is installed, to install the ffmpeg formulae: brew install ffmpeg
.
The ffmpeg command line tool, installed with the Homebrew package, will convert between a large number of formats. I haven't fully experimented with it but it might be possible to do all these conversions with ffmpeg simply by specifying the correct file extension for the output file.
mp4
Screen recordings made in QuickTime will be .mov
files. To convert .mov
to .mp4
with the Adobe Express online tool.
Ogg
Use the VLC player application to create a .ogg
file. From the File menu in the VLC Media Player application,, choose Covert / Stream. Choose either the .mov
file or .mp4
file as the source and Video - Theora + Vorbis (OGG) as the profile. Save as File.
Webm
Once ffmpeg is installed, VLC Player can be used to create the .webm
file as well. From the File menu, choose Covert / Stream. Choose the .ogg
file as the source and Video - VP80 + Vorbis (Webm) as the profile. Save as File.
Or, the ffmpeg
command line tool can be used directly:
$ ffmpeg -i file-name.mp4 file-name.webm
This is a much slower process than using VLC.
HTML
Embed with default controls, preloading, and a custom poster:
MDN documents the full list of attributes applicable to the video
HTML element.
Feedback?
Email us at enquiries@kinsa.cc.