Categories
HTML

DocTypes & Code Validation

How to Validate Your Code

To check the validity of your code, you can submit it to https://validator.w3.org/, either by typing in a URL, uploading the file, or even cutting & pasting your document into a form field.

However, before you do that you must first add a Document Type Definition, so the software knows which flavor of (x)html you are using. After all, there are many kinds of HTML.

What is a DTD (Document Type Definition)?

The first line of all your web pages must be the Document Type Definition (aka the DTD, or doctype). The DTD tells the browser how to interpret the code in the page. The DTD is especially important because without it the most popular browser, Internet Explorer, will interpret the code in “quirks mode” rather than “standards mode.”

The former honors bugs in earlier versions of IE. Because millions of pages were built according to the way IE 5 (wrongly) laid out pages, for example, having the then-new IE 6 render the page properly would have created havoc, by breaking earlier layouts.

By using the correct doctype, in short, you increase the chances of all browsers rendering the page according to the standards set down by the W3C.

At this stage, just copy the DTD. In this class, we’re using the xhtml 1 transitional doctype. As noted above, it must be the first line of your documents.

Note also that the URLs in the DTD are case-sensitive.

In addition, add the following (xml namespace) as an attribute to the HTML tag:

xmlns=”https://www.w3.org/1999/xhtml” lang=”en” xml:lang=”en”

Finally, add the following meta-tag to the head of your document:

<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />

This meta-tag will ensure that “special” characters like quotation marks, etc, will render correctly. So your HTML skeleton will end up like this:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”https://www.w3.org/1999/xhtml” lang=”en” xml:lang=”en”>

<head>
<title>Web Page Template: The HTML Skeleton</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ /></head>

<body>

 

</body>

</html>

Do not worry at all if the above didn’t make complete sense.

Download a template file of this code.

Don’t cut and paste: the “smart” quotes in the example will cack in the validator.

One reply on “DocTypes & Code Validation”

Comments are closed.