Contents
About the Authors
About the Technical Reviewer
About the Cover Image Artist
Acknowledgments
Introduction
Chapter 1: Getting Started: Transitioning to HTML5
HTML5 = HTML • HTML5
Before HTML5
Why XHTML 2.0 died and HTML5 thrived
The WHATWG philosophy
The current state of HTML5
Anatomy of an HTML5 document
HTML terminology and concepts
Elements
Attributes
DOM
What's new in HTML5?
Backward-compatibility
Error handling
Simplified doctype
Simplified character encoding
New content model categories
New elements
Microdata
Embedded MathML and SVG
APIs
No longer SGML conforming (again!)
Obsolete features
Is XHTML gone?
What's all this noise about MIME types?
Deciding between HTML and XHTML
Web browser support
Web browser developer tools
Summary
Chapter 2: Using the Right Tag for the Right Job
Global attributes
Accessibility
Metadata
Identification
Editability
Spell-checking
Hiding elements
Drag-and-drop
Style
Text directionality
Custom data
Content model categories
Root element
Attributes of html element
Document metadata and scripting elements
Web page information: title and meta
Links, styles, and resources: base, link, and style
Adding behavior and fallbacks: script and noscript
Document sectioning elements
Semantic sectioning elements
Content grouping elements
The inevitable paragraph: p
Break in thought: hr
Retaining formatting: pre
Quoting text: blockquote
Lists
Diagrams, photos, illustrations: figure and figcaption
Creating divisions: div
Text-level semantic elements
Tabular data elements
Table basics
Adding table headers
Adding legends: caption
Adding structure: thead, tfoot, and tbody
Adding even more structure: colgroup and col
Form elements
Embedded content elements
Interactive elements
Showing more info: summary and details
Providing toolbars: menu and command
Summary
Chapter 3: Recognizing Semantics
What are semantics and why should I care?
Thinking in outlines
HTML5 outline algorithm
Implicitly creating an outline using heading content
Creating an outline using sectioning content
Improving outline semantics
Headers and footers
Using hgroup
Formatting a footer with an address
Determining header and footer contents
Viewing HTML5 outlines
Are divs (and spans) obsolete?
Case study: the City Press
Adding text-level semantics
Other text-level elements
Title of a work: cite
Formatting computer I/O: code, var, samp, kbd
Marking text edits: ins and del
Handling foreign scripts
Summary
Chapter 4: Form Mastery
Form markup refresher
Dissecting the form element
Form element attributes
Gathering input
Original input types
New input types
Validating and submitting forms
Making input required
Submitting forms using buttons and images
Other common input element attributes
Providing placeholder text
Making input read-only
Autocomplete and autofocus
Using data lists
Other form controls
Menus
Text boxes
Displaying progress
Displaying a gauge
Displaying calculated output
Cryptographic key generator
Adding structure with fieldsets and labels
Putting it all together
Page 1, gathering user details
Page 2, gathering commentary
Page 3, providing confirmation
Form usability
Use the right input for the right job
Keep it short and simple
Don't make me think, don't make me work, and don't try to trick me
Remember that the Internet is global
Provide a fallback when needed
Summary
Chapter 5: Multimedia: Video, Audio, and Embedded Media
Where it all began: img
Image maps
Embedding other media
The embed element
The object element
Embedding HTML: iframe
Handling content in the iframe element
New iframe element attributes
Targeting inline frames
Video
Video formats
The licensing issue
Handling video sources
Video attributes
Audio
Audio formats
Captions track
Encoding audio and video
Last but not least
Summary
Chapter 6: CSS3
The present state: CSS2.1
CSS3 modules
Using CSS
Attaching a style sheet
CSS style rules
Essential CSS selector syntax
Advanced selectors
Using selectors effectively
CSS Box Model
Backgrounds and borders
Basic background color and images
Multiple backgrounds
Rounded corners
Drop shadows
Color
Color on-screen
Functional notation syntax
Hue, saturation, lightness
Opacity
Web typography
Web fonts
Multiple columns
Text effects
Rules of typography
Summary
Chapter 7: User Interaction and the HTML5 APIs
Using JavaScript in this chapter
Accessing DOM properties and methods
Logging to the console
Events
The History API
Really simple Ajax
History-enabled Ajax
Building a custom video controller
Scripted 2D Canvas API
Drawing on Canvas
Canvas state
Canvas interactivity
Canvas animation
Drag-and-drop operations
Sorting a list using a drag-and-drop operation
Summary
Chapter 8: The Road Ahead
Challenges of the mobile Web
Responsive design
The viewport
Media queries
Offline application cache
Other HTML5 technologies
Microdata
Undo manager API
Upcoming CSS technologies
Summary
Appendix: Associated Technologies
Geolocation
Retrieving the current position
Watching the current position
SVG and MathML
Client-side storage
Web storage
Using web storage
Other storage options
Web workers
Web Sockets API
Video conferencing and peer-to-peer communication
WAI-ARIA
File API
Useful web resources
Index