Using HTML
by Vivienne Trulock
Validation
So, how do you know that you've written your documents correctly? Fortunately, there are many validators which will check your code for you, but before you can use them you will have to add some tags to your document so the validator knows what it is looking at.
Doctype
Tye most important of these is the doctype. This explains to the validator (and to browsers) what version of html your document is written in. Just copy and paste the appropriate doctype into the very top of your HTML document (before the <html> tag).
HTML
HTML 4.01 Transitional
This is the form of HTML which must be used if there are any deprecated elements in your HTML page .
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Strict
This is the strict form of HTML which doesn't allow any deprecated elements.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
XHTML
If you are using XHTML, an even stricter form of HTML you will need to follow the following rules in your document:
- The first tag to open in a nested sequence of tags is the last one to close
- <p><em>italic text </em></p> is ok, but
- <p><em>italic text </p></em> is not
- All tags and attributes must be written in lower case
- <html> is ok, but
- <HTML> is not
- End tags are required for everything
- <p>some text </p> <p> another paragraph </p> is ok, but
- <p>some text <p> another paragraph is not
- All attribute values must be in quotes
- <a href="contact.htm">contact me </a> is ok, but
- <a href=contact.htm>contact me </a> is not
XHTML 1.0 Transitional
This is the same as same as HTML 4.0 Transitional except for the XHTML rules
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Strict
This is the same as same as HTML 4.0 Strict except for the XHTML rules
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.1
Even stricter, with no deprecated elements.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Encoding
As many people all over the world speak and create HTML documents in many different languages, the validator needs to know which character set you are using in your pages. For most western languages, the most commonly used encoding is 8859-1. Simply copy the code below into the head area of your web page (between the <head> and </head> tags).
HTML
<META http-equiv="Content-Type" CONTENT="text/html; charset=iso-8859-1" >
XHTML
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Validators
Probably the most well known html validator is on the w3c website. Simply browse to your file on your own computer and then press the 'Check' button. Errors are clearly shown with a brief description of what is wrong.
You can also validate your CSS the same way.
Try to validate the review exercises as you complete them and to correct any invalid code.
When you have completed the first exercise on 'Hearing' you can view the valid code below:
- valid xhtml code for review exercise 1 - hearing - click on this link then 'View > Source' in the browser.
- valid css code for review exercise 1 - hearing - this links directly to the css file. You might have to save it and then open it in Notepad.
Next Step
Now that you know how to create a basic page, the next step is to make an entire website.
