Getting Started with HTML5: What’s new?

HTML5 is not in its final version yet but more and more sites have started using it. HTML5 attempts to meet the requirements of the new Web and to make it easier to publish Web 2.0 content. When HTML4 was in the works, Web 2.0 wasn’t even dreamed of, so you can’t expect HTML4 to be Web 2.0-friendly.

Now with HTML5, this is expected to change. Though, by the time HTML5 is in its final version, we may have witnessed Web 3.0, 4.0, or more, so it will again be outdated but for now HTML5 is more or less an adequate answer to the needs of web developers today.

HTML5 isn’t very different from HTML4 but still there are some important differences to know and keep in mind. Here are some of the differences of general interest to a wider audience:

Simplified Syntax

One of the most notable differences between HTML4 and HTML5 is that now the syntax is simplified – web developers will certainly love this! The syntax in HTML5 is compatible with HTML4, but still there are many improvements. The doctype declaration is much shorter and is just <!doctype html>. Transitional and loose variations of the doctypes are not supported anymore – you need to stick to XHTML syntax or HTML in strict mode.

New Elements

The new elements in HTML5 are the most notable introduction. These new elements are intended to better meet the requirements of Web 2.0 sites and to simplify development. It is not possible to list all the new elements and attributes because the list is very long and if you are interested in the complete list, check the page at the W3 Consortium. Here I will present only some of the new elements and attributes, which in my opinion are the most important:

  • <article> – This attribute is used to separate articles, blog posts, and other text content. With so many blogs and article sites, this element is extremely useful.
  • <header> and <footer> – These new elements are used for the header and footer of the page and they can replace the <div> elements we use today to identify many elements, including headers and footers. Since headers and footers are present on almost any page, it is good that now they have an element of their own.
  • <nav> – Similar to <header> and <footer>, <nav> is a dedicated element for the navigational items that we presently put in <div>.
  • <audio> and <video> – Audio and video content is so common and so Web.20-like that it is really great that they made it easier to use audios and videos on a page. The <audio> and <video> elements make it easier to embed audios and videos, respectively.

In addition to the new elements in HTML 5, many new attributes to existing elements are introduced, but their list is even longer than the list of elements. In any case, before you start coding in HTML5, take a look at the list of new attributes for the elements you most frequently use to see if there are changes.

Modified Elements and Attributes

Some of the fundamental attributes in HTML, such as <a>, <b>, or <i> have been modified. It might take you some time and a lot of effort to learn the new meanings. Here are some noteworthy changes:

  • <a> – When the <a> element is used without an <href> attribute, this is a placeholder for a link.
  • <b> – The new function of the <b> element is rather vague. It is not bold but it is still a way to mark a chunk of text as different from the rest. You can use it for keywords, product names, etc.
  • <hr> – The <hr> element is now a type of break (a paragraph-level thematic break, to be more precise).
  • <i> – The <i> element also marks a chunk of text as different from the rest but its usage is very diverse. You can use it for names, idioms, technical terms, etc. Pretty vague again – I guess if you continue to use <b> and <i> the way you are used to, this will be a mistake. If you want to have bold and italicized text, you should put them in the stylesheet instead. I wouldn’t call this change convenient for sure but since it is there, we need to follow it. Maybe for SEO these tags are now more useful because they are a way to mark a chunk of text as important without making the text as bold and italicized, but until we get used to the new meanings of the elements, there will be problems. The <mark> and <em> elements can be used as well to mark and emphasize special parts of the text.

There are many other changes to existing attributes and elements but they are more evolutionary than revolutionary and will hardly cause so much turmoil in the community.

Deleted Elements and Attributes

In addition to the elements and attributes that changed from HTML4 to HTML5, there are some elements and attributes that are no longer with us. Some of them will hardly be missed because they haven’t been used much and were just cluttering the language, while others could have stayed. Here are some of the elements and attributes that didn’t make it into HTML5:

  • Elements better handled via CSS. The first group of deleted elements includes some very popular elements, such as <font>, <center>, <big>, and <u>. These elements are no longer supported in HTML5 because their place is in the style sheet. This change could cause a bit of a turmoil when you really want to use these elements in your html rather than in your style sheet.
  • No more frames. The <frame>, <frameset>, and <noframes> elements were so 1990-ish that it is great we got rid of them. Frames were cool 10 year ago, but since they caused so much trouble and were a SEO and useability penalty, many designers avoided them, even though these elements were not excluded from the HTML specification. This is good riddance for sure and these elements will hardly be missed.
  • Elements rarely used. There are many elements that were present in the old specification but were not commonly used, so they have been removed completely. They include <acronym>, <applet>, <isindex>, and <dir>.

As you can see, there are some differences between HTML4 and HTML5 but they are not that fundamental – that is, you won’t have to re-learn HTML from scratch. Still, it might take some time and effort to get used to the changes, especially the modified elements and attributes. The good news is that HTML5 eases many aspects of HTML development and this alone is enough to justify the update.

Leave a Reply

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