HTML Right or Wrong

But It Works

Just because your web page works in one browser doesn't mean that your HTML is correct. Even if you test your page in all the major browser and it looks reasonable in all of them still doesn't mean that it is done the right way.

Since HTML was first created the expectations of what we should be able to do with web pages has changed significantly. In order to cater for the changing expectations the HTML specification has changed and other specifications such as CSS and JavaScript have been added. As the most appropriate way to add some of this extra functionality wasn't obvious from the start there was some experimentation done with adding different ways of achieving a given result in order to figure out which one works the best. That best choice was the one that was then adopted into the standards for all browsers to use.

Since many web pages were written back when this experimentation was going on some of the browsers still support those other experimental ways of achieving the results so that those web pages written long ago that used those methods will still display the way that they were intended to. As time goes on though the relevance of those really old pages is becoming less and so browsers are gradually considering dropping support for those approaches that were never a part of the standards. Also many of the newer web browsers never supported such methods since they were considered to be long obsolete when the browser's rendering engine was developed.

There are a great many web pages designed to look good in Internet Explorer 6 which due to the backwards compatibility built into more recent versions of IE still look good in that browser but which look absolutely awful in every other browser because the HTML used is over 10 years out of date and is inappropriate for the modern web.

The way to correct your page for these sorts of issues is to validate the HTML of your page to confirm that it complies with the correct HTML standard. You do this by making sure that your web page starts with an HTML 4.01 strict doctype and then process the page through one of the many validators that is available to confirm that your page actually validates. That way you know that your page is not using any proprietary or outdated (deprecated) tags which will not be supported by future browsers. You should of course also validate the other components of your page such as the CSS in a similar way.

But it Validates

With a page that validates you have a page that is a lot better than one which simply works in one or two browsers since a page that uses valid HTML is more likely to work in all browsers rather than just some of them. That isn't the end of the story though because it is possible to write a web page using HTML that validates and yet still be using the entirely wrong HTML tags.

The biggest mistakes that people make in this regard is in using HTML tags for purposes for which they were not intended or not using the HTML tags for the purposes for which they were intended. Each of the HTML tags that exists was created for a specific purpose and while you can write a web page that works and is valid without considering the intended purpose of the HTML tags, your page will be easier to understand if you use the correct HTML tags that properly identify what your content is. This is sometimes called writing semantic HTML.

One of the biggest mistakes that people used to make in this area was to use HTML table tags (which are intended for setting out tabular data) to do their web page layout. Now HTML isn't intended to do the page layout at all (that would be the purpose of CSS) and with all the different media on which web pages can be accessed the same appearance isn't going to work for all of them anyway. A good test for if you are using tables appropriately is to check that you have some <th> tags for the headings as well as the <td> tags for the data in your table. You might also try setting a border on your table cells and see what the page looks like then. If the page looks completely wrong with borders around the cells then your content doesn't belong in a table (that doesn't mean you have to keep the borders, you just need to be aware that some people turn on borders on tables so as to make the table easier to see).

The biggest mistake that people then make upon discovering that tables are wrong is to start substituting div tags for everything where they used a table before. This is wrong for two reasons. Firstly it often means that they are removing tables from their page where the table was the semantically correct way of coding the web page. Secondly the div tag should only be used for page divisions and for situations where there is no semantically correct tag that can be used. Many people in avoiding using tables end up using div tags without considering all of the other HTML tags that are available and often there is a better tag to use which will more clearly identify what that part of your page content actually is.

By using the semantically correct HTML tags in your page as much as possible as well as making sure that your page properly validates with a strict doctype you will ensure that you are using the most correct HTML that you possibly can where the HTML helps as much as possible to make it clear what the content of your page is and so helps to ensure that it is as understandable as possible to as many of your visitors as possible regardless of which browser they are using and how they have it configured.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow