I get asked a lot what all the changes from HTML4 to HTML5 were, in this blog post,
we're going through most changes and additions that were introduced with HTML5.

The doctype pre HTML5 was pretty long and cumbersome. The new HTML5 doctype looks like this:

The doctype is case-insensitive, I mostly write it in all lowercase.

In HTML5 SVG and MathML elements may be used directly within a HTML document.

This makes the following example completely valid HTML:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Using SVG in HTML</title>
  </head>
  <body>
    An SVG circle:
    <svg>
      <circle r="42" cx="42" cy="42" fill="rgb(28,77,70)"/>
    </svg>
  </body>
</html>

XML like void elements can now be used in HTML5.
This is aligns HTML5 a bit with XHTML, and makes both of the following two elements valid:

Boolean attributes may omit the equals sign and value.
Example:

Whitespace normalization was removed from attribute values, this means that
whitespaces in 

 or similar attributes aren't ignored anymore and the 

The following elements were removed because one should use CSS to style a document:

The following elements were removed because they hurt accessibility and usability.

The following elements were removed because they can be replaced with other elements.

Several existing attributes were also changed or removed in HTML5, you can read up those changes on the official W3C document on 

While in previous HTML versions the document structure and outline was only defined through the heading elements, in HTML5 sections can be nested and have their own heading hierarchy.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
    <title>HTML4 Outline Example</title>
  </head>
  <body>
    <div class="header">
      <h1>topaxi.codes</h1>
    </div>
    <div class="article">
      <h2>A Short Refresh On HTML5</h2>
      <p>...</p>
      <h3>The Doctype</h3>
      <p>...</p>
      <h4>List of Doctypes</h4>
      <ul>...</ul>
      <h3>Specify the characterset</h3>
      <p>...</p>
    </div>
  </body>
</html>

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">  
    <title>HTML5 Outline Example</title>
  </head>
  <body>
    <header>
      <h1>topaxi.codes</h1>
    <header>
    <main role="main">
      <article>
        <header>
          <h1>A Short Refresh On HTML5</h1>
        </header>
        <section>
          <p>...</p>
          <h1>The Doctype</h1>
          <p>...</p>
          <h2>List of Doctypes</h2>
          <ul>...</ul>
          <h1>Specify the characterset</h1>
          <p>...</p>
        </section>
      </article>
    </main>
  </body>
</html>

As one can see, each section has it's own hierarchy, the first heading defines at which level the hierarchy starts.

Theres a lot more minor changes to HTML5 I haven't mentioned here, if you're interested, you should look up the original 