Propeople Blog

A regular dose of fresh news, events, products, Drupal development resources and more.

July 12, 2011

Working with HTML5 Video - Resources Roundup

HTML5 Video is an HTML5 element that allows you to play videos embedded in your websites and applications. This article is a compilation of some of the best and most interesting HTML5 Video related articles, tutorials, video tutorials, html5 video players and books we found useful. Check them out and discover the magic of HTML5 Video. Enjoy!

Articles & Tutorials

[w3schools] HTML5 Video

"Until now, there has never been a standard for showing video on a web page. Today, most videos are shown through a plugin (like flash). However, not all browsers have the same plugins. HTML5 specifies a standard way to include video, with the video element..." check it out

 

[html5rocks] Html5 Video

"The video tag is one of those HTML5 features that gets a lot of attention. Often presented as an alternative to flash in the media, the video tag actually goes beyond that. Although it's recently joined the rest of the ubiquitous HTML tags, its capabilities and support across browsers have increased at an amazing speed..." check it out

 

Decoding the HTML 5 video codec debate

"The increasingly competitive browser market has at last created an environment in which emerging Web standards can flourish. One of the harbingers of the open Web renaissance is HTML 5, the next major version of the W3C's ubiquitous HTML standard. .." check it out

 

Introduction to HTML5 video

"A long time ago, in a galaxy that feels a very long way away, multimedia on the Web was limited to tinkling MIDI tunes and animated GIFs. As bandwidth got faster and compression technologies improved, MP3 music supplanted MIDI and real video began to gain ground. All sorts of proprietary players battled it out — Real Player, Windows Media Player, etc..." check it out

 

Add HTML5 video to your site

"Embed native HTML5 video into your pages without plug-ins, and provide Flash-based fallback content for legacy browsers. Opera’s Vadim Makeev shows the way Want to add video to your site? HTML5 enables us to do this as easily as placing images with an element – and in this tutorial, we’ll show you how the magic is done..." check it out

 

[dbscripts] HTML 5 Videos

"This tutorial demonstrates how to use the HTML5 video tag to embed video in a web page without the use of a browser plug-in. It will also show how to use JavaScript to control the playback of the video..." check it out

 

The Ultimate HTML5 Video Guide

"Start here! Confused about what HTML5 video is? Not sure how to start using it on your site? Not sure why you’d want to? Start here..." check it out

 

How to incorporate video with HTML5

"One of the more controversial additions to HTML5, the video element, offers a plug-in free alternative to proprietary formats. If you would like to use the new HTML5 video element in your markup..." check it out

 

Serving HTML5 Video Cross Browser

"Is HTML5 video ready for prime time? I can’t give a definite answer to that question — but I can say that getting it to work cross browser, and that includes the iPad can be annoying..." check it out

 

Building a custom HTML5 video player with CSS3 and jQuery

"The HTML5 video element is already supported by most modern browsers, and even IE has support announced for version 9. There are many advantages of having video embedded natively in the browser, so many developers are trying to use it as soon as possible..." check it out

Also check out the HTML5 Video Player Comparison for more great HTML5 video players.

Books

 

The Definitive Guide to HTML5 Video

Plugins will soon be a thing of the past. The Definitive Guide to HTML5 Video is the first authoritative book on HTML5 video, the new web standard that allows browsers to support audio and video elements natively. This makes it very easy for web developers to publish audio and video, integrating both within the general presentation of web pages. For example, media elements can be styled using CSS (style sheets), integrated into SVG (scalable vector graphics), and manipulated in a Canvas. The book offers techniques for providing accessibility to media elements, enabling consistent handling of alternative representations of media resources.

check it out

 

HTML5: Up and Running

If you don't know about the new features available in HTML5, now's the time to find out. The latest version of this markup language is going to significantly change the way you develop web applications, and this book provides your first real look at HTML5's new elements and attributes. Even though work on HTML5 is ongoing, browsers such as Safari, Mozilla, Opera, and Chrome already support many of its features -- and browsers for smart phones are even farther ahead, especially iPhone's MobileSafari browser. With HTML5: Up & Running, you'll learn how this new version enables browsers to interact with JavaScript much more easily than before.

check it out

 

Creating Web Pages All-in-One For Dummies

Businesses, special-interest groups, families, and individuals are all relying on Web sites to communicate. This all-in-one guide offers one-stop shopping for all the information you need to put together powerful Web pages to get your point across and keep visitors coming back. Nine individual minibooks cover best design practices, online tools, Microsoft Expression Web, Dreamweaver, cascading style sheets, HTML and XHTML, graphics and multimedia, scripting, and Flash, arming you to create professional-looking pages.

check it out

 

The Essential Guide to HTML5

HTML5 opens up a plethora of new avenues for application and game development on the web. Games can now be created and interacted with directly within HTML, with no need for users to download extra plugins, or for developers to learn new languages. Important new features such as the Canvas tag enable drawing directly onto the web page. The Audio tag allows sounds to be triggered and played from within your HTML code, the WebSockets API facilitates real-time communication, and the local storage API enables data such as high scores or game preferences to be kept on a user's computer for retrieval next time they play. All of these features and many more are covered within The Essential Guide to HTML5.

check it out

 

Video Compression for Flash, Apple Devices and HTML5

Video Compression for Flash, Apple Devices and HTML5 is a professional reference for producers seeking to distribute video over the Internet and to mobile devices—particularly Apple iDevices. In this book, you will learn: The fundamentals of video streaming and compression, including adaptive streaming; H.264 encoding parameters for a range of streaming encoders, including Apple Compressor, Adobe Media Encoder, Sorenson Squeeze, Telestream Episode Pro and Rhozet Carbon Coder; The resolutions and data rates used by prominent US and European media, B2B and B2C sites, so you can configure your streaming video accordingly; etc.

check it out

 

Video Tutorials

 

Comprehensive video tutorial on HTML5

 

HTML5 Video: Basic JavaScript Interaction

 

HTML5 Video & Audio Tags Tutorial

 

How to make an HTML5 video player in under 5 minutes

 

Embed HTML5 Video for iPad

0 Responses to this post

Communicate!