An Introduction to html5

Written by admin

HTML5 is now popularly used as an all-inclusive term. Typically it refers to a collection of new web specifications that enable next-generation web applications. It can include anything from the true W3C HTML5 specification CSS3, ECMAScript 5 and much more. When looked at together, they provide us as developers with new support for rich graphics and media, new JavaScript and DOM functionality to provide advanced programmability and standardize behavior within the browsers.

HTML5 is a collection of scores of independent individual features. So it is wrong to consider it one giant entity. There is no one thing called “HTML5 support”. If you want to use HTML5 in your browser, you will have to check for support for individual features of HTML5, be it canvas, video, audio or geolocation.

Think of HTML as comprising tags and angle brackets. The interaction of these angle brackets with JavaScript, through the Document Object Model (DOM), is also de ned in the HTML5 speci cation. The easiest way to sum up the components of HTML5 is as follows:

HTML5 = HTML5 + ECMAScript + CSS 3 + SVG + GeoLocation + WebApps

As you can see, the HTML5 on the left refers to loose marketing and technology jargons. On the other hand, on the right side, it refers to the new markup, tags and features being introduced by the W3C working group.

ECMAScript is the formal body responsible for de ning the language that is better known as JavaScript!

No need to start from scratch

One of the key bene ts of using HTML5 is that it doesn’t require you to relearn things you already know. If you’re still stuck on HTML4, this is good news. If your web application worked yesterday in HTML 4, it will still work today in HTML5. Period. What HTML5 does is it gives you the tools and resources to improve your application.


HTML5 is well supported by all major browsers – be it IE9, Firefox, Chrome or Safari. Even mobile browsers built into iPhone, certain Android devices and even Internet Explorer on Windows Phone Mango support HTML5. It doesn’t matter which HTML5 feature you’re using – designing better web forms, drawing on a canvas, playing a video or building web applications that work of ine, you’ll nd that HTML5 is already well-supported.

It is easy to get started

HTML5 is here to make your life easier and builds on the success of HTML4. Moving to HTML5 can be as simple as changing your <doctype>. The doctype should already be on the first line of every HTML page. Previous versions of HTML de need a lot of doctypes and choosing the right one could be tricky. Compare, for example, the following HTML4 doctypes:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional// EN” “”>

Definitely, not the easiest thing to remember and there are over ten variations of this markup! HTML5 solves this problem by doing only one doctype: <!DOCTYPE html> Now that’s a doctype you might just remember. Upgrading to the HTML5 doctype won’t break your existing markup because all the tags de ned in HTML 4 are still supported in HTML5. But it will allow you to use — and validate — new semantic elements such as <article>, <section>, <header>, and <footer>.

No escaping it

There’s no way you’ll be able to escape HTML5! Although it has been around for some time now, HTML5 has gained recent momentum due to a strong push from multiple vendors, including Microsoft, Apple, and Google. In fact, Apple issued a public letter titled “Thoughts on Flash”, where it concluded that with the development of HTML5, Adobe Flash is no longer necessary to watch the video or consume any kind of web content. Definitely, HTML5 is here to stay.


Tim Berners-Lee invented the world wide web! Tim created the World Wide Web Consortium (W3C). Its mission was to lead the world wide web to its full potential by developing protocols and guidelines that ensure long-term growth for the web. In December 1999, HTML 4.01 was published. After this, the people who ran the W3C declared that it would be difficult to extend HTML 4 and they gave up on it for the next ten years!

Turns out that web developers got busy trying to bridge the gaps in HTML5 by rolling out custom controls plug-ins and libraries. And finally, key browser vendors such as Microsoft, Google, Mozilla, and Apple got together to develop these further, finally ending up under the W3C HTML working group.

CSS and what it’s all about

You might have a vague idea that it has something to do with the stylising your HTML5 page. Here’s more on it.

CSS is an acronym for Cascading Style Sheets. It is a style sheet language used to describe the presentation semantics (the look and formatting) of a document written in a markup language. Although we will deal with the application of CSS to style web pages written in HTML, but the language can also be applied to any kind of XML document.

HTML elements enable web page designers to mark up a document as to its structure. The HTML speci cation lists guidelines on how browsers should display these elements. For example, you can be reasonably sure that the contents of a strong element will be displayed bold-faced. But you have very limited control over how your text appears. What CSS does is it puts the designer in the driver’s seat. For example, CSS covers fonts, colors, margins, lines, height, width, background images, advanced positions and many other things

JavaScript / EcMAScript 5.0

JavaScript is the scripting language of the web and browsers implement the standards described by ECMAScript; though not all browsers implement it exactly the same way! Anyhow, JavaScript is used in billions of web pages.

It is used to add functionality, communicate with the server, validate forms, and a host of other stuff. We’ll try and give you a brief idea of this scripting language in the context of HTML5.

About the author


Leave a Comment