WTF is HTML5?

	Author:	“Prodigy” Hare  Follow:
	Job Title:	Annoying but Promising Junior Developer
	Hobbies:	Ranting, Complaining, Annoying Superiors

Preface by ‘No Bugs’ Hare

Let me introduce a colleague of mine, young ‘Prodigy’ Hare fellow, who wrote his first article for ITHare on Soft.ware web site. He’s known for trying to tell us, an older generation of developers, about new stuff (which we should know about, but postponing the required effort for months and years). While he seems to enjoy teaching us a bit too much – it is IMHO still quite useful, not as a detailed reference, but as a 50000-feet overview. And a word of caution: in this ‘WTF’ series don’t expect anything bleeding-edge; rather, it is about things which are a few-years-old, but which are overlooked by us, ‘dinosaur’ developers.

WTF is HTML5?

“It might not be a terrible idea to finally figure out exactly what the hullabaloo is about.Hello everyone! My name is ‘Prodigy’ Hare. Welcome to my lecture series on 21st Century Tech; this week we’re looking at the basics of new technology, which you professors often like to spend ages ‘teaching’. I must say that I’ll enjoy returning the favour. A lot. Specifically, today’s lecture is a lesson about the marketing buzz about HTML5, which has been around for as long as you can remember (it has been officially standardized last October). It might not be a terrible idea to finally figure out exactly what the hullabaloo is about. “No Bugs” Hare (also known as the great but ancient colleague of mine) keeps banging on about how HTML is purely marketing hype, with nothing to support it. He might be correct to a certain extent, but I will (gladly) demonstrate just to what degree he is wrong.

To be entirely honest, the hype about HTML5 is quite extensive. If you would read, for example, [Cox2011] or aptly named [Alvi2014], you’d indeed think that HTML 5 is an entirely new era in web development. In fact; please read what’s on the links; it might be helpful for the mini-test next month. With promises across the board, from “more conversions” to “finding developers being easier”, it’d be very tempting to take them at their word. However, in reality it’d be incredibly difficult, if not nigh impossible, to live up to such hype.

Sorry HTML5, but I just don’t really believe you’re really going to perform up to expectations.

What does HTML5 remove from the table?

“if anyone still uses <frame>, may the Universe forgive themFirst, let’s see what HTML 5 removes from the HTML standard. Previous version, HTML 4, has been standardised in 1997, which is almost 20 years ago, so we can expect quite a few things to become obsolete. Actually, HTML 5 doesn’t remove all that much, and most of it is obsolete anyways. First off, <frame> tag is gone for good (if anyone still uses <frame>, may the Universe forgive them). They kept <iframe> though, so keep your britches on. Secondly, they ousted the entirely obsolete presentational tags (such as <big>, <font> and <center>) in favour of CSS.

<video> and <audio>

Now, for the meat of the hype around HTML5: the <video> tag (and similarly the <audio> tag).  On paper, it’s a pretty brilliant idea! Just insert the tag, and your video will play (no Flash, so it’ll go to mobile platform much more easily, yippee!).

Leaving Hype World; Next station: Reality. For a while, the reality looked pretty grim actually. Although you could technically make the video play on all the main browsers, you’d need to encode it into at the very least, two formats. H.264 for Internet Explorer (which only supports H.264 if without 3rd party codecs), and Theora or VP8/9 for Firefox (which doesn’t like to support patented algorithms such as H.264).

Relatively recently, however, there was a major development. Firefox now supports CISCO’s implementation of H.264 by default (well, unless you’re using Windows XP or maybe some other not-so-common platform), so if you’re lazy (and we all are), you might just be able to sort of get away with only H.264. It is still a “sort of” getting away with only H.264, as you’ll still lose viewers on not-so-common platforms. And an another word of caution: this only supports a so called “constrained baseline profile” [Gigaom2014], which in short means that not all H.264 streams will be simple enough for Firefox’s H.264 to properly deal with, so a double-check will be needed – or go back to having the VP8 format in conjunction with H.264.

HTML5 Syntax

SGML SGML (ISO 8879:1986) is for defining generalized markup languages for documents.
<<Prodigy Hare: yes, it is about as clear definition as you get>>— Wikipedia —There’s a lot of information about the syntax of HTML5, about how different it is (“oh, it is not SGML anymore, which is apparently a Really Big Difference”) and how much better it is. In practice, however, nobody ever really cared about HTML being SGML; it has only been a purely academic point of interest. From a practical point of view, the HTML5 syntax can be seen as a development of HTML4 (not of XHTML, although syntactically valid XHTML is also syntactically valid HTML5). In practice, HTML5 is far more relaxed than XHTML; in HTML5, uppercase tags work just fine, and elements like <img> don’t need to be written as <img />. </p> is also optional. In any case, the difference in syntax between HTML4, XHTML and HTML5 is pretty much negligible in practice.

HTML5 Semantic Tags

