Everything You Need to Know About HTML5

HTML5 is the latest version of HTML and XHTML. The HTML5 standard defines a single language that can be written in HTML and XML. It is designed to solve issues found in previous versions of HTML and addresses the needs of web applications which were not well covered by HTML. So does that mean that XHTML is dead? The answer is-no. It is still alive and is used by developers and designers.

Now if you are the kind of designer who likes the strict rules of markup design that runs everything carefully through a validator then you have two reasons to be happy. Firstly, HTML5 supports all the lowercase, self-closing tags, double quoted attributes. And if you do not like these things, it supports that too. Secondly, if you want to use XHTML, XHTML5 allows you to do that. XHTML5 is quite simply HTML5 + XML, that is, all the normal rules of XHTML, like no document.write allowed.

HTML5 is absolutely ready to be used today. There is a buzz around that it will take years for HTML5 to be completely developed. To understand this, let us first talk about CSS2.1. CSS2.1 is CSS that most people are familiar with and it is used day to days. So many people use it everyday without giving a thought as to whether it is complete or not. The fact is that it is in development for over 10 years. It has only just become a candidate recommendation. It still does not have two browsers completely supporting it. Only Internet Explorer 8 supports the full CSS2.1 spec. so did that stop people from using CSS2.1? No. So should this stop people from using HTML5? It certainly should not.

HTML5 is available and ready to use today. The Web Hypertext Application Technology Working Group (WHATWG) is completely open for anyone to contribute their ideas and suggestions. On the website, you can sign up to the mailing lists. You can communicate directly using IRC. There is also a complete log of all the IRC history.

The question that needs to be answered is- how do you get your markup to validate as HTML5? Well, it is very easy. You can change your doctype from whatever it is to . This is it. You need not do anything else. HTML5 offers you a lot of things to play with. The style and scripts elements in HTML5 no longer need the type attribute as they default to text/css and text/JavaScript respectively, which helps to remove a little more cruft from the markup.

One of the biggest features of HTML5 is the new semantic markup. There is a whole range of new elements that has been added to HTML5. The new HTML5 elements are

    1. Block structure: It includes

Article: It represents a component of a page that consists of a self-contained composition in a document, page, application, or site and that is intended to be independently distributable or reusable.
Aside: It is used to represent a section of content that is related to the content around the aside element.
Footer: It is used as footer to a section. You can also use it to mark up the footer of a blog post in addition to the footer of the entire document.
Header: It represents a group of navigational aids, and is used to construct the document outline.
Nav: It is used to wrap major navigation blocks, such as table of contents, pagination links and breadcrumbs.
Section: It is a generic document or application section.

    1. Inline semantics: It includes

Details: It is used to include additional info that the user can obtain on demand.
Figure: It is used to annotate illustrations, photos, listings etc.
Mark: It highlights a run of text, e.g. to mark the terms the user was searching for.
Time: It is used to encode modern dates and times in a machine-readable way.

    1. Interactive elements: It includes

Audio and video: These are media elements which enable you to embed audio and video directly into the browser without any need for plug-ins.
Source: It enables you to specify multiple alternative sources for the media element.
Canvas: It is a 2D drawing element that can be accessed using JavaScript to render graphics on the fly.

    1. Compatibility:

Audio and video media elements have a new DOM interface, so only those browsers that have specifically implemented these media elements will be able to offer native audio or video. If you use the video element and it’s not supported in the browser, its contents will be rendered.

Now that you have the required information about HTML5, go ahead and use it to design the required web design. You can make use of its new elements to enhance the look and functionality of your web design.

(Have been liking our posts for a while? Subscribe now! We’ll make sure that you never miss an update. And talk to our HTML5 developers now if you need professional help with your Web strategy.)

Leave a Reply

Your email address will not be published. Required fields are marked *