使用h264 / mp4视频作为网站的背景

时间:2013-01-02 14:00:49

标签: html5 video content-management-system html5-video

我的客户希望将mp4视频作为整个网站的视频背景。 它已经成为一个皮塔,以确保它在我们的CMS中工作,因为他们不希望视频在转到不同的页面时重新加载。

他们发给我的文件是1080p和大约。 100MB大,长2分钟。

有什么方法可以调整视频大小/重新缩放视频并将其用作html5网站中的视频背景?

我是否应该告诉客户它不会对用户友好,将会带宽占用,并且肯定会增加开发成本。

我们不会在我们的代理机构建立Flash网站作为一般规则,因此不能选择。

3 个答案:

答案 0 :(得分:1)

你可以使用html5 <video>标签来播放该视频,并通过AJAX进行其余的导航。

但是你需要为不支持h264的浏览器提供不同的视频格式,比如Opera。我推荐webm作为替代方案。

你需要缩小视频的大小,我想在质量和分辨率上都是如此。

对于pre-html5 aera的浏览器,我建议使用静态图像;)

多功能所有: 跨浏览器兼容的解决方案将是PITA。 现代浏览器具有允许这种解决方案的技术。 我想这是可能的,但你必须为大约5%的浏览器不兼容或CPU速度太慢的用户提供回退!

答案 1 :(得分:1)

为了实现浏览器兼容性,您还必须将视频转换为Ogg Theora(这将减小它的大小,但它只能在WebKit / Mozilla下播放)。 HTML5视频支持缓冲,但在不同的浏览器下以不同的方式。例如,WebKit试图预先缓冲整个视频,IE一次预先缓冲一个固定大小的块,等等。所以这会在浏览器中表现不同。

答案 2 :(得分:0)

网站的全屏视频:查看www.gossdekort.com的源代码您甚至可以在视频上方添加菜单