Joy Of Code - Web Design Training and Consulting
Joy Gems Newsletter

XHTML Brush Up Tips
(Part 1 of 2)

Share

By Bud Kraus
bud@joyofcode.com
Joy Of Code
Creator And Instructor

v5 i4
Originally Published: February 19, 2009

Does it really matter whether you know how to write good XHTML (Extensible Hyper Text Markup Language)?

In the words of one governor from Alaska, "You betcha." (I know it's a little dated, but it works).

Just for starters, knowing XHTML (and how to create well formed documents) has more than just these benefits:

  • Your web pages will be Search Engine Optimized almost by default. (Yes, there's more to SEO but good markup practice is first on the list.)
  • Your web pages will be parsed (understood) by a wider number of display environments and devices.
  • Your designs using Cascading Style Sheets will work the way you expect them to if you use XHTML correctly.

The hallmark of XHTML is that it is predictable. It is a symmetrical, containerized markup system (that means it uses tags). There is no need for guesswork if a few simple rules are respected.

In case you've forgotten XHTML - or never learned it correctly to begin with - I offer up a few tips that you should always keep in mind.

1. All web pages are required to have these tags.

Before you do anything - do these tags. This is the barest of coding bones and they're where all good web pages begin.

<!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>The Title Of Your Page Will Go Here</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>

<body>
</body>

</html>

Here's what you need:

  • A DOCTYPE Statement to identify to the browser and to the XHTML validator which type of markup is being used.
  • The <html></html> container.
  • The <head></head> container which must include the <title></title> and <meta> tags.
  • The <body></body> section where all the content a user sees will go.

2. Every open tag must have a close tag.

This is what XHTML is all about or rather what XML - Extensible Markup Language is about.

Almost every Internet technology that is being developed by the W3C is based on XML. That means XHTML is an application (use) of XML. So too are SMIL, RSS, XSLT, and SVG, to name a few of XML's applications.

What's the basic building block - the simple formula - for so much of what makes the Internet work?

<tag>some content goes here between the open and close tag</tag>

That little pattern is the kernel of most Internet technologies.

Here's a tiny example.

<p>Use a P tag when you're making a paragraph.</p>

3. Only use XHTML to provide meaning to your content. XHTML has nothing to do with how your page looks.

Really. It has nothing to do with how your web page looks. NOTHING. Zip. Zilch. Nada.

XHTML is like grammar because it gives meaning to words. Without it your copy would be meaningless - just random words. With XHTML we organize our content into paragraphs, lists, links, and tables for organizing info into rows and columns.

4. XHTML is written in lowercase.

You may think there's no difference between <p> and <P> and you might be right. But XHTML is very precise. There's no room for carelessness. Because it is precise, there is no guess work in how it's to be written - which is what a lot of people prefer.

Part 2 of 2