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.
The Definitive Guide to HTML5 Video dives deep into the markup that is introduced for media element support in browsers. You’ll explore the default user interface offered through browsers for media elements, as well as the JavaScript API provided to control their behavior. You’ll also learn how to account for H.264 and Ogg Theora codecs.
What you’ll learn
- How to create cross-browser markup in HTML to include audio and video into your web pages
- How to replace the default controls of web browsers with your own or ''skin'' your media player
- How to use the JavaScript API for media elements
- How to integrate media elements with other HTML5 constructs such as CSS, SVG, Canvas, or Web Worker Threads
- How tp make audio and video accessible
- How to use media fragment URIs to address certain temporal subparts or tracks of a media resource
- The open source tools available to deal with the new HTML5 media elements
Who this book is for
This book is for those who are proficient in authoring and publishing Web pages, but have never utilized audio and video. It will also benefit old buffs of Adobe Flash, Microsoft Silverlight, or QuickTime who are trying to understand what is happening in HTML5 media and how to use the new media elements.
Table of Contents
- Introduction
- Audio and Video Elements
- CSS3 Styling
- JavaScript API
- HTML5 Media and SVG
- HTML5 Media and Canvas
- HTML5 Media and Web Workers
- HTML5 Audio API
- Media Accessibility and Internationalization
- Audio and Video Devices
Author(s): Silvia Pfeiffer
Series: Expert's Voice in Web Development
Edition: 1
Publisher: Apress
Year: 2010
Language: English
Pages: 337
Prelim......Page 1
Contents at a Glance......Page 6
Contents......Page 7
About the Author......Page 12
About the Technical Reviewer......Page 13
Acknowledgments......Page 14
The Challenge of a Definitive Guide......Page 15
Contacting the author......Page 16
1.1 A Bit of History......Page 17
1.2 A Common Format?......Page 18
1.3 Summary......Page 23
2.1.1 The Video Element......Page 25
Fallback Content......Page 27
@src......Page 28
@loop......Page 29
@poster......Page 30
@width, @height......Page 31
@controls......Page 33
@preload......Page 34
2.1.2 The Audio Element......Page 36
@loop......Page 37
@preload......Page 38
@src......Page 39
@type......Page 40
@media......Page 44
2.1.4 Markup Summary......Page 45
2.2.1 Encoding MPEG-4 H.264 Video......Page 46
2.2.2 Encoding Ogg Theora......Page 48
2.2.3 Encoding WebM......Page 50
2.3 Publishing......Page 51
2.3.1 Web Server and HTTP Progressive Download......Page 52
2.3.2 Streaming Using RTP/RTSP......Page 53
2.3.3 Extending HTTP Streaming......Page 54
2.4.1 Visible controls......Page 57
2.4.2 Context Menus......Page 61
2.4.3 Controls Summary......Page 63
2.5 Summary......Page 64
CSS3 Styling......Page 65
3.1 CSS Box Model and Video......Page 66
3.2.1 Inline Box Type......Page 68
3.2.2 None Box Type......Page 70
3.2.4 Relative Positioning Mode......Page 71
3.2.5 Float Positioning Mode......Page 74
3.2.6 Absolute Positioning Mode......Page 75
3.2.7 Video Scaling and Alignment Within Box......Page 76
3.3 CSS Basic Properties......Page 78
3.3.1 Opacity......Page 79
3.3.2 Gradient......Page 80
3.3.3 Marquee......Page 82
3.4.1 Transitions......Page 84
3.4.2 2D Transforms......Page 86
3.4.3 3D Transforms......Page 87
3.4.4 Putting a Video Gallery Together......Page 90
3.5 CSS Animations......Page 92
3.6 Summary......Page 94
JavaScript API......Page 97
4.1 Content Attributes......Page 98
4.2 IDL Attributes......Page 99
4.2.1 General Features of Media Resources......Page 100
4.2.2 Playback-Related Attributes of Media Resources......Page 113
4.2.3 States of the Media Element......Page 123
4.3 Control Methods in the API......Page 138
4.4 Events......Page 143
4.5 Custom Controls......Page 146
4.5 Summary......Page 150
SVG Features......Page 151
SVG for Masking......Page 152
Shapes as a mask......Page 153
5.3 SVG Text and