HTML5 is rapidly gaining popularity, but how many people are actually using it? If not HTML5, then what? When creating websites, designers have a variety of options for markup:
- HTML5 (Not quiite official yet)
- HTML 4.01 (Strict, Transitional, Frameset)
- XHTML 1.0 (Strict, Transitional, Frameset, & Basic)
- XHTML 1.1 (+ Basic XHTML 1.1)
You can build beautiful websites using any of these languages, but each comes with its own pros and cons. For example, you get some great new features with HTML5, but JavaScript is required to ensure cross-browser compatibility. XHTML 1.0 is cool, but Internet Explorer doesn’t really get it. Likewise, XHTML 1.1 is clean and flexible, but a little more persnickety about the details. And whatever happened to XHTML 2?
In a cage match, which markup language would dominate? Cast your vote!
Loading ...
Bonus question: How many of us will be around for HTML6? ;)
Note: If you are reading via feed, visit the DiW site to take the poll (located in the sidebar).
![[ Digging into WordPress ]](http://digwp.com/wp-content/themes/DiggingIntoWordPress-2/images/sidebarbook.png)
For now i’m using XHTML. is mostly because i’m used to it and the codes is cleaner and easier to read.
I’m just waiting a chance to start using HTML5 instead of XHTML. Semantic and usability are the most important things for me!
Which meshes best with the WordPress vision?
As edogawaconan points out, the WordPress Post Editor generates XHTML-flavored markup, but for the most part it’s perfectly compatible with plain ol’ HTML. Hopefully this poll will shed some light on what other WP developers are using.
I use HTML5 because it’s the only DOCTYPE tag I can remember off the top of my head.
Last time I checked WordPress only generates XHTML-compatible (short-tagged) codes from their post editor
True, but most of the markup validates fine as either HTML or XHTML.
I would like to use HTML5, but compatibility is an issue (with other/older browsers but also with WordPress).
You can use JavaScript to ensure cross-browser compatibility, but not everyone has JS available.
What are the compatibility issues with HTML5 and WordPress?
XHTML 1.0 is cool, but Internet Explorer doesn’t really get it.
I really have no problems with IE, including IE6. It is just a matter of using floats properly and applying some specific IE 6/7 rules for bug fixes. After you get some experience coding, making a website compatible with IE, becomes second nature.
Actually I was referring to IE’s non-support of the
application/xhtml+xmlMIME type, which is required for valid XHTML documents. More information here and here.Since I make WordPress Themes, I use XHTML because WordPress generates XHTML. I use transitional because I never know how someone is going to use the code … like put inline styles in the content.
XHTML… because people should close their *&%*&^$%*& tags.
It’s hard for me to get used to not closing stuff (like inputs) in HTML5 too. Although I’m pretty sure it’s still cool if you do.
They still work, but
<input />,<br />,<hr />, and others won’t validate as HTML.If you’re talking markup, I’d have to go with XHTML mostly because it looks cleaner and I’m used to it.
That’s not to say that when HTML5 is near to being finished that I will not be using the new tags. In fact I use the new doctype and remove the type attribute on some of my project pages already as it saves time.
As Jeff hinted at in his reply to Lucian, unless you jump through a dozen flaming hoops, your “XHTML” documents are being served as HTML by your web server, meaning they will be interpreted as HTML by all browsers. So your choice of XHTML vs. HTML only makes a difference to the Validator, which is not really your target audience.
Most of the output from WordPress validates fine as either, but a lot validates only as XHTML, and some WP output is invalid for both XHTML and HTML.
Since HTML5 allows both HTML & XHTML-style coding, you can begin using the HTML5 doctype now, without changing anything in your code. WP therefore outputs valid HTML5 (except where it is invalid for both HTML & XHTML).
I personally have started using HTML5 as much as possible. But I only use the new attributes in certain circumstance where the additional requirements can be justified.
And for those saying XHTML is “cleaner,” please see these two examples, both of which are perfectly valid and contain the minimum code required to get a form working in XHTML and HTML5, respectively:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>X</title></head><body><form action=""><div><input type="text" /><br /><input type="submit" /></div></form></body></html><!DOCTYPE html><title>X</title><form><input type=text><br><input type=submit></form>So it looks as if
<body>and<head>are no longer required?The body and head elements are still required, but the and tags may be omitted. They are implied by elements that can only go in one or the other (such as vs. ). This is similar to how the closing tag is not required, but is implied whenever a new block element is encountered.
This is not new with HTML5; it has always been the case with HTML.
I hope to get the hang of your comment form one day! Let me try that again:
The body and head elements are still required, but the
<body>and<head>tags may be omitted. They are implied by elements that can only go in one or the other (such as<title>vs.<div>). This is similar to how the closing</p>tag is not required, but is implied whenever a new block element is encountered.This is not new with HTML5; it has always been the case with HTML.
P.S. I still include the tags in all my webpages!
That’s awesome – I never knew that was the case for HTML in general. Gonna have to play around with that, although I have to be honest, it’s going to be difficult not closing those
<p>tags!I’ve been using XHTML 1.0 strict, working slowly on transfering things to html5.
I’ve been making use of HTML5 for various projects when able, but I largely end up coding XHTML with the HTML5 doctype, to ensure that things work cross-browser without relying upon JavaScript.
Sticking with XHTML 1.0 Strict for the time being.
XHTML 1.0 Strict in the house boyeee.
Unless you are using the application/xhtml+xml mime type for your documents, XHTML is largely pointless. Take a look in firebug to see what the browser thinks of your closing tags.
XHTML/HTML is a developer’s choice that matters only to the developer. If you like closing your tags, use XHTML syntax.
And by the way, there is nothing stopping you using and XHTML syntax at the same time. Things will not break. After all, the browser is going to ignore your />
It’s not HTML5 vs XHTML. It’s HTML5 using XHTML syntax vs HTML5 using HTML syntax.
Isn’t there more to a markup language than syntax? For example, I would love to be able to use
<acronym>but it’s not valid HTML5.In HTML 5 you should use the
<abbr>element instead:Also see Obsolete features.
Yeh, that’s what I was referring to.. unfortunately,
<abbr>used for acronyms is ridiculous.Yeah, depracated due to confusion among developers. I can see how some people find that annoying but it sticks to the HTML5 principle of doing things for how they are done now.
If the majority of coders are using
abbrwhen they should be usingacronymand vice versa then there’s a problem that simply being the guy knowing the correct usage won’t solve.Mind you, if you thing the abbr/acronym thing is confusing wait till you see section/div.
lol! No doubt – I am already confused on that issue.
Btw, I researched the whole acronym-vs-abbr thing and now understand why they are going with just
<abbr>. It turns out that acronyms are a type of abbreviation.@Jeff: Indeed. Moreover, at least in Dutch we have several kinds of acronyms: ‘initiaalwoorden’, that are pronounced character by character (like ICT and tv). ‘Letterwoorden’, that are pronounced as a single word (like aids). And ‘verkortingen’, that consist of the first syllables of several words, also pronounced as a single word (like info (information) or horeca (‘hotel-, restaurant- en caféwezen’). Another important difference between ‘initiaalwoorden’ and ‘letterwoorden’ is the way they are derived: e.g., persons who visit the vwo (a type of school, ‘initiaalwoord’, pronounced as ‘vay way oh’) are called vwo’ers, whereas people who visit the havo (another kind of school, ‘letterwoord’) are called havoërs.
Very interesting – sounds similar to how things are in English. I think the equivalent of “initiaalwoorden” is an “initialism”, which is what CSS, HTML, and others are technically considered. The acronym is is actually a pronounceable word such as “NASA”, which is formed by taking the first letters or parts but of a word and forming an abbreviation. This seems similar to “verkortingen”. In either case, both are considered abbreviations, so it turns out that I have been doing it wrong all these years, although I have to say that use of
<acronym>for acronyms seems more precise than just lumping everything together as an<abbr>.Not exactly; at least according to an authoritative guide to writing in Dutch (Jan Renkema, Schrijfwijzer), NASA should be considered a ‘letterwoord’, as it consists of only the first characters of ‘National Aeronautics and Space Administration’, whereas a ‘verkorting‘ consists of the first syllables of words (and at the Dutch Railways, a ‘verkorting’ is an unofficial abbreviation (not contained in dictionaries) of a station name, in most cases the first letters of every syllable; e.g., ‘Asd’ stands for ‘Amsterdam’). Indeed are HTML and CSS ‘initiaalwoorden’ (contrary to ‘afkortingen’, abbreviations, that are always pronounced in full, if that’s the correct term, and always carry at least one dot).
But I was not completely correct: in Dutch acronym is only synonymous to ‘letterwoord’, abbreviations that can be pronounced as words (like NASA, you don’t say ‘en a es a’). A Dutch usability expert recommended (in the pre-HTML 5 age) to use the following CSS in an aural style sheet to let screen readers pronounce abbreviations differently:
abbr { speak: spell-out }(beware of the wrong suggestion in the CSS 2.1 spec: “Spells the text one letter at a time (useful for acronyms and abbreviations)”).
That said, the English Wikipedia page about acronyms considers every abbreviation that can be pronounced as a single word an acronym, including syllabic abbreviations. So there might be some difference between what English and Dutch persons consider an acronym (but at least in the Netherlands not everyone agrees with the official meanings).
BTW, I found an interesting page about Abbreviations, Contractions, Acronyms, Initialisms, Symbols and other things.
Just realized the comment box removed a bit of syntax there. What the second last paragraph should have said is “there is nothing stopping you using the HTML5 doctype and XHTML syntax at the same time.”
Hey, nobody mentions quirks mode! I love the retro-look of it, I don’t have to remember silly DOCTYPEs with those “-//EN//whatever”, and your sites look the same in every version of IE, including good ol’ IE 5.5.
No, just kidding. As I like to use attributes like
autofocusand the like already, I’m just using<!DOCTYPE html>without HTML 5-specific elements (I don’t want to rely on JavaScript to guarantee that IE renders those elements correctly). It doesn’t hurt and if those special attributes are supported by the visitors browser, (s)he profits from it.Careful with autofocus and onBlur HTML5 Security Cheatsheet
Thanks, nice to know (and nice page), but who does create such a loophole? BTW, this is already possible for a long time, when using focus() in window.onload combined with focus() on blur.
Right now HTML feels a little bit too new for me, which is why I’m sticking to XHTML for bigger projects.
HTML4 is a no-go for me. XHTML feels a lot better in it’s syntax (especially the self-closing issue).
When the time it right, I’m pretty sure I’ll switch to HTML5
Very good stuff.