Make A Website That is Valid
If your reading this then we assume you already know the bare minimum needed to make a website. If not you can refer to Building Your First Website.So to make an HTML website validate in a W3C validator
, you need to make adjustments to your code. But just so we are both on the same page, let me explain what validation is and why it is important.W3C short for World Wide Web Consortium, is an organization that is in charged of create what is known as an website standard. The reason there needs to be a standard is make it easier for both people and programs to read an understand a site. For instance if you did not follow these standards, then your site might have trouble rendering properly in a web browser. This might lead to the user not being able to see the site. Another example is search engines. Search Engines can see a site much easer if the site follows the standards. This would make the site climb up the search engines easier.
Also in certain countries including the United States of America there are laws that state how necessary a website that follows the standards can be. So now your about to learn how to make a site follow the standards.
First I'm going to show you how to make a website validate using HTML 4.01. Then I will go little into HTML 5. The reason for this is because HTML is still the nore commonly used on and HTML wont be in full swing until 2012. Plus if you can validate one version of HTML you can validate all of them.
!Get started
<html> <head> <title>Hello</title> </head> <body> hello world </body> </html>
The above should look familiar to you. It is the same code we used to make your first HTML site earlier. And even the it works it doesn't fit the standards. Just like you have a car that works but doesn't pass inspection. Well now we will make modification to that code to make it pass inspection.
First modification we will do is at the very top of the code. Remove the spot that says HTML with the greater then less then tags around it. And add the following.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
So once you've done this your code should now look like the following.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Hello</title> </head> <body> Hello World </body> </html>
Now the part that is important to notice is the part that has the word strict in in it.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/~~#FF0000:strict~~.dtd">
If it says strict then you have least amount of flexibility. It where if you used other options you may be able to get away with a lot more.
Next we will use the transitional DTD. To do this you'll remove the following code, from your page.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Then you'll add the following code in it's place.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
The Transitional DTD includes presentation attributes and elements that W3C expects to move to a style sheet. Use this when you need to use HTML's presentational features because your readers don't have browsers that support Cascading Style Sheets (CSS):
Next code to know.
There is an option known as Loose. It is one of the most flexible opeions you can choose. And it is the easiest to use. To use it you need to remove the following line of code from your page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Then you need to add the following line of code in place of the code you just removed.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
How ever in HTML 4.01 there is something known as frames. You'll learn how to make frames later on. But here is what a page that uses frames should have. First remove the following lines.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
And add the following lines in place of the ones you just removed.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd
The Frameset DTD should be used for documents with frames. The Frameset DTD is equal to the Transitional DTD except for the frameset element replaces the body element:
Another type of language that can be used with an HTML website is XML. It can be used right inside of the page. But before using it you'll need to add the following to your code.
<?xml version="1.0" encoding="UTF-8"?>
After adding the above code to your page, you should have a page that looks like the following.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Hello</title> </head> <body> Hello World </body> </html>
Congratulations you now know how to make a page validate. Plus you found other things you may need to use if validation problems persist.