HTML5 Multimedia Development Cookbook -- Table of Contents -- HTML5 Multimedia Development Cookbook -- Credits -- Foreword -- About the Authors -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers and more -- Why subscribe? -- Free access for Packt account holders -- Preface -- What this book covers -- What you need for this book -- Who this book is for -- Conventions -- Reader feedback -- Customer support -- Downloading the example code -- Errata -- Piracy -- Questions -- 1. Structuring for Rich Media Applications -- Introduction -- Setting up an HTML5 test area -- Getting ready -- How to do it... -- How it works... -- There's more... -- WebKit rendering engine -- Gecko rendering engine -- Trident rendering engine -- See also -- Using the header tag for logos and site titles -- Getting ready -- How to do it... -- How it works... -- There's more... -- Use elsewhere -- Content, not position -- Semantic naming -- See also -- Creating a table of contents using the nav tag -- Getting ready -- How to do it... -- How it works... -- There's more... -- Use elsewhere -- More semantic = more gooder -- Still evolving -- See also -- Using section tags to structure areas of a page -- Getting ready -- How to do it... -- How it works... -- There's more... -- Section doesn't equal div -- Section guidelines -- Still evolving -- See also -- Aligning graphics using the aside tag -- Getting ready -- How to do it... -- How it works... -- There's more... -- Not all s are alike -- Tip to remember -- Aside from -- See also -- Displaying multiple sidebars using the aside tag -- Getting ready -- How to do it... -- How it works... -- There's more... -- Pull quotes good for -- Remember to validate -- See also -- Implementing the footer tag -- Getting ready -- How to do it... -- How it works...

There's more... -- This happens usually -- Flexible footer content -- More flexible footer content -- See also -- Applying the outline algorithm -- Getting ready -- How to do it... -- How it works... -- There's more... -- Are you sure? -- An exception -- Remember accessibility -- See also -- Creating a stylish promo page in HTML5 -- Getting ready -- How to do it... -- How it works... -- There's more... -- Try sans shiv -- Mobile first -- IE evil? -- See also -- 2. Supporting the Content -- Introduction -- Structuring a blog article -- Getting ready -- How to do it... -- Put your code on a diet? -- How it works... -- There's more... -- Validation as an aid, not a crutch -- Eric Meyer's funny -- Where to find validators -- See also -- Highlighting text using the mark element -- Getting ready -- How to do it... -- How it works... -- There's more... -- long and prosper -- Waiting for browsers -- Is "future proof" a word? -- See also -- Using the time element -- Getting ready -- How to do it... -- How it works... -- There's more... -- Odd rules -- 's Time will come -- Always remember SEO -- See also -- Specifying the pubdate of an article -- Getting ready -- How to do it... -- How it works... -- There's more... -- Still waiting on browsers -- Extra credit -- Let's end confusion -- See also -- Displaying comment blocks using the article element -- Getting ready -- How to do it... -- How it works... -- There's more... -- Blog comments -- Value comments -- Opportunity's yours -- See also -- Adding fonts dynamically with @font-face -- Getting ready -- How to do it... -- How it works... -- There's more... -- Don't steal -- Firefox note -- Paul Irish rocks -- See also -- Adding drop-shadow effects to fonts -- Getting ready -- How to do it... -- How it works... -- There's more... -- Browser support -- With great power… -- A plea to all readers.

See also -- Applying gradient effects to fonts -- Getting ready -- How to do it... -- How it works... -- There's more... -- See also -- Annotating visual elements using the figure and figcaption tags -- Getting ready -- How to do it... -- How it works... -- There's more... -- Grouping's good -- Semantics are valuable too -- vs -- See also -- 3. Styling with CSS -- Introduction -- Setting elements to display:block -- Getting ready -- How to do it... -- How it works... -- There's more... -- No need to repeat and repeat and repeat and repeat and repeat -- Style once -- Echoes of the past -- See also -- Styling a nav block element -- Getting ready -- How to do it... -- How it works... -- There's more... -- Browser support -- Text-shadow is cool -- See also -- Using background-size to control background appearance -- Getting ready -- How to do it... -- How it works... -- There's more... -- Browser support -- Acceptable in IE -- Simple Scott simply rocks -- See also -- Adding rounded corners with border-radius -- Getting ready -- How to do it... -- How it works... -- There's more... -- Browser support -- Acceptable in IE -- Devin's Heaven goes to 11 -- See also -- Including multiple background images -- Getting ready -- How to do it... -- How it works... -- There's more... -- Where's the content? -- Let's be Frank -- See also -- Adding a box shadow to images -- Getting ready -- How to do it... -- How it works... -- Browser support -- Ignorance is bliss -- Box-shadow for The Box -- See also -- Styling for Internet Explorer browsers -- Getting ready -- Border-radius -- Box-shadow -- Text-shadow -- Note -- See also -- 4. Creating Accessible Experiences -- Introduction -- Testing browser support -- How to do it... -- How it works... -- There's more... -- With an eye to the future -- What Modernizr really does -- Do it for the right reasons.

