10 October 2011
This article shows you how to use this customizable starter design for embedding HTML5 video in your websites. Read the overview to learn about the HTML5 Video Player widget used by this template, preview and download the template and related files and assets, and watch a short video to learn how you can customize this template.
One of the most anticipated features of HTML5 is its support for video. The video tag allows you to specify various parameters about your video, and then allows each browser the freedom to handle the video in its own way. Some browsers may use the video support provided within the operating system, such is the case with many tablets, or the browser may include player controls of its own for video playback.
An alternative option is to use a player that is consistent across browsers and devices, uses graphics and CSS to alter the design, and provides additional support for video playback for older browsers in the way of a Flash-based fallback solution. Fortunately, Adobe has provided just such a player, and it is available to Dreamweaver in the way of a widget. To gain access to this widget, open the Adobe Widget Browser and search for HTML5 Video Player.
See how you can embed an HTML5 video player in your web designs using the provided template. (Running time: 6:36)
Download the HTML, CSS, and source Photoshop files related to this template.
Tutorials and samples