Archive for HTML5

HTML5: Standardize on MP4 (mostly)

Monday, January 20th, 2014

One of the most significant issues holding back wide deployment of HTML5-compatible video was the disparity of support between browsers. Back in 2011, we opined on the best approach to deliver video online which, at that time, was using Flash.

Oh how things have changed.

About a year later, we furthered our thoughts on web-delivered video noting how the HTML5 movement had made solid progress.

And so now, again about a year later, we find that with Cisco’s recent contribution of their h.264 codec to the open-source community, Mozilla now has a way to integrate that codec support into their browsers (in a away they are comfortable with).

So the overall outcome? All major browsers now support MP4/h.264 video.

Huzzah! (?)

Finally no more reason for web video to be output to multiple versions (again)…unless you find dogmatic or perceptive reasons to… Otherwise, one MP4/h.264 source file should suffice for all current browsers across all (or at least most) devices.

See this page on the JWPlayer (formerly ‘Longtail Video’) website, specifically #2 “Media Formats”). Below is a screenshot of that section, for posterity, as that page is updated regularly by the good folks maintaining that site.

Now for the next big thing…a standard for support true-streaming video via HTTP! ‘Progressive Downloading’ of video works now – link to a video and it’ll start downloading to your device, and the device player will likely start playing that video back as soon as it can…
…but you can’t skip ahead and have the video quickly pickup at that point; to do so requires ‘true’ (“Adaptive”) streaming capabilities – like from a media server. Adobe’s RTMP protocol handled that well during the reign of Flash video. Now with web video (i.e. MP4), what’s the alternative?

There’s nothing standardized yet but ‘HTTP Live Streaming’ (“HLS”), developed by Apple, seems to have the lead…though there are several potential streaming protocol options integrated with a variety of media servers and end-clients. So until a ‘standard’ is determined, and that standard integrated into the various browsers and operating systems…well, there’s still a wait involved with adaptive streaming (and DRM). For now, barring any of those requirements for a given project, we’ll be settling on a general MP4/h.264 standard for our projects in most cases. How about you?

Categories :

HTML5, Support, Browsers, and Mobile

Monday, December 17th, 2012

Today’s news, just in time for the new year, is the HTML5 specification has been finalized.

“W3C published today the complete definition of the HTML5 and Canvas 2D specifications. Though not yet W3C standards, these specifications are now feature complete, meaning businesses and developers have a stable target for implementation and planning.”

Per that quote, this is a great step forward, but does not mean HTML5 content is ready for broad consumption. With the specification finalized (if it is truly ‘finalized’, revisions are inevitable), now it’s up to the browser and tool developers to fully support the spec. Per the press release,

“However, the same survey shows that ‘browser fragmentation’ remains an important developer concern, as it increases the cost and complexity of using a technology.”

To address this concern, the next challenge for the W3C is “devoted to interoperability and testing”, which simply means they will continue to encourage and test browser and tool releases against the spec, likely refining test environments and whatever other consultation and encouragement they can provide. However, note that the whole ‘HTML5 world’ also requires support of new iterations of the JavaScript and CSS specifications, which are actually separate standards.

Regardless, some tool providers are enthused! Sencha provides a development framework for HTML5 applications and is now sponsoring an ‘HTML5 is Ready’ contest for developers who re-create default native apps (i.e. Calendars, Weather, Stocks) as web applications using the HTML5 and Sencha framework.

In the eLearning world, this puts more pressure on authoring tool providers like Adobe (Captivate) and Articulate (Storyline) to more-quickly improve their HTML5 publishing. That’s a good thing too.

But the real pressure needs to be put on the browser developers (Firefox, Microsoft, Apple, Opera, etc.) to full integrate these features into their upcoming releases. All these browsers have issues with proper HTML5 rendering, especially with Video.

A quick test of the latest Firefox (v.17) using the ‘HTML5 Test’ website shows no support for subtitling and still no support for MP4/h.264, which is certainly the most popular video format/codec today. The total score is “388 out of 500”.

Microsoft’s IE 9, running under Windows 7, scores a measly 138 out of 500. At least it supports h.264…

Now those are ‘desktop’ browsers, so who really cares how HTML5-supporty they are? What matters is mobile browsers…and that’s true enough…but the point is to illustrate just how far browsers, and related tools, still have to go to bring HTML5 to the masses.

For example, Facebook recently changed over their Android App to completely ‘native’ code instead of trying to wrap their HTML5 code, resulting in the declaration that “Facebook’s HTML5 app nightmare is over.” Whether that’s true, we’ll see! Facebook itself is certainly not abandoning HTML5 entirely,

“Facebook’s mobile site will still run on HTML5. It will also continue pushing for better HTML5 standards from mobile browser vendors in hopes it can one day do more with the protocol.”

This is just one example of how HTML5 is not the mobile panacea so many seem to expect – at least, not yet. Everything now largely depends on the tool makers to get their products current…which means not only HTML5 support alone, but JavaScript and CSS support as well.

