HTML 5 – Easier and Better Than XHTML

HTML 4.01 was replaced by XHTML, which 18 months ago I was praising XHTML as the greatest thing. XHTML is a strict version of XML and HTML. XHTML aimed to be a pure XML language and dropped most of the formatting elements like the font, b (bold) and i (italics) tags. XHTML was strict and had the following rules:

  • Elements have to be in lower case
  • Elements’ attributes have to be in lowercase
  • For every element opened, it had to be closed, though you could self-close elements
  • Only the set attributes for each element could be used
  • The document application type needed to be XML, though this was rarely practiced
  • In line elements (e.g. anchor tags for links) were not to wrap around block level (e.g. divs).
  • Double quotation marks had to be used to contain the attributes values
  • Only markup was contained in the document, the presentation and interaction was pushed out to external files

An XHMTL could look like

[cc lang=”XHTML”]

An XHTML Document

Example

This is an example XHTML document.

[/cc]

While the same page in HTML 5 could look like (though is poorly formed):

[cc lang=”html”]

An HTML Document

Example

This is an example HTML document.

[/cc]

Notice in HTML 5:

  • A DOCTYPE is declared, though in XHTML even though it is not required many developers declared it anyway because they do not serve their pages as XML
  • The HTML DTD URI is not declared, useless anyway as browsers ignored the published DTD anyway
  • The body element name is in uppercase, as HTML5 is not case sensitive, though I personally prefer to keep it lower case
  • The class attribute of body is in uppercase (for example purposes only)
  • The value of the class attribute of body is not wrap in quotation marks, in HTML 5 you can use single, double or no quotation marks. Though again I prefer to use double quotation marks for readability.
  • The paragraph attribute is not closed. This actually bugs me as I think it actually makes it easier to find problems and makes it easier to read if the tags are closed.

FYI – HTML/XHTML is a collection of blocks of content, aka elements or tags. These blocks describe the structure of the page. An element is declared by an open angle bracket (), the content, open angle bracket ().

i.e.
[cc][content][/cc]

e.g.
[cc lang=”HTML”]

This is an example paragraph

[/cc]

XHTML by being stricter help developers to form much nicer HTML. It forced you to be discipline and made making updates and debugging a lot easier.

Being unforgiving, XHMTL drove a lot of developers nuts. So I think developers should look at HTML 5’s looser restrictions as a reward and not a right. Documents should be well structured/form, though enjoy the ability to add attributes to tags outside of the spec such as placeholder.

By following the disciplines of XHTML, my HTML 5 example should look like:

[cc lang=”HTML”]

An HTML Document

Example

This is an example HTML document.

[/cc]

This document still looks a lot like the XHMTL document, and not that much easier. This is because we are looking at too simple of a page. A lot of the ease comes in the form of the new elements which help make the HTML more readable and adding functionality.

For example:

  • The video element will eventually replace the need to use Flash or SilverLight to embed videos into the page
  • The placeholder attribute will replace the JavaScript hacks to add placeholders to inputs
  • The new input types will replace the JS hacks for dates, numbers, sliders
Advertisements

11 comments

  1. Don’t you wish you knew what you were talking about? Bringing up forcing developers to write stricter markup as a key element for its existence shows you don’t understand the fundamentals of this topic and HTML5 was created for, and by, people like you. Don’t write articles like this anymore.

    • Hi Rob

      Please feel free to explain yourself, because your comment makes no sense.

      If you read the article you would realise that your comment is completed invalid. As the article says that it was good XHTML taught us discipline and it is good HTML5 gives us freedom to break the rules.

      Going off I have launched 3 websites in the past 3 months using HTML5, CSS3, Web Workers, Web Sockets, and Geo Location services I would say I am quite informed about HTML5.

      Also if you are going to mouth off about someone else, check to see if your backyard is clean first.

      Dale

  2. Oh also Rob, I reread your comment, the article says “XHTML by being stricter help developers to form much nicer HTML”. XHTML not HTML 5 is said to be stricter!

  3. My biggest pet peave with XHTML is that inline elements are not supposed to be made into blocks. It works well in most browsers… life is easier when an anchor tag can be a block sometimes.

  4. Well, why, yes. HTML5 is the future. But there will still be an XML serialization besides the SGML variant you’ve shown.

    Also to elaborate on XHTML. The real purpose of that wasn’t easier parsing, but extending. Unless you mix in MathML or SVG or any other XMLNS, you are not actually using XHTML. Also if you send your websites with the text/html MIME type it is also just interpreted as HTML with trailing garbage (empty tag closing slashes). It needs application/xhtml+xml to be valid XHTML, else it’s just “xhtml-SYNTAX” to most browsers and not the real deal.

    And btw, not be mean 😉 but your blog uses invalid XHTML syntax. The attribute target=”_blank” is forbidden in XHTML-Strict. It only works because you also happen to send it with the wrong MIME type (like everyone else).

  5. Honestly, for me, the fact HTML5 doesn’t have a strict markup is the largest downside of the whole HTML5 thing. I never had any trouble writing 100% valid XHTML code and the fact you can write HTML5 the same way idiots used to write HTML4 for IE6 and earlier is downright insulting to me. It’s no longer about being smart and capable, now any moron can write “valid” HTML5 websites cause, hey, there’s no such thing as VALID HTML5 websites. Meh…

  6. Pingback: Anonymous

  7. I think loosing the strictness of XHTML will be a stumbling block with HTML5. I suspect developers will be pulling their hair out again with all the new developers out their coding bad XML trying to work out where blocks finish. I hope we get XHTML5 soon because I’ll use it.

  8. So we’re talking about a language that still does not accept certain self-closing tags, allows for some tags without having to close them, giving confusing definition to the b, i and big tags for “compatibility” reasons, allows big but not small, and you still like it more than XHTML.

    I… can’t agree with you.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s