Often an undervalued feature of HTML5 (and to be honest, it’s one of my favourites, so you’d better listen up and take notes) is the vast semantic improvement compared to HTML4. New tags such as <header>, <footer> and <article> allow for much clearer document structure and in a much more straightforward way. “New tags such as <header>, <footer> and <article> allow for much clearer document structure and in a much more straightforward way.This is further complimented by HTML5 Microdata, which is a way to specify your own semantic structure for your document, while still sticking within the realm of HTML. While neither of these will affect presentation (which is what CSS is for), they may enable the better expression of document structure for non-GUI user agents. Whereas “non-GUI user agents” might include things such as Braille readers, in practice, of course, what the business is usually more concerned about (but never admits it) is actually the SEO. While SEO gurus never did reach an agreement on the exact effects of the improvements which HTML5 brings to the SEO table (most of them are in fact saying that “link building was, is and will be the key for SEO, so forget the content and pay us for link building”), HTML5’s added mark-up might still make a subtle difference for SEO.

Bells, Whistles, and Other Goodies

HTML5 introduces built-in support for SVG and MathML, which, while not that widely used, are still welcome additions. I can quickly imagine some people (thinking especially about “No Bugs” Hare here) would enjoy MathML rather a lot when writing their incomprehensible formulae; that is, they would like it if it was supported by the major browsers. Neither IE nor Chrome support MathML, making it rather unsuitable outside of strictly controlled intranets. Support for SVG looks somewhat better, with at least “partial support” (whatever on Earth that means) claimed by all the major browsers.

Additionally, HTML5 introduces several new JavaScript APIs: Geolocation API, canvas (for 2D drawing), drag-n-drop, cross-document messaging, History API, and WebStorage (a.k.a. Cookies on steroids). Surprisingly, all of these seem to be more-or-less supported by all the major desktop browsers; for mobile browsers, on the other hand, things look a tad worse. However, if you exclude drag-n-drop on one axis of the compatibility matrix and Opera Mini on the other axis, you’ll return to the “pretty much supported” state in the major browsers.

Skeleton in the Cupboard – DRM and EME

“Everybody should have their own skeleton in the cupboard, and HTML 5 is not an exception.Everybody should have their own skeleton in the cupboard, and HTML 5 is not an exception. For HTML 5, this role is reserved for DRM and it’s incarnation EME.

DRM has been a veritable disaster for “the youngster whippersnappers” (as you’re keen to call them) in the “free man’s open source land”. In HTML5, it comes as “Encrypted Media Extensions” (EME), and despite opposition from Free Media Software (which somehow managed to create a trademark on freedom), in May of 2014, Firefox was the last of the major browsers to announce support for EME. Firefox is most likely going to support EME indirectly, via a “sandbox”, which sounds as a neat idea, at least at the first glance.

Availability and Compatibility

You might not believe it (especially if you’re one of those who’s still all about the browser wars and HTML3.2 incompatibilities), but HTML5 is pretty much there in terms of browser compatibility. In fact, most of HTML 5 is available pretty much starting around 2010-2011. Currently, it is technically supported by all the major browsers. However, there are still quite a few per-browser (or for all of you purists, “per-engine”) technicalities. What this means is that for almost any feature, you’ll need to go through the following cycle:

• Check if it is officially supported by the browsers you need (IMHO, http://caniuse.com/ is a good place for checking)
• Implement the feature
• Test it with the browsers you need

TL; DR: Write once, test everywhere (oops, it was originally said about Java, but still applies to HTML5)

Conclusion

“Read up ahead on the notes so you understand what I’ll be teaching.Well, I hope you’ve seen for yourselves how wrong “No Bugs” could be. Even people with only half a brain should see that HTML5 isn’t just marketing hype; it’s only 80% or so. The rest has something behind it.

I actually really like HTML5; it deletes most of the ugly stuff from HTML4.01 and XHTML. It’s more semantically usable, and it throws in a few nice, albeit non-essential goodies. It enables the removal of Flash without sacrificing video, which is lovely for mobile platforms. Even more vitally, it lets us forget about the browsers without CSS3 support (if it has HTML5, it also has CSS3). Last but not least, it’s already there in the sense that most businesses can afford to drop support for browsers without HTML5 support.

Now, to avoid sounding like a salesman myself, there, the hype of HTML5 is clearly ridiculous, which it’s really unlikely to live up to. And to state what my ex-teacher “No Bugs” keeps telling me: “what people around you think about you, is what you are, divided by what you say about yourself”. And in those terms, HTML5 fails so very extremely. Last message from me to HTML5 hypers: pipe down about yourself, HTML5, no-one likes a show-off.

Next time we’ll be looking at CUDA, read up ahead on the notes so you understand what I’ll be teaching.

Class dismissed.

Don't like this post? Comment↯ below. You do?! Please share:

Acknowledgement

Cartoons by Sergey Gordeev from Gordeev Animation Graphics, Prague.