A final concern for this post is just how robust and demanding these fully-compliant browsers and tools will be. It’ll be nice to not have to go find and install a plugin (i.e. Flash) when the media is encountered the first time, because support for that media will be built-into the browser (audio, video, animation, etc.). But we wonder just how large these browsers are going to be with all that additional code…and how much of the system’s resources are they going to demand? Apple’s assertions that Flash was too resource-intensive for their mobile devices may have had its truths, but are browsers with all this additional codebase going to be any less demanding?

And when a plugin crashes (i.e. Flash) modern browsers can isolate that crash so the whole browser doesn’t come crashing down with it. Will that also happen with these fully-compliant HTML5 browsers? Or when a crash inevitably happens, is the whole application going to come tumbling down?

We’ll see what happens in 2013!

Categories :

Thoughts on Flash, HTML5, and video

Friday, February 10th, 2012

The HTML5 engine continues to gather steam!

However, Flash remains a completely viable option for a variety of rich-media experiences – the level of HTML5 support and features across the variety of platforms and devices is simply not far enough along or consistent enough to go with an HTML5 solution for RIA’s or video at this time.

For example, see the charts and their related direct links below as reference:

http://gs.statcounter.com/



http://marketshare.hitslink.com/browser-market-share.aspx?qprid=0&qpcustomd=0
http://marketshare.hitslink.com/browser-market-share.aspx?qprid=0&qpcustomd=1

So plainly the ‘browser wars’ are dragging on, which is a good thing! Competition brings about innovation and prevents any given browser from stagnating. The race for HTML5 support certainly serves to hasten that competition as well. But, of course, as with any new technology or standard, there’s lots of work to be done! For example, here’s an interesting chart showing the breakdown between a variety of browsers and HTML5 features:

http://www.findmebyip.com/litmus/

If you’re curious about the browser you happen to be using now, check out the HTML5 Test site.

So all that said, HTML5 support still has a long way to go for general support and even further to completely supplant Flash, and especially where video is concerned. Sure, HTML5 is coming along fairly well in general video support – for example, this in-depth article is already a bit outdated – but there are still significant issues to address between codec agreements and DRM. Let’s take a quick look at the codec support issue. Here’s a great chart by Longtail Video:


http://www.longtailvideo.com/html5/

In fact, LongTail Video has an excellent article on ‘The State of HTML5 Video’ which is definitely worth a read for anyone interested in digging into the complexities of current HTML5 video support and delivery (market share, codecs, video tags, accessibility, etc.).

Of course, there are lots of ways coming about to handle HTML5 video, from open solutions to proprietary players. If nothing else, the push to HTML5 is sure opening up a new services market! Take a look at this chart showing a range of HTML video players:

http://praegnanz.de/html5video/

(that image only shows about half of what is available!)

For a bit more pain and pleasure reading, check out Robert Reinhardt’s ‘The World of Pain that is HTML5 Video’ which really helps bring the whole picture into focus…at least, as much focus as can be found in the current HTML5 growth-spurt. The complexities involved with simply handling graceful delivery of just video via HTML5 and the variety of platforms and browsers is a just a subset of all the other components to be considered… Just wait until we get further into Canvas support! Designers may be pining for the days of good old Flash and the cross-platform/browser consistency.

There are several excellent resources out on the web to help determine what features may be ‘worthwhile’ in an HTML5 environment, best practices, and which may be better left aside (or help determine whether an HTML5 solution is feasible for your project at all). These sites include HTML5 Please and Can I Use, both providing recommendations and tables on maturity level across browsers, HTML5 Boilerplate, providing a handy ‘getting started’ template, and CSS3 Please, allowing real-time CSS template edits and results within the visiting browser.

Also note that Adobe recently released Adobe Edge Preview 4. This tool shows some good promise to put a nice UI on top of the complexities of HTML5…in tradition similar to tools like Dreamweaver. It’s only available for Vista or Windows 7 for now, however, so XP users…that’s one more reason to upgrade.

Categories :

Adobe and HTML5

Wednesday, August 3rd, 2011

In an example of their commitment to tools and productivity, which is not only wise from a business standpoint but also to help dispel the idea that Flash is the only property that matters…
…Adobe has recently released the first public preview of Adobe Edge – their “HTML5” animation tool.

While I’m sure Flash remains a far more robust development platform, it’s nice to see attention being paid to other technologies, and perhaps tools that offer less of a learning curve. It’s a first release, so don’t get too hung up on things like it doing div-based/JQuery animations (as opposed to pure SVG or Canvas manipulation…so it’s minimally “HTML5”)… I’m sure the more advanced features are coming…especially as the browsers and spec continue to evolve too.

Also recently launched is a new site to serve both a resource and a showcase highlighting and providing information on new HTML5 and CSS3 features.

The site itself makes extensive use of new features such as CSS3 Transitions, CSS3 Transform, and web storage as a resource for learning more about HTML5 and CSS3.

Just a few things to keep your eyes on!

Categories :