XHTML/XHTML Grammar

Introduction

edit

There is little difference in grammar between HTML coding and XHTML coding. In this chapter we will discuss the similarities and the differences in the coding.

What Is Still The Same In XHTML?

edit

A lot actually, but it has to be more structured. For example, in HTML you do not have to put p (paragraph) tags in; they are optional. In XHTML you have to.

In other words you cannot put text directly into the body anymore, the user must add elements to the text. The elements have not changed drastically. The following sections discuss changes.

Casing in XHTML

edit

As mentioned, the coding is strict compared to HTML. One such case is that the tags and attributes have to be lowercase. In HTML you could get away with this:

<P>This is a paragraph</p>

In XHTML, this is not valid. ALL tags and attributes must be in lowercase, like this:

<p>This is a paragraph</p>

This is correct XHTML, all the tags are in lowercase.

Opening and Closing Tags in XHTML

edit

As in normal HTML, you must close the tags. In HTML browsers, you could get away with it, it would still show the webpage, but it ends up looking unusual. Now in XHTML, Opening and Closing tags are musts. Like this:

<p>The <b>Cat</b> sat on the mat.</p>

This is good XHTML coding, remember to open and close a tag. Notice that the tags are also well formed. The b (bold) tag is within the p (paragraph) tag.

Empty Tags

edit

No tag pair should be empty. If you need to represent an empty tag, you need to include a slash within the tag itself. For example, <br> is replaced with <br />.

Dealing with Attributes

edit

As mentioned, attributes must be lowercase. For example:

content="text/html; charset=iso-8859-1"

Also notice that the value of the attribute is quoted. There are also some attribute values that are in capitals, such as:

http-equiv="Content-Type"

This is a rare case. The attributes must have a value; they cannot stand alone any more.

Linking and URL Techniques

edit

When it comes to internal linking, things have changed. This is the XHTML way of doing it:

This is the link that takes you to the section on the page:
<a href="#Fred">Go to Fred</a>
This is the position where the link will take you:
<p id="Fred">This is Fred</p>

Some criticize that the developer still has to add the old "name" attribute to the tag. This is still okay to do, as some old browsers may not read the new command.

The developer also has to worry about ampersand characters. These are special characters in page addresses or forms, such as those used in PHP forums. If the user has to code one of these into XHTML, he or she has to change the following:

<a href="forum.php?&style=orange">Forum</a>

becomes

<a href="forum.php?&amp;style=orange">Forum</a>

Notice that the & became &amp;.

Images

edit

Nothing much has changed in the way of images. The only thing that the user has to consider is the alt attribute. In HTML, it was optional to have this. Now it is compulsory to put this in, in the event that the image cannot be rendered:

<img src="photo.gif" alt="Photo of the Beach" />

What this does is display a text were the photo is supposed to be when it cannot be found in the source file.

Applets

edit

Although the applet tag was usable but considered bad development, strict XHTML no longer allows it. If you want to use an applet, whether Java or Flash, you will have to use the object tag from now on.

Deprecated Tags

edit

You can still use these tags when you declare the DTD Transitional or Frameset (except for <xmp>) but it is recommended that you do not use these:

  • <applet>
    
  • <basefont>
    
  • <b>
    
  • <center>
    
  • <dir>
    
  • <font>
    
  • <i>
    
  • <isindex>
    
  • <menu>
    
  • <s>
    
  • <strike>
    
  • <u>
    
  • <xmp>
    

These tags are invalid in XHTML 1.1