Question

我的网站背景中有一个视频。这是带有jpg后备的HTML5。

我使用此HTML

        <video id="video_background" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
            <source src="video/nieuw.mp4" />
            <source src="video/nieuw.webm" type="video/webm; codecs=vp8,vorbis" />
            <source src="video/nieuw.ogg" type="video/ogg; codecs=theora,vorbis" />
            <img src="img/bg1.jpg" alt="bg" />
        </video>

我已经摆弄了这些<source>文件的序列，而且我已经在转换工具方面做了大量工作。我使用MIRO转换器，VLC，iMovie等等......

但我总是最终得到至少一个没有显示电影的浏览器，例如Safari on Mac desnt work，所有其他浏览器都可以。或者所有浏览器，但Windows / Chrome无法正常工作。这让我很生气。

你们可以发布你的最佳实践吗？你使用了什么序列的html5代码，以及你用来转换电影的程序/设置？

非常感谢！

Answer 1

最好的方法是集成任何播放器（如jwplayer），因为所有浏览器都不支持视频标签，并且在上传时根据您的播放器支持使用任何库（如ffmpeg lib）以一种通用格式转换所有视频。

http://www.w3schools.com/html/html5_video.asp

Answer 2

编解码器超出了w3c规范的范围。 Zencoder在这里有关于这个确切问题的非常好的博客文章：

http://blog.zencoder.com/2013/09/13/what-formats-do-i-need-for-html5-video/

Answer 3

2016年，MPEG-4 / H.264视频格式赢得了战斗，你可以放弃webm和ogv http://caniuse.com/#feat=mpeg4

使用AWS Elastic转码器转换

Answer 4

好的，我让它在每个常见的浏览器中运行，并为老一些浏览器提供后备。我使用VLC转换文件，并使用下面的HTML：

<video id="video_background" volume="0" muted="muted" loop="loop" autoplay="true" preload="auto">
<source type="video/mp4; codecs=avc1.42E01E,mp4a.40.2" src="video/pr6.mp4"></source>
<source type="video/webm; codecs=vp8,vorbis" src="video/pr6.webm"></source>
<source type="video/ogg; codecs=theora,vorbis" src="video/pr6.ogv"></source>
<img alt="bg" src="img/bg1.jpg">
</video>

应该使用哪些HTML5视频编解码器？

4 个答案: