Noob (X)HTML Doctype question

**NickFitz** · 25 January 2010, 22:08

It's essential to include an appropriate Doctype (Mozilla docs, Microsoft docs). Without it your documents will display in Quirks Mode, which involves a weird amalgam of bugs from browsers such as Netscape Navigator 2 and Internet Explorer 4 and will make the use of CSS to provide consistent styling across different browsers a virtual impossibility.

It doesn't really matter too much if you use XHTML or HTML; you have to end up serving it as HTML anyway, because that's all IE (up to and including IE8) can handle. (Most of what Anne van Kesteren posted about this in 2004 is still valid. There are some good links there too.) Some people recommend using XHTML simply because the stricter syntax tends to make it easier to spot errors. Whichever you choose, go for strict unless you want something that's only in transitional, such as the target attribute of a elements that have an href attribute, or of the form element.

Learn how to use the HTML and CSS validators, and play with some of the other tools at the W3C site. (HTMLTidy is a useful one.) The validators should always be your first port of call when things aren't working as you expect: it's probably fair to say that more than 80% of problems can be traced back to malformed (X)HTML or CSS syntax errors. Mark Pilgrim explains the importance of using validators far better than I can.

Never, ever try to get things working first on IE, unless it's IE8 and you're absolutely certain that it's rendering in IE8 mode, rather than one of its various emulation modes for IE<6, IE6, and IE7.

If (as most people do) you end up developing on Firefox, install Firebug. It is the one absolutely essential tool. Nowadays I often work more with Safari or Chrome, as the Web Inspector (which basically does all the stuff that Firebug does) is a bit more responsive. On Safari you can get to it from the "Develop" menu, which has to be enabled in the "Advanced" tab of preferences. On Chrome you should find it on the leftmost of the two menus that drop down from the icons at the upper right.

That's a few of the basics covered; I'll add more as and when

**NickFitz** · 25 January 2010, 22:09

Oh, and ditch that Windows charset; UTF-8 all the way. Joel has the reasons.

**d000hg** · 25 January 2010, 22:19

Thanks a lot Nick, hoped you'd reply.

I added a doc-type:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Will this trigger IE8 mode assuming no <meta> tags... is that the default mode in IE8 unless you tell it otherwise?

**NickFitz** · 25 January 2010, 23:01

Originally posted by d000hg View Post

Thanks a lot Nick, hoped you'd reply.

I added a doc-type:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Will this trigger IE8 mode assuming no <meta> tags... is that the default mode in IE8 unless you tell it otherwise?

It should do I believe - at least it will trigger strict mode in all browsers. There's a quick way to check the rendering mode but I haven't got around to updating it for IE8 yet

**DimPrawn** · 26 January 2010, 08:07

I can't believe you are on the bench Nick, your technical nouse is 2nd to none.

Do you blog about these finer technical points of web dev and SEO etc?

If not, you should.

**Spacecadet** · 26 January 2010, 08:42

Originally posted by DimPrawn View Post

I can't believe you are on the bench Nick, your technical nouse is 2nd to none.

Do you blog about these finer technical points of web dev and SEO etc?

If not, you should.

WHS - I demand free 24/7 access to your expertise as well

**d000hg** · 26 January 2010, 17:54

Originally posted by DimPrawn View Post

Who are you and what have you done with DimPrawn?

**xchaotic** · 29 January 2010, 10:43

Originally posted by d000hg View Post

HTML Code:

<html>
<head>
<meta http-equiv="Content-Language" content="en-gb" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Test</title>
</head>

I'm pretty sure it's an ugly abortion, but I don't really get the fine points. Is it better to make XHTML or HTML pages? Strict or transitional? I was looking here and can copy-paste, but I'd rather learn something.

Going back to your original question you should:
1. Ditch that horrible windows codepage and use unicode.
2. Since your sample terminates tags it's XML/XHTML, therefore I would suggest application/xhtml+xml rather text/html and the content type.

You can always use W3C to tell you things that need fixing.

Noob (X)HTML Doctype question