If you can use HTML5 I'd suggest the video tag like the following. I figured you'd want controls so I added the controls attribute to the video tag; you could also add autoplay if you want that. I tested it on IE11 and the current versions of Firefox and Chrome. works for all of those. Having alternate versions isn't a bad idea, but mp4 is pretty universal on modern browsers.
<video controls>
<source src="http://media2.giphy.com/media/yoJC2NG0MLnSoEPjIA/giphy.mp4" type="video/mp4">
<source src="http://media2.giphy.com/media/yoJC2NG0MLnSoEPjIA/giphy.webm" type="video/ogg">
Your browser does not support the video tag.
</video>
As to why:
MP4 H.264 (AAC or MP3) The MP4 container format with the H.264 video
codec and the AAC audio codec is natively supported by desktop/mobile
Internet Explorer, Safari and Chrome, but Chromium and Opera do not
support the format. IE and Chrome also support the MP3 audio codec in
the MP4 container, but Safari does not. Firefox/Firefox for
Android/Firefox OS supports the format in some cases, but only when a
third-party decoder is available, and the device hardware can handle
the profile used to encode the MP4.
Note: MP4s encoded with a high profile will not run on lower end
hardware, such as low end Firefox OS phones. The MPEG media formats
are covered by patents, which are not freely licensed. All the
necessary licenses can be bought from MPEG LA. Since H.264 is
currently not a royalty free format, it is unfit for the open web
platform, according to Mozilla [1, 2], Google [1, 2] and Opera.
However, since royalty free formats are not supported by Internet
Explorer and Safari, Mozilla has decided to support the format anyway,
and Google never fulfilled their promise to remove support for it in
Chrome.
Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats