Preface

We know you want to learn about all the wonderful and exciting developments that come with HTML5, like web forms, canvas, and local storage. But we also know the importance of establishing a good foundation for advanced development. Let’s first put HTML5 into a bit of context.

What Is HTML5?

HTML5 is a specification (see http://dev.w3.org/html5/spec/) under development by the World Wide Web Consortium (W3C). As we write this book, the HTML5 specification is officially a Working Draft, which means it may go through additional revisions before becoming a recommendation. The recommendation will then go through a formal approval process, resulting in a specific version of the markup language.

Meanwhile, independent from the W3C, the Web Hypertext Application Technology Working Group (WHATWG) also pursues development of the HTML specification (see http://whatwg.org/html).

Notice I didn’t mention a version number. That’s because the WHATWG recently decided to change tack and drop versioning entirely. A “living standard” is now how WHATWG defines HTML (see http://blog.whatwg.org/html-is-the-new-html5). This new development model means that HTML is defined according to how it’s evolving, not as a version tied to features in a “snapshot” of time.

Feature Support, Not Browser Versions

What does this mean for us designers and developers? It could lead to a greater focus on implementing individual features, rather than a full specification: no more “this is an HTML5 site,” but instead “this site features web sockets and geolocation.”

Then again, some in the industry argue that designers and developers need stable specifications to refer to in order to validate and maintain their sites effectively. Plus, having a stable “what is true now” version makes authoring and teaching more manageable.

In the end, it could all just be fodder for yet another geek debate (my money’s on Batman over Spider-Man and Peter Davison as the best Doctor), but we mention it mostly as a point of clarification that we have two development models and a reminder of the rather interesting politics involved in the specification processes.

Five Alive

Even though WHATWG sees “HTML” as a living document that needs no version number, in this book “HTML5” is our preferred term. Why is that? For the purposes of your daily design/development life, understanding and implementing features is what’s important.

Since the whole point of the Cookbook series is to provide you with practical recipes you can use today, let’s talk support for HTML5. Generally speaking, all of today’s latest browsers support HTML5 to some degree or another. But, like its predecessors, HTML5 doesn’t have that 100% browser support that we sadly suspect we’ll always be dreaming of.

Enter JavaScript

While HTML5 markup has plenty of exciting new features, as you’ll see in this book, it also involves—more than ever before—a host of related web technologies, many of which rely on rich JavaScript APIs to expose themselves to your web pages.

In an effort to give you a full taste of what HTML5 and these related technologies have to offer, we will not shy away from the JavaScript details. This book will, at times, take a very heavy JavaScript perspective, as we discuss some of those advanced functionalities that various HTML5 APIs make available to us.

If JavaScript is a scary or unfamiliar topic for you, now’s the perfect time to brush up on those skills—if you’re serious about using HTML5, you’ll almost certainly want to get comfortable with leveraging at least some of what JavaScript has to offer.

It’s also important to note that many of these APIs are still evolving, even as this book is being written, edited, revised, and published. Some are more complete than others, and thus are likely to be more stable. Other APIs are still in a state of frequent fluctuation, so you should keep that in mind as you decide how you will employ HTML5 technologies in your pages.

What’s in This Book

While we may not provide a full list of all the features of HTML5 and browser support for them—depending on the recipe—we do discuss the support for each of the individual elements and implementations covered throughout this book (for tips on finding out what browsers currently support what parts of the specification, see Recipe 2.3).

We also cover workarounds to implement when browser support is patchy, and why you may or may not need them. This way, you can decide for yourself if a particular feature works for you, your client, or your employer.

And that’s our value to you, dear reader. Using HTML5 isn’t an absolute proposition. You don’t have to use embedded content or web sockets to use the new structural elements, and vice versa. You don’t even have to use the new structural elements to have a valid HTML5 document; you just need the Document Type Definition.

Note

If you find yourself asking “what’s a Document Type Definition?,” start your adventure into HTML5 by checking out Recipe 1.1!

Pick what works for you and leave the rest. Or, rather, experiment with the rest to see if you may find a practical implementation for yourself or your projects.

Our industry is like HTML in a lot of ways, and probably always will be: it’s constantly changing.

And we, as the good web designers and developers that we are, have to continue staying on top of those latest changes and developments. We have to continue to educate our clients and employers about the benefits and compromises. We have to experiment with moving targets and constantly grow our skills.

Honestly, though, that all sounds pretty good to us. So, let’s start coding some HTML5, shall we?

Audience

While it would probably suffice to say that this book is for any person interested in learning about HTML5, it was particularly designed and developed for web developers who want to transition from XHTML or HTML4 into new technologies.

The chapters toward the end of the book are geared more for developers who want to utilize some of the JavaScript APIs found in HTML5.

Assumptions This Book Makes

You don’t want a rundown of the HTML5 specification. Rather, you want to make things work as they relate to your job. In each of this book’s recipes, the Solution gives you the quick and dirty answer to the problem presented. Check out the Discussion for greater coverage.

You could start from the beginning of the book and make your way through it in a linear fashion without feeling lost. With one or two exceptions, the chapters’ recipes are set up so that they build off of each other. One of the great things about the books in the Cookbook series, though, is that they’re here to help you out when you find yourself with a specific problem—in this case, an HTML5-related problem. Simply crack open the book or the ebook on your tablet and find the right recipe for a practical, usable solution.

And one more thing: we assume that geolocation will forever be linked to HTML5. Even though we know, yes, that W3C Geolocation API Working Draft is separate from the HTML5 specification. That hasn’t stopped people from writing blog posts, tutorials, and even books about putting geolocation into the same conversation as HTML5. And since it’s such a great, serviceable API right now, we felt we had to include it in a book about HTML5 (see Chapter 8). If it troubles you, think of Geolocation and other technologies as “HTML5 and friends.” However, this book probably isn’t for you if you require hyper-technical hierarchies to be adhered to in order to obtain practical knowledge.

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic

Indicates new terms, URLs, email addresses, filenames, and file extensions.

Constant width

Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.

Constant width bold

Shows commands or other text that should be typed literally by the user.

Constant width italic

Shows text that should be replaced with user-supplied values or by values determined by context.

Tip

This icon signifies a tip, suggestion, or general note.

Caution

This icon indicates a warning or caution.

Using Code Examples

This book is here to help you get your job done. In general, you may use the code in this book in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “HTML5 Cookbook by Christopher Schmitt and Kyle Simpson (O’Reilly). Copyright 2012 Christopher Schmitt and Kyle Simpson, 978-1-449-39679-4.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at .

Safari® Books Online

Note

Safari Books Online is an on-demand digital library that lets you easily search over 7,500 technology and creative reference books and videos to find the answers you need quickly.

With a subscription, you can read any page and watch any video from our library online. Read books on your cell phone and mobile devices. Access new titles before they are available for print, and get exclusive access to manuscripts in development and post feedback for the authors. Copy and paste code samples, organize your favorites, download chapters, bookmark key sections, create notes, print out pages, and benefit from tons of other time-saving features.

O’Reilly Media has uploaded this book to the Safari Books Online service. To have full digital access to this book and others on similar topics from O’Reilly and other publishers, sign up for free at http://my.safaribooksonline.com.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

O’Reilly Media, Inc.
1005 Gravenstein Highway North
Sebastopol, CA 95472
800-998-9938 (in the United States or Canada)
707-829-0515 (international or local)
707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at:

http://shop.oreilly.com/product/0636920016038.do

To comment or ask technical questions about this book, send email to:

For more information about our books, courses, conferences, and news, see our website at http://www.oreilly.com.

Find us on Facebook: http://facebook.com/oreilly

Follow us on Twitter: http://twitter.com/oreillymedia

Watch us on YouTube: http://www.youtube.com/oreillymedia

Acknowledgments

We can’t see it, but time is an invisible dimension that surrounds us all.

Yet time is so very interesting in that it can be marked so well.

For instance, it can be marked by the due dates and deadlines of which a book of this sort is composed. So many, many deadlines.

When writing a book, for example, there is a deadline for the original manuscript.

Then there are the changes to the manuscript provided by many talented people like editors, technical editors, copyeditors, artists, designers, and so on.

They each give writers their deadlines, marking time.

Editorial deadline, technical edits deadline, copyedits deadline, art deadline, and so on.

Deadlines upon deadlines as time is.

Then there is another way time is marked.

The time away from loved ones.

After writing several books, I now know that writing a book is a Herculean task in that it keeps time away from other activities, like fun and family—something I wouldn’t wish on anyone.

But then friends aren’t just anyone, right?

Along with my co-lead author, Kyle Simpson, I congratulate and thank the contributors to the HTML5 Cookbook: Emily Lewis, Kimberly Blessing, Christina Huggins Ramey, Anitra Pavka, Marc Grabanski, and Christopher Deustch.

Thanks to our technical editors, Shelley Powers, Ben Henick, Dusty Jewett, Molly Holzschlag, and Helen Oliver, who diligently kept us on our toes.

Our copyeditor, Rachel Head, is a miracle worker, making our respective families proud by making them think we all are better writers than we probably are.

Many, many thanks to editors Simon St. Laurent and Courtney Nash from O’Reilly, who helped me stay sane during our time on this book.

Every once in a while I tried to count up how many total years of web development experience were brought to this project by all the talented writers and editors who contributed, but I got a bit too exhausted just thinking about it.

I’m not sure if all these talented, beautiful people knew what they signed up for when I first talked to them about the HTML5 Cookbook, but I’m happy with what we were able to make together. And I thank them for that.

Finally, thanks to my family and loved ones who have been there for me throughout my obsession with web design and development. Let’s continue to share good times together.

Christopher Schmitt

http://christopherschmitt.com

http://twitter.com/@teleject

I would like to thank my wonderful and patient wife, Christen, for letting me be part of this project. I also want to thank my parents for their support and encouragement in all my various endeavors. Lastly, to my new son, Ethan, I hope someday you are happily coding along in HTML12 and you get to look back on this old HTML5 book with nostalgia. Just remember, I had to walk to school in the snow, uphill, both ways...

Kyle Simpson

http://blog.getify.com

http://twitter.com/@getify

Thank you to Christopher Schmitt for giving me the opportunity to contribute to this book. I’d also like to thank Rey Bango, who recommended me to Christopher and who has given me so many opportunities to write about what I love. Following the pimpage chain, I must thank Christian Heillman for recommending me to Rey in the first place and for always encouraging me to share what I know.

To my love, Jason, thank you for supporting me in everything I do and reminding me that new opportunities are never as scary as they first seem. Thank you, also, for reading everything I write and making sure I don’t sound stupid. You make my life bigger and better than I ever dreamed.

To my other unofficial editors, Brian Arnold and Ian Pitts, thanks for taking the time over the months (and years) to read my work and offer critical feedback. You guys are not only brilliant developers, but you are great friends.

Thanks to my sister, Erin, for reminding me who I am and what is important in this world. And to my sista, Erin Shutes, thank you for 20 years of support through the best and worst of times.

To the readers of my blog, my social-network friends, and everyone I’ve met at conferences, thanks for being interested in what I have to share and for sharing back. You remind me every day why I love what I do.

Emily Lewis

http://emilylewisdesign.com

http://twitter.com/@emilylewis

I would like to thank my friend Christopher Schmitt for inviting me to contribute to this book; my students at Bryn Mawr College and my colleagues at Comcast Interactive Media for constantly challenging me; my mother and my great-aunt for their encouragement; and my cat, Punky, for her support.

Kimberly Blessing

http://www.obiwankimberly.com

http://twitter.com/@obiwankimberly

Thank you, Molly Holzschlag and Cameron Barrett, for encouraging me to share my geeky learnings.

(Of course) thank you, Christopher Schmitt, for convincing me to contribute to this book.

Thank you, Matt May, for your feedback as I considered what to write for this book.

I’d also like to thank all of the other wonderful people I’ve met at web conferences and networking events over the years. You are too many to name. Y’all inspire me to learn and laugh.

Thank you, Mom and Dad, for… well, everything.

I also want to thank our readers—you—for caring enough about your art to hone your skills. Your curiosity, knowledge, and empathy will advance the Web.

Anitra Pavka

http://anitrapavka.com

http://twitter.com/@apavka

A hearty thanks to Christopher Schmitt for continually providing me with opportunities for expanding my knowledge of web design. You’ve pushed me to develop my writing and coding skills far beyond my modest ambitions.

Thank you, my sweet husband, Paul Ramey, for providing support and patience while I research, code, and write. And thank you for providing welcome distractions when I’ve worked too long!

Christina Huggins Ramey

http://www.christinaramey.me

http://twitter.com/@fidlet

Thanks to Christopher Deutsch for taking the geolocation chapter content ideas and running with them.

Marc Grabanski

http://marcgrabanski.com

http://twitter.com/@1Marc

Get HTML5 Cookbook now with the O’Reilly learning platform.

O’Reilly members experience live online training, plus books, videos, and digital content from nearly 200 publishers.