Contact us +32 498 138 661

info@rambla.be

HTML5

Adaptive streaming or bitrate switching allows clients to automatically switch between different video streams during playback, to ensure the highest possible video quality with minimum buffering and startup time. This way, clients can adapt dynamically to changing bandwidth conditions and available CPU resources, which makes this delivery method especially well suited for mobile devices. Moreover, by using HTTP as the stream transfer protocol, firewall issues are being avoided.

Currently, there are three main flavors of HTTP adaptive streaming - by Apple, Microsoft and Adobe - each targeting their own platform.
Below you will find an example of the Apple (HLS) and Microsoft (Smooth Streaming) implementations. We added a third example using RTMP (Flash streaming). The RTMP protocol does not implement adaptive streaming as such, but adaptive intelligence can be built into the Flash player, as is the case in the ubiquitous Jeroen Wijering player (the JW-player actually uses the playlist mechanism to obtain bitrate switching).

What's interesting for you is that you only need to encode your media sources once. Our media servers can deliver the same H.264/AAC encoded file to any platform or device, using Flash, HLS or Silverlight streaming. And thanks to our multi-bitrate encoding profiles even mobile devices under low bandwidth conditions do not have to skip a single byte.

Want to know more? Read our blog post on how to get started.

Loading player ...

The W3C recently issued a Last Call announcement for HTML5, moving the standard one step closer to the finishing line (currently set in 2014). In the meantime, HTML5 has been gaining traction on the web with growing support by browsers and devices alike. According to a recent study by ABI Research, more than 2.1 billion mobile devices will have HTML5 browsers by 2016.

HTML5 video: H.264 and webm

HTML5 video tag : supported formatsAn important aspect of HTML5 is the support for embedded multimedia, including video, audio, and dynamic graphics. Various HTML5 video players have emerged and the list of features is growing steadily. However, the lack of a common video codec for all browsers remains a huge problem, which is not likely to disappear in the near future. Apple (Safari) and Microsoft (IE) have committed to support the H.264 video codec, while Google (Chrome), Mozilla (Firefox) and Opera are bolstering the VP8 codec (as part of a WebM container) instead. The latter group is also supporting the Theora codec and Ogg container format, sometimes depending on the browser version. For more information concerning both formats and the surrounding issues, see this article from our State of Play series.

To avoid your HTML5 videos not playing in some browsers or on some devices, you can currently still use H.264 with a fallback to Flash. However, this solution has a number of drawbacks (e.g. lack of a unified architecture, Flash overhead on devices) and may not be future proof. Another option, which leaves your HTML5 code intact for all browsers and devices, is to encode your videos into Mp4 (H.264), WebM (VP8) and Ogg (Theora). Rambla Transcoding Service (RATS) supports these video formats and has an API that allows for a quick integration into your custom environment.

Auto-Publish BOTH FORMATS Easily

If you need a simple and transparent solution that requires no development effort, our hotfolder system may be what you're looking for. All you have to do is upload your video to your own private FTP directory (= the so-called 'hotfolder'). The hotfolder takes care of the rest:

  • It encodes your video into Mp4, WebM and Ogg format (dimensions, bitrates... can be configured).
  • It optimizes the encoded videos for online delivery.
  • It publishes the .mp4, .webm and .ogg video's side-by-side on the Rambla CDN (you can determine the exact location by creating sub-directories inside your hotfolder).
  • It provides you with a notification or report.

GETTING STARTED

Every Rambla user account has a default hotfolder which is suited for this purpose. To configure your default hotfolder for HTML5: log in to the RATS web-application and select the 'user' menu, then choose 'html5' as your default format-group. Your hotfolder is now ready to start encoding your videos into WebM and mp4 formats and publish them on the CDN. In order to use it, just upload your video files to 'ftp.enc01.rambla.be', logging in with your hotfolder credentials (= your user name followed by the "-enc" suffix and your user password).

For more information or help, see our hotfolder guide or contact us.

Encoding | HTML5

Microsoft announces IE9 will support native playback of videos using HTML5, but it will only support H.264 and not its more open alternatives. Read more about it here.

External | HTML5

Jan Ozer published some interesting tests comparing Adobe's flash player to YouTube's new HTML5-based player, with regard to the amount of CPU usage needed for video playback.

His main conclusion is that Flash is efficient on platforms where it can access hardware acceleration (e.g. Windows) and less efficient where it can't (e.g. Mac). An additional conclusion is that the CPU horsepower needed to play back HTML5 video also differs substantially depending on the browser being used.

You can read the entire publication here.

External | HTML5

There's been a lot of hype lately around the HTML5 <video> tag, which is included in the HTML5 specification in order to add native support for embedding video content in web pages. The <video> tag and the rich scripting API for controlling playback make adding video to a web page almost as simple as adding an image. The browser itself provides the playback functionality without any need for plugins like Quicktime or Flash.

Problem is that among browser manufacturers no agreement could be reached on which codec to support for video rendering. Basically, there are two opposing camps: Apple and Google favor the patent-covered H.264 standard, while Mozilla and Opera favor the open-source and probably unpatented Ogg format. This led to a removal of the sections of the HTML5 draft specification that recommended a specific video codec.

Last week, two new events once again heated up the debate. On the one hand, Firefox 3.6 was released with HTML5 support, but only supporting the OGG video format. On the other hand, YouTube announced a beta of HTML5 support, which only provides content that is encoded using H.264. So the new Firefox release won't be able to play YouTube's embedded video's. At the moment, only Google’s Chrome and Apple’s Safari provide support for YouTube’s HTML5 video.

Workarounds

So what to do if you're planning to embed a video into a website using the HTML5 <video> element ?

First of all, you can overcome the lack of a default codec, by providing both formats in the same <video> tag.

<video controls>
<source src="video.m4v" type="video/mp4" />
<source src="video.ogg" type="video/ogg" />
</video>

For legacy browsers that don't support the <video> element, you can still provide fallback to QuickTime or Adobe Flash. A demo with sample code can be found on our HTML5 demo page.

The 'Video for Everybody' project

Video for Everybody is a chunk of HTML code that embeds a video into a website using the HTML5 element, which offers native playback in Firefox 3.6, Safari 3 & 4, Google Chrome and an increasing number of other browsers. If HTML5 is not available, the code falls back to a quicktime movie embed. If this is not available then flash is used. Finally if flash is not available, an image is displayed with a download link.

This approach leverages the benefits of HTML5 whilst maintaining backwards compatibility, all while providing support for a wide range of browsers and devices. You can find the full list here: http://camendesign.com/code/video_for_everybody/test.html.

Syndicate content