Skip to main content

Lesson 14: Web standards and validation

Learn about the common standard of HTML and how to check your coding is correct.


Lesson 14: Web standards and validation

In this lesson, you will get a little more theoretical knowledge on HTML.

What more is there to know about HTML?


HTML can be coded in many different ways. And browsers can read HTML in just as many ways. You could say that HTML has many dialects. That is why some websites look different in different browsers.
There have been attempts to make a common standard of HTML through theWorld Wide Web Consortium (W3C) founded by Tim Berners-Lee (yep! the great guy who invented HTML). But it has been a long and tough road.
In the old days - when browsers where something you had to pay for - Netscape was the dominate browser. Back then, the most supported HTML standard where called 2.0 and later 3.2. But with a market share of over 90% Netscape did not have to - and did not - care much about common standards. On the contrary, Netscape invented their own strange elements, which did not function in other browsers.
For many years Microsoft almost completely ignored the Internet. After a while they took up the competition with Netscape and introduced a browser. The first versions of Microsoft's browser, Internet Explorer, were not any better than Netscape at supporting the HTML standards. But Microsoft chose to give away their browser for free (always a popular thing to do) and Internet Explorer soon became the most popular browser.
From version 4 and 5 Microsoft aimed to support more and more of the HTML standards from W3C. Netscape did not manage to develop a new version of their browser and continued to distribute the outdated version 4.
The rest is history. Today the HTML standards are called 4.01 and XHTML. Now it is Internet Explorer that has a market share of over 90%. Internet Explorer still has its own strange elements but it also supports the W3C HTML standards. And so do all of the other browsers, such as Mozilla, Opera and Netscape.
So, when you code HTML following the W3C standards, you make websites that can be seen in all browsers - both now and in the future. And luckily, what you have learned in this tutorial is a new and stricter and cleaner version of HTML called XHTML.

How do I tell which version is used?

With all the different types of HTML you need to tell the browser which "dialect" your HTML is in, in your case XHTML. To do that, you use a Document Type Declaration. The Document Type Declaration is always written in the top of the document:
Example 1:
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" >
<head>
<title>Title</title>
</head> <body>
</body> </html
<p>text text</p> >
Besides the Document Type Declaration (the first line in the example above), which tells the browser that you want to write XHTML, you also need to insert some extra information in the html tag with the two attributes xmlns and lang.
xmlns is short for "XML-Name-Space" and should always have the valuehttp://www.w3.org/1999/xhtml. That is all you need to know. But if you have a big hunger for complicated knowledge you can read more about namespaces on W3C's website.
In the lang attribute you state which language the document is written in. For this the ISO 639 standard is used, which lists codes for all the languages in the world. In the example above the language are set to English ("en").
With a DTD the browser knows exactly how it should read and show your HTML. Hence, use the example above as template for all your future HTML documents.
The DTD is also important when you want to validate your pages.

Validate? Why and how should I do that?

Insert a DTD in your pages and you can always check your HTML for errors by usingW3C's free validator.
To test this out, make a page and upload it to the Internet. Now, go to validator.w3.organd type the address (the URL) of your page and validate it. If your HTML is correct you will get a congratulations message. Otherwise you will get an error report telling you exactly what and where you have done something wrong. Make some errors on purpose to see what happens.
The validator is not just helpful to locate an error. Some browsers try to compensate for lack of skills among web developers by trying to fix errors in the HTML and showing the page as they guess it should look. With such browsers, you might never see an error in your own browser. However, other browsers might guess differently or not show the page at all. The validator can help you find errors you did not even know existed.
Always validate your pages to be sure they will always be shown correctly.

Comments

Popular posts from this blog

HTML 5 Comments Tag

HTML 5 Comments Tag Description The HTML 'comments' tag is used for creating comments within your HTML code. Comments aren't displayed in the browser - they are simply there for the programmer's benefit. Comments can assist you, the HTML programmer, because you can write notes to yourself that explain what the code does. This is especially useful when you have a lot of code.

Lesson 10: Margin and padding css

Lesson 10: Margin and padding In the previous lesson you were introduced to the box model. In this lesson, we will look at how you can change the presentation of elements by setting the  margin  and  padding properties. Set the margin in an element Set the padding in an element Set the margin in an element An element has four sides: right, left, top and bottom. The  margin  is the distance from each side to the neighboring element (or the borders of the document). See also the diagram in  lesson 9  for an illustration.

Lesson 11: Borders css

Lesson 11: Borders Borders can be used for many things, for example as a decorative element or to underline a separation of two things. CSS gives you endless options when using borders in your pages. border-width border-color border-style border The width of borders [border-width]