Using HTML5: Do I Really Have To?

htnl5If you have been living under a rock for the last two years, you might not have heard that there’s a major update to HTML (or HyperText Markup Language if your rock residency has been longer than two years) that is going to affect…well…everyone.

So the quick answer to “Do I Really Have To?” is, yes, yes you do. The long answer is the same, just with more details. It’s time to jump into using HTML5, and the sooner, the better. You won’t regret it.

(Tip: If you’re still using Framesets in your HTML, you need to do this yesterday.)

A Brief History of HTML

HTML4 has been the standard since 1997, and it’s been the tool for creating web pages and HTML output of all kinds for, you know, forever.

In about 2000, many of us started using XHTML because of its ability to combine XML and HTML. More standardization and greater flexibility made it a good move for technical writers and content creators.

Then along came HTML5 (and XHTML5)—the standard is still in draft—they (“they” refers to working committees of the W3C—World Wide Web Consortium) are still working on it. However, even while they iron out the last few details, we can safely implement the features that are most definitely already in…which is the vast majority of the standard.

Various browsers (and versions of those browsers) support different HTML5 elements to varying degrees, so there are all sorts of workarounds to make sure that everyone is happy, even those people who haven’t updated their browsers in two years. These workarounds are called shims, polyfills, and fallbacks; there’s a complete list here at GitHub, but they’re not all necessary even at the time of writing this article (and will be less so in the months and years to follow), so do your research first.

Another bit of useful research comes in the forms of these tools, HTML5Test.com and CanIUse.com, which you can use to check on specific functionality and browser support. Also, don’t forget the validator that checks your code.

It’s Easier

Yes, that’s right. Instead of making things harder, they’ve made things easier…in some ways. The doctype declaration is a thing of beauty: <!DOCTYPE HTML>. That simple statement replaces two long lines of code in HTML4.

If you’ve spent any time working in HTML, you probably have div elements everywhere, each with a different class applied to make things look just right on your web page. HTML has become pretty darned messy. HTML5 simplifies things with clearer, more meaningful tags and gets rid of the need for 90% of the existing div elements, among other things.

It’s Awesome (and Harder)

Oh yes, HTML5 surely is both a huge step forward and slightly more difficult to use, although maybe not in the way you think. HTML5 goes a long way to promote and enforce best practices in accessibility and localization. The best practices that have been heretofore spottily applied are now embedded right into the code requirements.

using html5 and javascript magicThe biggest advancement is in interactivity. In the last decade or so, we’ve been coming up with all sorts of third-party workarounds (ahem, hello Flash), developing entire languages to build in the interactivity that we want but that HTML itself didn’t support—videos, slick navigation, moving things, saving things, building things, showing things; they’ve all required some pretty complex coding.

Now HTML5 lets you add all sorts of interactivity directly, like drag and drop, map interaction, embedded videos, drawing, and smart forms. Well, sort of. These are mostly implemented using APIs because they are just too complex for plain HTML, even HTML5.

These APIs are part of the HTML standard, but usually also use JavaScript to a small or medium extent. To use (and customize) the really cool features, there’s no way around it—you need at least a rudimentary understanding of JavaScript.

Technically, this isn’t really harder because this interactivity we have been using required all sorts of really hard things and required hard-core development. Now, this cool stuff is within our reach…with a little knowledge of JavaScript.

But that’s the end of the bad news about using HTML5, I promise.

It’s Semantic

There are new tags that actually mean what they say. Article, nav, header, footer, aside, menu—you can probably guess exactly what these tags mean. They’ll replace most of the <div> elements that we’ve been using in such haphazard ways. You can just tag the different parts of your page with the appropriate semantic elements.

The benefits, other than having much cleaner code, are twofold: Search bots get cleaner results and the possibilities for responsive design go way up.

In the Tech Comm industry, there’s another huge benefit for everyone who is working with DITA or other XML standards that use semantic tags. We already have semantic markup applied to our content—when we publish to HTML5, we just need a nice mapping of XML elements to HTML5 elements.

It’s (Hopefully) Responsive

 using html5The statistics show that the mobile device adoption will become absolutely huge, even outstripping PC (whether laptop or desktop) and by 2015 we’ll have quite an array of different devices accessing the internet, among them 3 billion mobile phones—of all types. Trying to make content accessible, usable, and even visible on all these devices remains quite a challenge for those of us in the information industry.

When you start using HTML5, you’ll find that it comes a lot closer to being a basis for providing responsive design on websites. This means that navigation, sizing, amount of content, features offered can and should all adapt automatically to the device, OS, and browser you’re using to access the site. The goal is to make everything is usable no matter the device being used.

Designers and developers have put out a lot of theories on how to be responsive to the various devices, but my money is on feature-based design. Feature-based design combines testing to see if the feature works (dynamic testing while that person is accessing the site, not preplanned) with graceful alternatives to display content when a feature is NOT supported—in other words, test to see if your user can use your widget and if he can’t, tell him why not or give him an alternative. If you’re ready for it, look into using Modernizr with YepNope to become one of those bright people that know what they’re talking about.

It’s the Last Version

Soon, when we no longer have to differentiate between older HTML and new features of HTML5, it will simply become “HTML.” It will be a living standard rather than a standard tied to a particular version number. We’ll be learning it feature-by-feature from now on.

Where Can I Learn It?

Everyone in the content creation biz is going to need to learn the basics and even understand the advanced “what’s possible” pieces, if only to save some money on website development.

If you are new to HTML and need a nice beginner’s course, try HTML.net. It’s free, easy, and requires zero tools. You’ll come out of the tutorial with some pretty cool sample files and be ready to tackle some harder stuff, either on your own or through a more advanced tutorial.

If you’re an old hand, then brush up on w3schools.com and then do your research, because there are about 20 bloggers of great importance out there who are doing ground-breaking work in this field to determine best practices to combine HTML5 with CSS.

Jacquie Samuels

Jacquie Samuels is the owner of Writing Wise. She endeavors to help everyone create documentation that is stronger, faster, and smarter. You can connect with Jacquie through her Google Plus page.

Read more articles from Jacquie Samuels Twitter