Home / Articles / Adobe Dreamweaver / Presenting HTML5 Video with Dreamweaver CS5

Presenting HTML5 Video with Dreamweaver CS5

Article Description

Want to present video in your Dreamweaver-built website, but not sure you want to use Flash video? David Karlins, author of Adobe Creative Suite 5 Web Premium How-Tos: Essential Techniques, has the solution. This tutorial shows you in easy-to-follow steps how to work with Dreamweaver in your site to implement HTML5 video that will work with many browsers.
Installing the Dreamweaver HTML5 Pack

Installing the Dreamweaver HTML5 Pack

As I explained in the preceding section, the HTML5 Pack is more than "just another Adobe extension." In effect, it's a significant incremental upgrade in Dreamweaver CS5, and therefore a must-have for Dreamweaver CS5 users.

As the author of "the last book out of the gate" on web design with Dreamweaver CS5, I was able to include substantial coverage of the HTML5 Pack in my book Adobe Creative Suite 5 Web Premium How-Tos: Essential Techniques. My article "Embedding HTML5 Audio with Dreamweaver CS5" briefly discusses media queries, the most substantial new feature in the HTML5 Pack. For this article, we'll focus exclusively on using the HTML5 Pack's code hints to embed video with the HTML5 Video element.

Follow these steps to download and install the HTML5 Pack:

  1. At the Adobe Labs Downloads page, follow the instructions to download the Dreamweaver CS5 HTML5 Pack for your operating system (Windows or Mac). A link to the CS3/CS4 version of the extension is available as well.
  2. With the extension downloaded, launch Dreamweaver CS5.
  3. From the main Dreamweaver CS5 menu, choose Commands > Manage Extensions. The Adobe Extension Manager CS5 opens.
  4. Click Install at the top of the Extension Manager and navigate to the .zxp extension file you just downloaded.
  5. Click Select, and the extension will install. After installation is complete, read a description of the extension, using the scrollbar as needed to scroll the file.
  6. Exit and relaunch Dreamweaver CS5 to access the features in the CS5 Pack.
3. Creating a Dreamweaver Site and New Web Page | Next Section Previous Section