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 the World 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 were something you had to pay for — Netscape was the dominate browser. Back then, the most supported HTML standard were 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.
In Internet Explorer version 4 and 5, Microsoft aimed to support more and more of the HTML standards from W3C. Now, all browsers are expected to support HTML 4.
The latest HTML standard is version 5 — and it is still a work in progress. All browsers support HTML 4 and most browsers support most features of HTML5 — everyone is upgrading because HTML5 is cleaner and easier to write. All the browsers including Internet Explorer, Mozilla, Opera, and Chrome are trying to support every new HTML5 feature. To see how well your browser is doing, test it at http://html5test.com/.
So, when you code HTML5 following the W3C standards, you are building for the future (and saving yourself the hassle of having to update to HTML5 soon).
What's the difference between HTML4 and 5?
HTML4 has been used since 1994 (for so long that we've just called it HTML). In the past 10 years, people have also been using XHTML 1.1 (a combination of HTML and XML). HTML5 is a significant improvement over both of these older standards, mostly in the areas of usability and common sense. What's different?
- It's easier to work with.
- It does some very cool things with videos, images, and dragging and dropping that were not possible before.
- We have new and easier tags to work with, like
<article>and<footer>, which make sense right away. - It got rid of some tags because they handle only the presentation of content, which is better handled in a Cascading Style Sheet (CSS):
- basefont
- big
- center
- font
- strike
- tt
- HTML5 promotes usability and accessibility for everyone, so it removed some old tags:
- frame
- frameset
- noframes
- People were confused by the following tags, which have also been removed:
- acronym (use abbr instead)
- applet (use object instead)
- isindex (use form controls instead)
- dir (use ul instead)
How do I tell which version of HTML is used?
In older versions HTML, you needed to tell the browser which "dialect" your HTML is in. You still do it with HTML5, but in a streamlined way. The Document Type Declaration is always written in the top of the document:
Example 1:
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<p>text text</p>
</body>
</html>
This is an HTML5 page. It is simple and does not contain much extra information.
Example 2:
<!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>
<p>text text</p>
</body>
</html>
This is an XHTML page and it includes all sorts of extra information including the rules that the page must adhere to (the DTD) and a namespace path (for the XML part). Many existing websites use this version of HTML…but not for much longer.
With a DTD, the browser knows exactly how it should read and show your HTML. Hence, always insert "<!DOCTYPE html>" in top of your document and use the example 1 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 using W3C's free validator.
To test this out, make a page and upload it to the Internet. Now, go to validator.w3.org and 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.
| Related topics in the | Replies | Views |
|---|---|---|
| No related topics yet | ||