HTML 5: what people talk about, what looks cool, and what I actually use
What is HTML 5?
Well, for those who are not computer guys, let’s start by explaining what HTML is. (Naturally, if you already know that, go ahead and skip this explanation.)
HTML stands for “HyperText Markup Language”. It is basically a computer language that lets you modify a piece of plain text by adding all kinds of perks to it.
HTML can be used to create many types of text documents, but it is mainly associated with web pages. It is the language of the World Wide Web.
To create a HTML document, you start with a piece of plain text. Then you put some extra instructions, called HTML tags, in certain places. For example, HTML tags let you define which parts of the text are important and should therefore be emphasized. You can choose which parts of the text should link to other places. With HTML tags, you can also insert images and lots of other stuff.
HTML 5 is the next version of HTML, which is already partly or fully supported by many web browsers. The World Wide Web Consortium (W3C) is a bunch of smart guys that meet together from time to time and draw up the web’s technical standards. These smart guys are planning to officially make HTML5 a Recommendation in 2014. You see, the web being a free medium and all, nobody is formally forcing any standards on anyone, but a W3C “Recommendation” is a pretty serious thing. The big technology companies follow these Recommendations pretty strictly, and most of them are W3C members anyway, so they take part in drafting them too.
There are many new things in this new version of HTML, and I’d like to outline three good examples…
What they talk about
The big thing in HTML5, the one that seems to be discussed the most, is the improved support for videos. You must surely know that we can already put videos on a webpage. However, right now, browsers rely on external software to play the actual video. And you must have that extra software installed on your computer, otherwise you won’t be able to see anything. The most popular example of such software is Adobe Flash. Youtube uses it, and almost everyone else for that matter. 75% of web video is viewed using the Flash Player. On some sites the video is played on Windows Media Player, or if you’re an Apple fan, on QuickTime. As a whole, Internet enthusiasts don’t like it when the technology is privately owned by a single company (in this case, Adobe), so they would be happy to replace the current situation with an open, free-for-all standard. And due to an ego clash between Adobe and Apple, many proud owners of Apple devices (iPhone, iPad and such) can’t view Flash videos at all. HTML 5 promises to bring an end to this problem.
HTML 5 allows you to add a video to your web-page and play it directly in your web browser without the need for external plug-ins. It also lets the other elements of the web page interact with the video (for example by placing custom play/stop buttons). The problem is that we still don’t have a common video format supported by all browsers. And by the look of things, we won’t have one for a while.
What looks cool
Another very interesting thing introduced with HTML 5 is the so called “canvas”. Instead of downloading an image from the server, the browser can actually draw an image in real time! Described this way, maybe it doesn’t sound very exciting, but believe me, it is. Again, today the usual way of accomplishing something like that is by invoking the help of Adobe Flash, our handy external software package. I already told you why it’s a better idea to incorporate this functionality internally.
If you’re not convinced that the HTML 5 canvas looks cool, well, just see for yourself. The folks at Google have put up a whole website that demonstrates the canvas awesomeness in many ways. Head out to http://www.chromeexperiments.com/ and take a look at the things they have there. Naturally, you need a browser that supports HTML 5. And (surprise, surprise!) the website’s creators recommend Google Chrome.
What I actually use
Like most web developers, I work for people who want their websites to be seen by everyone, and not by the lucky few who have the latest and greatest software. So I will probably not be using the fancy video and canvas elements for a while. However, some HTML 5 features can be used to nicely enhance the experience for some visitors, while still allowing those with the older browsers to access the website without any problems.
I’m talking about HTML 5 form elements – those little boxes that allow you to enter some information and send it to the website. Here are the types of elements that HTML supports right now:
A text box.
A multiline text box.
A password box.
Or a set of “radio buttons”
No, choose me!
And of course, the button.
HTML 5 introduces many more. The nice thing is that if I try to add a HTML 5 input element to the page, and your browser doesn’t support it, you will still see it – but you will see a standard text box instead of the fancy new input object.
Right now, Google Chrome has the best support for this type of elements, so if you have it on your computer, here are some examples that you can look at:
- Number. This box lets you enter a number and nothing else. This is particularly useful on mobile devices which can automatically put the keyboard in “number mode” when you are entering data in such a field.
- Range. This is pretty similar to the last one – it lets you select a value from a range of numbers.
- Email. This one verifies if the text you entered is a valid email address. Again, it has a great potential for mobile phones, because they could let you select an email from your phone’s contact list, instead of having to type it. As you probably know, I think it’s very important to make things easy for people who are visiting your web site with a mobile device.
Preparing for HTML 5
HTML 5 is still a work in progress. Only a handful of major brands, including Mozilla Firefox and Google Chrome, currently support HTML5 elements. Microsoft’s Internet Explorer is the most widely used browser and currently has the least amount of support for HTML5. So at the moment, I’m not using it that much, apart from the example above. But I am aware that when HTML5 does become the recommended standard, I should be one of the first to adopt it in order to keep up with advances in technology.