How to Build a Standards Compliant Website
A standards compliant website conforms to the W3 Consortium's recommendations for proper website coding. The W3, or World Wide Web Consortium has a website called the W3school, which has tutorials that explain proper website coding techniques, according to HTML 4.01, XHTML 1.0, and the brand new standard, still in draft form, HTML 5. This tutorial will cover XHTML, the latest standard in use amongst all current website browsers, including Internet Explorer 8, Firefox 3.0.11, Google Chrome 2.0.172.33, and Opera 9.63.
Other People Are Reading
Instructions
-
-
1
XHTML stands for Extensible Hyper-Text Markup Language. The language is essentially a combination of XML and HTML 4.01 It combines all the structural tags of HTML 4.01 and the strict rules from XML XHTML standards standardized all the messy, inconsistent coding techniques that browsers of the past allowed. The result of this practice was that webpages appeared differently in different browsers and on different screen resolutions.
The first rule that the W3 Consortium issued for XHTML is that all tags, attributes, and values must be in lowercase letters, with the exception of the DOCTYPE declaration. There should be no capitalized letters in any of the tags. -
2
The second rule that the W3 Consortium issued for XHTML is that every document must have a DOCTYPE declaration at the top of the document. A DOCTYPE declaration, according to the W3Schools website, specifies the syntax, or the interpretation rules that HTML must follow. There are three categories of rules: Transitional, Strict, and Frameset.
Here are the three DOCTYPE declarations:
Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Frameset:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Transitional XHTML allows the presentation features, such as the font tag and other decorative elements to exist within the code.
Strict XHTML only allows the structural elements of HTML, such as the table, heading and paragraph tags. It prohibits the use of the font tag and other decorative tags. Cascading Style Sheets are used to decorate the webpage.
Frameset XHTML: Used only when building frame-based webpages. -
-
3
The third rule that the W3 Consortium issued for XHTML is to surround all the attributed values within all beginning tags in quotation marks. HTML 4.01 allowed for unquoted values, but XHTML prohibits them.
Here is an example of HTML 4.01
<body bgcolor=red>
Here is an example of the new standard XHTML:
<body bgcolor="red"> -
4
The fourth rule that the W3 Consortium issued for XHTML is that all tags must be closed. The tags that don't have an end tag, such as the break tag, image tag, list tag, horizontal rule tag and input tag, must have a space and a forward slash before the greater than sign (>) that ends the tag.
HTML 4.01 allowed a tag to exist without an end tag. Here are some examples of HTML 4.01 tags that are prohibited in XHTML:
• A beginning <p> tag, to begin a new paragraph, with no end tag </p>
• <input type=submit name=submit value=Submit> (no forward slash)
• <br> (no forward slash)
• <li> (a beginning tag, but no end tag)
XHTML demands the following tags with no end tag to look like this:
• <hr /> (Horizontal rule)
• <br /> (line break)
• <input type="submit" name="submit" value="Submit" />
• <li></li> (a beginning and ending tag)
• <p></p> (a beginning and ending tag) -
5
The fifth rule that the W3 Consortium issued for XHTML is to nest all tags properly. For example, suppose you have the following code --
<p><font color="red">Please answer the question!</p></font>
HTML 4.01 would allow this coding mistake to occur. However, XHTML states that the paragraph tags must be on the outside and the font tags must be on the inside, as shown:
<p><font color="red">Please answer the question!</font></p>
Another way to illustrate this concept is in terms of a mathematical formula:
2(3+4)
The order of operations in math states that you add the three and four together to get seven, and then multiply the sum by two to get 14. XHTML's order of operations states that the first will be last and the second will be second to last, etcetera. -
6
The sixth rule that the W3 Consortium issued for XHTML is that forbids attribute minimization. This means that when you create a form with a select box, and you make one of those options selected, that the attribute and the value must state that the option is selected, as shown:
HTML 4.01
<option value="none" selected>
XHTML
<option value="none" selected="selected"> -
7
The seventh rule that the W3 Consortium issued for XHTML is that the beginning <html> tag must have the attribute xmlns, which is the XML name space, or template that the XHTML document will follow.
HTML 4.01
<html> or <HTML>
XHTML
<html xmlns="http://www.w3.org/1999/xhtml"> -
8
If you have an existing website that is not compliant with XHTML, follow this series of steps:
1. Add quotation marks to all the values of the attributes within all tags
2. Convert all single tags, like the break tag and image tag so that a space and a forward slash exists at the end
3. Make sure all beginning tags have an end tag
4. Make sure all attributes are maximized, that is, a selected element must say selected="selected".
5. Add the DOCTYPE declaration to the top of all HTML documents
6. Add the xml name space to the beginning html tag
7. Convert all upper case tags to lowercase
8. Validate your webpage at the W3Schools validator
If the website is compliant, you will receive a button to place on your webpage indicating that it is standards compliant. If it is not, the validator will list all the problems and what line each problem exists. Keep validating until all issues are corrected.
-
1
Tips & Warnings
If you believe your website is within all of the guidelines contained within this document, then you can validate it at the W3Schools website at: http://validator.w3.org/
