Sample WebM, Ogg, and MP4 Video Files for HTML5

HTML5 Video Sample Files

If you are playing around with the HTML5 Video tag you might need some sample video files and these video files have to be in different web formats. The problem is that different browsers support different types of video files, so to provide proper cross-browser support, you need to convert your video into many different formats. I plan on writing more about HTML5 Video and some cool things that it allows you to do but as a start, I wanted to convert one small video file into a lot of different formats and provide these files as a sample video for anyone to use in their tests and projects.

For web browsers, you are basically going to need MP4, WebM and Ogg formats(Ogg format is specified as type=video/ogg but the video extension is .ogv) while mobile browsers will use MP4 and 3GP formats. And HTML5 is obviously about eliminating the need for Flash but I will include flv format as well. The original mp4 is really small, just 385Kb and the video lasts 5 seconds. Feel free to use the following files for whatever you need:

Sample MP4 Video File

Sample WebM Video File

Sample Ogg Video File

Sample 3GP Video File

Sample FLV Video File

And here is the HTML5 video tag code and demo:

If you are using a Mac, the Miro Video Converter is a simple way to convert almost any video to MP4, WebM (vp8), Ogg Theora, or for Android, iPhone, and more.

Related Links

Top Cross Platform Video Players
The State Of HTML5 Video

Facebook Twitter Hacker News Reddit More...
  • TechSlides

    a lot opf good info on working with HTML5 audio and video

  • Mrina

    will the video be played in IE 7 as well

    • TechSlides

      Nope, IE7 and IE8 do not support the HTML5 video tag and will need Flash.

  • http://twitter.com/LuckychairNews Sue Jenkins

    How can I get in touch with you?

  • http://twitter.com/LuckychairNews Sue Jenkins

    You may want to include “” around the source and attributes, like this (note: your site is forcing the code below to show as controls=”" when it should just be controls):

    • iweczek

      You actually do not need “” around source or attributes to be HTML5 valid. You would need it for another doctype. BTW, I emailed you.

  • Lynear

    The OGG Theora video format (OGV) is closely linked to HTML 5 and will
    become more and more important with the new specifications of the HTML5
    standard. OGV is a good format to work with html5. To get the OGV file, follow the link:http://www.bigasoft.com/articles/convert-mp4-to-ogv-convert-avi-wmv-mpeg-flv-to-ogv.html

  • http://gamystar.co/ Play free games online

    THX :)

  • Erin

    Thank you!!

  • pilouk

    doesnt work on IE 10 why ??

    • iweczek

      Does it work for you in other browsers? Are you downloading the files and loading locally or using my urls?

  • nitish

    Sir i simply taken a html5 control and i am binding a video but it showing unsupported format or invalid path but same path is working in media player

    • iweczek

      What browser and do you see any errors in the browser console? How are you loading the video?

  • Diane

    Thank you soooo much! Learning how to add HTML5 video was exactly what I was doing and really only needed something short and sweet with the correct mp4 and webm extentions.

  • http://latest-tutorial.com/ Latest Tutorials

    That is very helpful but that piece of code not working on firefox browser when i try to use .mp4 format.Have a look on it ,and some times its show me your mine type is not set.

    <!–

    –>

    <!– –>

  • madelikready

    From the foregoing, we learn that if you have a ton of OGV files in
    hand and want to play them on Mac system, iPhone, iTunes, iPod, iPad,
    Windows Media Player, Android, Xbox 360, or PS3, etc or edit them in
    iMovie, QuickTime, Final Cut Pro, PowerPoint, or Windows Movie Maker,
    etc, you need to convert OGV to MP4 and other more compatible video
    formats, since the above players and devices don’t natively support OGV
    as the input format.

    On the other hand, you’d better to convert MP4 to OGV, if want to
    put your MP4 file on your website for commercial usage free from patent
    issues.

    Here is a guide on how to decode and encode OGV and WebM.

  • Tim

    webm <3