See also -- Adding skip navigation -- Getting ready -- How to do it... -- How it works... -- There's more... -- Full browser support -- Less equals more -- See also -- Adding meta tags -- Getting ready -- How to do it... -- How it works... -- There's more... -- Whatchu talkin' 'bout? -- It all comes back to SEO -- Did I do that? -- See also -- Using semantic descriptions in tags for screen readers -- Getting ready -- How to do it... -- How it works... -- There's more... -- Always improve -- Semantics for good SEO -- Greg finally learned -- See also -- Providing alternate site views -- Getting ready -- How to do it... -- How it works... -- There's more... -- Min-width -- My math teacher was right -- Is bigger always better? -- See also -- Using hgroup to create accessible header areas -- Getting ready -- How to do it... -- How it works... -- See also -- Displaying alternate content for non-supported browsers -- Getting ready -- How to do it... -- How it works... -- See also -- Using WAI-ARIA -- Getting ready -- How to do it... -- How it works... -- There's more... -- Still awaiting browser support -- That's how I role -- Accessibility first -- See also -- 5. Learning to Love Forms -- Introduction -- Displaying placeholder text -- How to do it... -- How it works... -- There's more... -- Text only -- Embrace italics -- Browser support -- See also -- Adding autofocus to form fields -- How to do it... -- How it works... -- There's more... -- One per page -- Older browsers -- Browser support -- See also -- Styling forms using HTML5 and CSS3 -- How to do it... -- How it works... -- There's more... -- Older browsers -- Test, test, test -- About pseudo classes -- See also -- Using the e-mail input type -- How to do it... -- How it works... -- There's more... -- Browser support -- No JavaScript -- Validation evolution -- Adding a URL using the URL input type.

How to do it... -- How it works... -- There's more... -- Browser support -- No JavaScript -- What's next? -- See also -- Using the number tag -- How to do it... -- How it works... -- There's more... -- Browser support -- No JavaScript -- Using the range tag -- How to do it... -- How it works... -- There's more... -- Use caution -- No JavaScript -- Browser support -- See also -- Creating a search field -- How to do it... -- How it works... -- There's more... -- Why fix perfection? -- Browser support -- Search results -- See also -- Creating a picker to display date and time -- How to do it... -- How it works... -- There's more... -- Browser support -- If all else fails -- See also -- 6. Developing Rich Media Applications Using Canvas -- Introduction -- Setting up the canvas environment -- How to do it... -- How it works... -- There's more... -- He's smart -- What am I sayin'? -- What's next for ? -- See also -- Understanding the 2d rendering context -- How to do it... -- How it works... -- There's more... -- You can master -- X, meet Y -- Respect my authority! -- See also -- Processing shapes dynamically -- How to do it... -- How it works... -- There's more... -- Any way you want it -- Similar to tables? -- Be a square first -- See also -- Drawing borders for images using canvas -- How to do it... -- How it works... -- There's more... -- Style first -- Many color values work -- I like big borders and I cannot lie -- See also -- Rounding corners -- How to do it... -- How it works... -- There's more... -- Just like the Scholastic Aptitude Tests -- What about IE? -- We're laying a foundation -- See also -- Creating interactive visualizations -- How to do it... -- How it works... -- There's more... -- Evil of two lessors -- What about fallback content? -- Take him up on his offer. -- See also -- Bouncing a ball -- How to do it...

How it works...