I love HTML5. So does Viki Hoo and her recent article, 5 Things I Love About HTML5, states why. But not all is rosy in the HTML5 garden. So, in order to restore balance to the SitePoint universe, here are my five pet peeves:
1. Superfluous Tags
HTML5 (the technology) provides 30 new tags although you’ll never use half of them. That’s fine, but consider how we coded navigation lists in HTML4/XHTML1:
<ul id="nav"> <li><a href="link1.html">link 1</a></li> <li><a href="link2.html">link 2</a></li> <li><a href="link3.html">link 3</a></li> </ul>
Here’s the HTML5 equivalent:
<nav> <ul> <li><a href="link1.html">link 1</a></li> <li><a href="link2.html">link 2</a></li> <li><a href="link3.html">link 3</a></li> </ul> </nav>
It has a small semantic advantage, but does it really make a difference in the real world? No.
It also has the disadvantage of increasing page weight and adding unnecessary DOM elements. I’m using the new syntax but, after many years of extolling the benefits of clean code and avoiding DIVitis, it makes me feel a little dirty.
2. Poor Developer Tools
In the old days, I loved using Firefox extensions such as HTML Validator which highlighted issues in your mark-up when you viewed a page. Today, we have a few HTML5 validation tools, but they’re usually buggy beta releases and you need to submit your code to an online service. It’s slow and cumbersome — I rarely bother.
3. Multiple Media Madness
audio tags are great. Unfortunately, the ongoing vendor battles mean your video must be encoded in WebM, H.264 and Ogg Theora to work in HTML5 browsers. Oh yes, you’ll then require a Flash fallback for IE6/7/8 — and if you’re doing that, why bother with the
4. Browser Support
I could rant about IE6/7/8 and IE9/10 not being released on Windows XP. However, in my opinion, it’s the diverse range of implementation levels that annoy me most. If you want to use a HTML5 feature, you must continually consult documentation and test code thoroughly.
5. Hype and Confusion
The media pounced on the term “HTML5” and it’s applied to any cool web effect. Even if it’s an animated GIF. While that’s not necessarily a problem when you’re talking to clients, it is causing developer confusion:
- Some consider HTML5 to be radically different to HTML4 when it’s really an evolution.
- Some won’t touch HTML5 because the W3C specifications are still at the draft stage.
- Some won’t consider HTML5 because they need to support legacy browsers.
- And let’s not forget the trouble CSS3 vendor prefixes have caused and why we need to fix it.
These concepts may be obvious if you’ve been working in the trade a few years, but who’d want to be a newbie?
Let’s be clear: HTML5’s benefits outweigh the problems. I use it and recommend you switch as soon as possible. But remember that you’re paying a price to use cutting-edge techniques; don’t assume code will work as you expect on every HTML5-aware browser!
Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.
Jump Start Git, 2nd Edition
Visual Studio Code: End-to-End Editing and Debugging Tools for Web Developers
Form Design Patterns