Recently I’ve been making more HTML5 Video websites and to cover all browsers you have to have not only an mp4 version of the video but you also have to have a webm version. Suprisingly it is hard to really find something clean out there to convert an mp4 to a webm format. You would think things like Adobe Premieme or HandBreak would support this conversion and video codec but whatever. These steps worked for me on my OSX Sierra MacBook Pro.

 

Ensure you have HomeBrew installed

 

First step is installing the ffmpeg command line tool, run the following:

brew install ffmpeg –with-libvpx –with-libvorbis –with-fdk-aacc

This next step is optional but I recommend it. Install handbreak and compress a “web optimized” mp4 in whatever resolution you want

(I choose fast 1080p typically)

The reason I do this is cause typically you just downloaded some raw mp4 file and really should compress it for web use.

Now you can make the webm version of the video with the compressed mp4 video you jsut made with handbreak. If you skipped that step, just use the raw mp4 you have.

Run the following in the command line but replace the source mp4 and destination webm file.

ffmpeg -i source-video.mp4 -c:v libvpx -crf 10 -b:v 1M -c:a libvorbis destination-video.webm

You’ll see something like the following output:

 

You should be all set after that! Let me know if you have any questions or issues!