[an error occurred while processing this directive]
Go to Bottom Nav - April 21, 2018 - No exercises at this time - ERRORblah Happy Holidays and Semester Break!

All Web pages done for this class must validate, with no errors, according to the W3C's online HTML Validator using the XHTML 1.0 Transitional DTD. Additionally, all pages using any external, internal, or local cascading style sheets (CSS) done for this class must validate, with no errors, according to the W3C's online CSS Validator using CSS version 2. These validators, and other useful tools, are found at http://www.w3c.org/

Note that even though a page's XHTML code or CSS may validate with no errors, the page may still contain other errors. These validators will not know if your paths are incorrect, for example.

How to Use the W3C's Validator for XHTML 1.0

1) Make sure that your XHTML document starts out with the correct DOCTYPE declaration. Almost all of them will use the Transitional DOCTYPE, we will also make one assignment with the Frameset DOCTYPE. If you are feeling adventurous, try out the Strict DOCTYPE; remember that it is very strict. Choose the appropriate DOCTYPE below and place it before the <html> tag.

  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    Transitional DOCTYPE will validate with deprecated tags and tag attributes from HTML 4.0.1 except for framesets. We will be using the Transitional DOCTYPE for this class!
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    Frameset DOCTYPE allows depricated tags and tag attibutes from HTML 4.0.1 including framesets. We will use this DOCTYPE for the framesets exercise.
  • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    Strict DOCTYPE is as it is titled, very strict. No deprecated tags and tag attributes allowed. It does produce lean code though...

2) Make sure to include the XML namespace attribute (xmlns="http://www.w3.org/1999/xhtml") in the <html> tag. It looks like this:
<html xmlns="http://www.w3.org/1999/xhtml">

XHTML follows the same syntax rules as xml; the attribute xmlns (xml name space) leads the browser to a document with the rules the page must follow.

3) Specify the character set using a meta tag within the <head> section of the document.

The character set declaration is contained within a meta tag; it and other meta tags live in the head section of the XHTML document. It lets the browser know which character set to use when displaying text on the page. For the webhawks.org server, use:
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

Other servers may not "force" the utf-8 standard or you may have created your files with a different character set. Another common character set is:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

4) Upload your page to the Webhawks.org server.

5) View your page in a Web browser. Copy the URL from the browser's address window.

6) Go to the online HTML Validator. (Note: if the W3C's HTML Validator site site is down, see the alternative validator site section below.)

7) In the Validate by URI section, paste the URL of your page into the Address field.

8) Click the Validate this page button.

9) If there are any errors, correct them, re-upload the page, and validate it again.

Required attributes (that are sometimes forgotten)

<img /> tag

All <img /> tags require an alt attribute, an alternative text description of the image, as shown below:
<img alt="dog" src="dog.gif" />

For invisible pixels used as spacers or shims, use the empty alt value (nothing between the quotes) as shown below:
<img alt="" src="cleardot.gif" />

<form> tag

All <form> tags require an action attribute. Normally the value of the action attribute is the path to a CGI script. However, if your form is not meant to be processed by a CGI script (perhaps it is meant to be used with JavaScript), use the empty action value (nothing between the quotes) as shown below:
<form action="">

<script> tag

If you use JavaScript, your <script> tag needs to have a type attribute:
<script type="text/javascript" language="javascript">

How to Use the W3C's CSS Validator

1) If your page uses any external, internal, or local CSS, you must also make sure your CSS validates (even though the HTML Validator may say your page has no HTML errors, your page may still contain CSS errors).

Go to the online CSS Validator.

2) In the Validate documents by URI section, enter the URL of your page (or the address of your external style sheet) into the field.

3) Leave the Profile on CSS version 2.

4) Click the Submit this URI button.

5) If there are any errors, correct them, re-upload the page, and validate it again.

Note that when you use the CSS validator to check a page that does not have a link to an external style sheet and does not contain an internal style sheet, you will get a warning that says: "No style sheet found." This is OK; it will still check any local styles. But if you get the "No style sheet found" warning and you are linking to an external style sheet, then your path to the external style sheet is incorrect.

