HTML5 Cookbook: Solutions & Examples for HTML5 Developers

Christopher Schmitt · Kyle Simpson

Nov 2011 · "O'Reilly Media, Inc."

About this ebook

With scores of practical recipes you can use in your projects right away, this cookbook helps you gain hands-on experience with HTML5’s versatile collection of elements. You get clear solutions for handling issues with everything from markup semantics, web forms, and audio and video elements to related technologies such as geolocation and rich JavaScript APIs.

Each informative recipe includes sample code and a detailed discussion on why and how the solution works. Perfect for intermediate to advanced web and mobile web developers, this handy book lets you choose the HTML5 features that work for you—and helps you experiment with the rest.

• Test browsers for HTML5 support, and use techniques for applying unsupported features
• Discover how HTML5 makes web form implementation much simpler
• Overcome challenges for implementing native audio and video elements
• Learn techniques for using HTML5 with ARIA accessibility guidelines
• Explore examples that cover using geolocation data in your applications
• Draw images, use transparencies, add gradients and patterns, and more with Canvas
• Bring HTML5 features to life with a variety of advanced JavaScript APIs

Ratings and reviews

I can easily peg this book as a must-read for web designers and developers who wants to learn what HTML5 is and how to best use it. The HTML5 Cookbook is written in a Problem-Solution-Discussion pattern for each of its segments on a particular HTML5 feature, with plenty of references to external websites for more information and discussion. The segments are grouped in chapters that start with the most simple and common HTML features, to the most complex. Here's a summary of each chapter, with my review and take-away for them: Chapter 1: Fundamental Syntax and Semantics This chapter focuses on the new tags and changes to existing tags in the HTML5 specification, like modifications to the doctype, script and link tags, and introducing nav, header, and footer tags. There are dozens of these, and the Cookbook lists them individually, with concise descriptions for each item. Even though I was already familiar with most of the new tags and changes to syntax HTML5 provides, this chapter gave a lot of new information and insight about each one - the Cookbook cleared up some confusion I’ve had about the new article tag and section tag, and clarified how the HTML5 specification will affect accessibility and SEO. Chapter 2: Progressive Markup and Techniques This chapter explores more on semantics, markup styles, and browser compatibility. The discussion segments brings up Javascript fallbacks when a HTML5 feature isn’t supported by a user’s browser, and tools for analyzing your markup. Chapter 3: Forms HTML5 makes life easier for coding up forms, though many of these changes isn’t fully supported yet. This chapter goes over the new form features and each features current support (at the time of the publication, at least), and for several features, screenshots on how they will appear in each major browser. Honestly, in my studies in web design, I’ve skipped over the chapters or blog posts on HTML forms. I’ve found that subject to be complicated and boring. Though, the Cookbook’s chapter on HTML5 forms made the subject considerably more informative and digestible. Many of the new form features even look fun to experiment with, though the lack of browser support would mean it’ll be some time before I could safely use them in a practical website. Chapter 4: Native Audio Here, the Cookbook finally gets to a newly introduced HTML tag; <audio>. This chapter covers how the tag works, what audio files browsers recognize, attributes and functions that the audio tag uses, and related best practices tips. This is also the chapter where Javascript is first used in the Cookbook for enhancing and expanding the HTML5 functionality. Native audio is one of the biggest of the new HTML5 features, and one of the least supported by the big browsers. The Cookbook does a satisfactory job of pointing out this, explaining it, and comparing which browsers does and doesn’t support them (at the book’s publication, at least). It was at this chapter that I’ve started having trouble with this book - the author throws out snippets of Javascript to use, apparently assuming the reader is already very familiar with reading Javascript and experienced with implementing it. I’m not, so I didn’t understand what the Javascript was supposed to be doing. Chapter 5: Native Video This chapter is essentially the same as the previous chapter, but covering the <video> tag. The attribute syntax between <audio> and <video> is very similar, but there’s still enough differences in functionaliy and support. The Cookbook does a good job with covering the features, uses, and support, like with chapter 4. Chapter 6: Microdata and Custom Data This chapter begins with a brief description and history of microformats and microdata - tag attributes and information for defining the content within them, for use with search engines and other systems. The recipe sections here introduces the “item” and “data” attributes, their uses, and some Javascript functions to make them useful in some

Nice

89

About the author

Christopher Schmitt has been working on the Web since 1993. He is the principal of Heatvision.com, Inc., a new media design firm, and resides in Orlando, Florida. Christopher speaks frequently about web design at conferences including South by Southwest Interactive and Web Design World. His books include "Designing CSS Web Pages" (New Riders), "Professional CSS: Cascading Style Sheets for Web Design" (Wrox), and "CSS Cookbook" (O'Reilly).

Kyle Simpson is a UI architect from Austin, TX. He is passionate about user experience, specifically optimizing the UI to be as responsive, efficient, secure, and scalable as possible.He considers JavaScript the ultimate language and is constantly tinkering with how to push it further. If something can't be done in JavaScript or web technology, he's bored by it.He has a number of open-source projects, including LABjs, HandlebarJS/BikechainJS, and flXHR, and he also is a core contributor to SWFObject.