Add a little HTML5 to your websites
It will be a while before we can start using real HTML5, but because HTML5 is as much about defining current behaviour as it is about adding new, there is already a very large part available to us today. Here are the parts you can use today.
HTML5 is arriving sooner rather than later. The 2022 date means that it’s fully supported, finished, done. It doesn’t mean we can’t use it. For example, CSS2.1, from 1998, still isn’t fully supported, finished, done, either. We all use that as well, right?
A lot of the HTML5 supported today are actually browser quirks, formalised. It’s usable right now, will get you acquainted with HTML5 and will basically make your front-end life easier :) (And it all works in Internet Explorer too!)
There is much, much more to HTML5 than visible in this article. This article only focusses on what you can use now. If you want more info on HTML5, check the specifications, or the whatwg blog.
The simplified doctype is ierhaps the most iconic idea in HTML5. It turns out, the above code is all that’s needed to trigger standards mode. The validator understands it as well. Quite a change from the humongous HTML4 or XHTML doctype declarations, no?
This works the same as the doctype. You don’t need anything more than this to make your browser set a charset. It turned out that people so often mistype this attribute, (
content="text/html; charset=utf-8"), that browser parsers actually encountered
charset=utf-8 more than the whole
content attribute. Since it’s legal to omit the quotes, charset is being parsed as an attribute in all browsers. And it’s legal in HTML5.
You no longer have to declare the
type attribute with
Getting used to new structural elements
HTML5 introduces a bunch of new elements that allow you to better describe your document:
Soon we’ll be living in the future!
When you start using HTML5 like in the examples above, you have the benefit of acquainting yourself with HTML5, still make websites that work today and more importantly, make sure your websites will still work for a long time to come!
Media queries are what make modern responsive design possible. With them you can set different styling based on things like a users screen size, device capabilities or user preferences. But how do they work, which ones are there and which ones should you use? For the Polypane blog I wrote the complete guide to media queries.…
I got invited to talk about Electron at QCon San Francisco in November and the video and transcript of the presentation are now available. Electron gives you the power to write a single application for Windows, MacOS and Linux. But Electron apps can easily feel out of place among other applications, exactly because you have…