Background color

If you use CSS to specify the color of an element, you should also use CSS to specify the element's background color. If you don't want to specify a custom background color, you can use:
background-color: transparent

Alternative validator site

If you cannot connect to the W3C's HTML Validator site, try again after a few minutes. If the site is still down, try their UK mirror site at:
http://www.mirror.ac.uk/services/validator/


HTML 4.0.1 information is included below.

How to Use the W3C's Validator for HTML 4.0.1

1) Add the DocType Declaration for HTML 4.01 Transitional to your page. To do this, place the following line of code at the very beginning of your document, before the <html> tag:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Note: if your page contains a <frameset> tag, you must use the "HTML 4.01 Frameset DTD" instead. See the validating framesets section below.

2) Add the character encoding meta tag to your page. To do this, place the following line of code in the <head> section of your document*:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
This is a commonly use character set, check your text editor to see your output options.

On the webhawks.org server use this meta tag within the head section of your page if you are validating from your desktop. The server supplies it when the file is located on the server.
<meta http-equiv="content-type" content="text/html; charset=utf-8">

3) Upload your page to the Web server.

4) View your page in a Web browser. Copy the URL from the browser's address window.

5) Go to the online HTML Validator. (Note: if the W3C's HTML Validator site site is down, see the alternative validator site section below.)

6) In the Validate by URI section, paste the URL of your page into the Address field.

7) Click the Vaildate this page button.

8) If there are any errors, correct them, re-upload the page, and validate it again.

Required attributes (that are sometimes forgotten)

<img> tag

All <img> tags require an alt attribute, an alternative text description of the image, as shown below:
<img alt="dog" src="dog.gif">

For invisible pixels used as spacers or shims, use the empty alt value (nothing between the quotes) as shown below:
<img alt="" src="cleardot.gif">

<form> tag

All <form> tags require an action attribute. Normally the value of the action attribute is the path to a CGI script. However, if your form is not meant to be processed by a CGI script (perhaps it is meant to be used with JavaScript), use the empty action value (nothing between the quotes) as shown below:
<form action="">

<script> tag

If you use JavaScript, your <script> tag needs to have a type attribute:
<script type="text/javascript" language="javascript">

Validating framesets

A frameset page will not validate according to the HTML 4.01 Transitional DTD. On a page with a <frameset> tag, you must use the "HTML 4.01 Frameset DTD" instead. On your frameset, or "parent," page, place the following code at the very beginning of your document, before the <html> tag:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Note that any "child" pages that appear in the frames of a frameset page are still standard Web pages, and should use the standard HTML 4.01 Transitional DTD. Only a frameset page uses the HTML 4.01 Frameset DTD.

If your frameset page uses the <noframes> tag, the <noframes> section must be within a <frameset> section or the page will not validate.

Heading One
Ut pharetra, ante eget imperdiet ullamcorper, tortor nunc sollicitudin orci, non cursus neque nisl eget ligula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum, nibh in suscipit interdum, velit magna volutpat turpis, at ornare sem magna et tellus. Sed pulvinar facilisis ligula, id vehicula eros sollicitudin a. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Heading Two
Vivamus vestibulum, augue id iaculis sodales, odio odio feugiat arcu, scelerisque congue nisi ipsum vitae orci. Nunc sed ligula quam. Cras sed iaculis neque. Proin ultricies consectetur tortor, eu pulvinar sapien commodo ac. Cras diam arcu, lacinia id mattis ut, convallis sed massa. Nullam ut arcu lacus. Suspendisse ultricies elementum arcu ut dictum.
Heading Three
Sed aliquet augue ut ligula porta gravida pellentesque sapien semper. Duis mauris massa, semper pulvinar eleifend id, tincidunt fermentum nulla. Proin ipsum neque, imperdiet in vestibulum non, hendrerit ac nisi. Maecenas eleifend libero quis urna lacinia elementum. Etiam mi massa, sollicitudin nec accumsan in, aliquet in dui. Pellentesque consequat diam quis felis luctus a vehicula lectus mollis.
Pull Down Menu Close Menu