Tip 21Embedding Video

AwesomeCo wants to showcase its new series of training videos on its website, and it wants the videos to be viewable on as many devices as possible, especially on the iPad. As a trial, we’ve been provided two videos in the “Photoshop Tips” series, which we’ll use to build a prototype. Thankfully, we’ve been given the video files in H.264, Theora, and VP8 formats, so we can focus on creating the page. (If you want to learn more about encoding your own video files, check out Appendix 3, Encoding Audio and Video for the Web.)

The <video> tag works exactly like the <audio> tag. We just need to provide our sources, and Chrome, Firefox, Safari, Safari on iOS, and Internet Explorer 9 display the video without any additional plug-ins. ...

Get HTML5 and CSS3, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.