[20]//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 
   
           content="text/html; charset=utf-8" />
 

 
 


The markup above is the most basic web page you'll see here. It contains practically no content of any value (at least, as far as someone who looks at it in a browser is concerned), but it's crucial that you understand what this markup means. Let's delve a little deeper.

The Doctype

   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

This is known as the doctype (short for Document Type Declaration). It must absolutely be the first item on a web page, appearing even before any spacing or carriage returns.

Have you ever taken a document you wrote in Microsoft Word 2003 on one computer, and tried to open it on another computer that ran Word 97? Frustratingly, without some pre-emptive massaging when the file is saved in the first place, this just doesn't work. It fails because Word 2003 includes features that Bill Gates and his team hadn't even dreamed of in 1997, and Microsoft needed to create a new version of its file format to cater to these new features. Just as Microsoft has many different versions of Word, so too are there different versions of HTML, the latest of which is XHTML. Mercifully, the different versions of HTML have been designed so that this language doesn't suffer the same incompatibility gremlins as Word, but it's still important to identify the version of HTML that you're using. This is where the doctype comes in. The doctype's job is to specify which version of HTML the browser should expect to see. The browser uses this information to decide how it should render items on the screen.

The doctype above states that we're using XHTML 1.0 Strict, and includes a URL to which the browser can refer: this URL points to the W3C's specification for XHTML 1.0 Strict. Got all that? Okay: jargon break! There are too many abbreviations for this paragraph!

Note: Jargon Busting 101

URL
URL stands for Uniform Resource Locator. It's what some (admittedly more geeky) people refer to when they talk about a web site's address. URL is definitely a useful term to learn, though, because it's becoming more and more common.

W3C
W3C is an abbreviation of the name World Wide Web Consortium, a group of smart people spread across the globe who, collectively, come up with proposals for the ways in which computing and markup languages that are used on the Web should be written. The W3C defines the rules, suggests usage, then publishes the agreed documentation for reference by interested parties, be they web site creators like your good self (once you're done with this book, that is), or software developers who are building the programs that need to understand these languages (such as browsers or authoring software).

The W3C documents are the starting point, and indeed everything in this book is based on the original documents. But, trust me: you don't want to look at any W3C documents for a long time yet. They're just plain scary for us mere mortals without Computer Science degrees. Just stick with this book for time being -- I'll guide you through!

The html Element

So, the doctype has told the browser to expect a certain version of HTML. What comes next? Some HTML!

An XHTML document is built using elements. Remember, elements are the bricks that create the structures that hold a web page together. But what exactly is an element? What does an element look like, and what is its purpose?

• An XHTML element starts and ends with tags -- the opening tag and the closing tag. (Like any good rule, there are exceptions to this: empty elements, such as meta, use special empty tags. We'll take a look at empty tags soon.)
• A tag consists of an opening angled bracket (<), some text, and a closing bracket (>).
• Inside a tag, there is a tag name; there may also be one or more attributes.

Let's take a look at the first element in the page: the html element. Figure 2.2 shows what we have.

Figure 2.2. Constituents of a typical XHTML element

Figure 2.2 depicts the opening tag, which marks the start of the element:

Below it, we see the closing tag, which marks its end (and occurs right at the end of the document):

Here's that line again, with the tag name in bold:

<html xmlns="http://www.w3.org/1999/xhtml">

And there is one attribute in the opening tag:

xmlns="http://www.w3.org/1999/xhtml">

Note: What's an Attribute?

HTML elements can have a range of different attributes; the available attributes vary depending on which element you're dealing with. Each attribute is made up of a name and a value, and these are always written as name="value". Some attributes are optional, while others are compulsory, but together they give the browser important information that the element wouldn't offer otherwise. For example, the image element (which we'll learn about soon) has a compulsory 'image source' attribute, the value of which gives the filename of the image. Attributes appear in the opening tag of any given element. We'll see more attributes crop up as we work our way through this project, and, at least initially, I'll be making sure to point them out, so that you're familiar with them.