HTML5: What’s New in The Latest Version of HTML?

10 Shares

You’ve probably seen many references to HTML5, along with mentions of certain features being “Deprecated” or “New” in HTML5. This can sometimes be confusing, as you find out that the way you thought you were “supposed” to do something is now not the right way at all.

It can also be annoying — especially since most of these “deprecated features” still work on most browsers. Why bother learning a new way of doing something if the old way works just fine?

And, of course, it can be difficult to find the right information sometimes. Content on the internet doesn’t live forever… but almost. And the older content is, the more likely it is that you’ll find it on a search engine. (All things being equal, Google and the others prefer older content. Also, older content has had more time to acquire backlinks.) This means that you will often find out-of-date tutorials when you are looking for information about HTML.

This article should clear up some of that confusion and get you on the right track with modern web development.

What is HTML?

(Skip ahead to What is HTML5 if you are already familiar with HTML generally.)

You probably already know that HTML, or HyperText Markup Language, is the language used for web documents. It is not a programming language, but rather a language that identifies the meaning, purpose, and structure of text within a document.

For example, consider this document:

All About HTML

What is HTML?

HTML is the language used for creating web documents. It is not a programming language, but rather a language that identifies the meaning, purpose, and structure of text within a document.

You can easily understand the structure of the document because it is simple, and you are an intelligent human being who has read many documents in your life. But your web browser needs to understand the document in order to present it to you in an intelligent and meaningful way. So we use HTML tags (also called “elements”) to identify the different pieces of the document.

For this simple document, we can add an <h1> tag to identify the main heading for the page (the title of the document), and </h1>
<h2>
tag to identify the first headline within the content, and a </h2> tag to identify the block of content as a paragraph.

<h1>All About HTML</h1>
<h2>What is HTML?</h2>
HTML is the language used for creating web documents. It is not a programming language, but rather a language that identifies the meaning, purpose, and structure of text within a document.

Now, a web browser can show you this document in a more meaningful way. This might seem trivial for a short document with one headline a single paragraph, but it can get complicated very fast. You’ve seen a lot of web pages, so you know that there are all sorts of things (not just headlines and paragraphs) that people need to represent on their web pages. Things like:

And that’s just for starters. You also need to be able to identify sections of your document and provide metadata about the document itself. (Metadata is information about the document, such as the title, author, relevant keywords, and relationship to other documents.)

HTML History and Development

HTML has been around for a long time. Its roots go back to at least 1980, with Tim Berners-Lee‘s project ENQUIRE. And actually, the concept of hypertext goes back even further than that. The concept first appeared in the early 1940s, and was named and demonstrated in the 1960s.

In 1989, Lee proposed a new hypertext system based on the ideas of ENQUIRE (and other systems, such as Apple’s HyperCard). This became the first version of what we now call HTML.

Since then, the language has been in constant development. The specification is managed by the World Wide Web Consortium (Berners-Lee is still the director, as of 2016), and the Web Hypertext Application Technology Working Group. (So, if you don’t like HTML5, these are the people to blame.)

The language has evolved over all this time because web development has changed. We do things with web pages and HTML today that were never dreamt of by the early developers and implementers of the language. A web page is no longer just a document; it is likely to be a full-scale web application. And even when it is “just a document,” we want search engines and other tools to understand the content of the website. We aren’t just creating pages for human readers anymore, but for artificially-intelligent systems that collect and manipulate information.

Why did HTML have to change? Because the web has changed.

What is HTML5?

HTML5 is the latest specification of the HTML language, and represented a major break with previous markup practices. The purpose of the many, profound changes to the language was to standardize the many new ways in which developers were using it, as well as to encourage a single set of best practices with regards to web development.

Most of the individual changes are a result of larger objectives in the design of the language. These objectives primarily include:

  • Encouraging semantic (meaningful) markup
  • Separating design from content
  • Promoting accessibility and design responsiveness
  • Reducing the overlap between HTML, CSS, and JavaScript
  • Supporting rich media experiences while eliminating the need for plugins such as Flash or Java

Getting a handle on HTML5 isn’t just about learning which CSS features replace old HTML features. If you want to get an intuitive sense of HTML5, it is best to understand how these objectives affected the development of the language.

Encouraging Semantic Markup

Semantic markup means markup which has meaning, rather than markup which simply looks a certain way. For example, the <h1> tag implies that the content of the element is the title or headline of the entire document. That semantic meaning would be lost if just made the text bold and large without using the appropriate tag.

HTML has always had a little bit of semantic markup available to it: heading tags, the link rel attribute, and document metadata. But it wasn’t enough.

In previous versions of the language, common structural elements like page headers, navigation menus, and main content sections were all indicated with the same HTML element, [the `

` tag](/tags/div/). In HTML, there are a host of new semantic elements intended to indicate the basic structure of a page:

– [`

`](/tags/header/)
– [`

Adam is a technical writer who specializes in developer documentation and tutorials.
10 Shares