Some tips for HTML Validation

February 17, 2010 | Posted by LUV | No Comments

Some people say that validating the HTML code can improve the website ranking in Search Engine and the website speed so today. Then, I tried to validate HTML of my website and finally it passed. However, before getting passed, there were a lot of errors and I searched for the solutions over the Internet. Therefore, in order to save time, I would like to share some tips that can make your HTML valid.

- Don’t forget to declare Doctype : Doctype is used by the Web Browser to tell what version of the markup language the page is written in. Also, it refers to the Document Type Definition (DTD) that specifies the rules for the markup language. With this, the browser can correctly render the content. There are several types of Doctype but the most found one is XHTML 1.0 Transitional. You can see more details about Doctype at http://www.w3schools.com/tags/tag_DOCTYPE.asp.

- Specify the required attribute ‘type’ : For example, if you use Javascript in your webpage you should specify the required attribute type as type=”text/javascript”. Also, if you use CSS, you should specify the required attribute type as type=”text/css”.

- Properly close Tags : Any empty tags should be closed by ‘/>’ instead of ‘>’
i.e. <meta name=”keywords” content=”XXXXX” > invalid
<meta name=”keywords” content=”XXXXX” /> valid
Some empty tags I have frequenly found are meta, img, link, br, hr.

- Specify Alt : Please note that, any images used in the webpage need to have Alt. In other words, alt must be always found in <img />
i.e. <img src=”XXXXXXX” width=”40″ height=”40″ border=”0″ /> invalid
<img src=”XXXXXXX” alt=”XXXX” width=”40″ height=”40″ border=”0″ /> Valid

- Use lower case : Any HTML tags should be in lowercase.
i.e. <IMG src=”XXXXXXX” width=”40″ height=”40″ border=”0″ /> invalid
<img src=”XXXXXXX” alt=”XXXX” width=”40″ height=”40″ border=”0″ /> Valid

- Don’t specify attribute ‘height’ and ‘background’ in <table>, <td> and <tr> tags : In order to specify height or use background in Table, You should apply style instead.
i.e. <td width=”46″ height=”55″ valign=”top” background=”images/xxxx.jpg”></td> should be changed to
<td style=”width:46px; height:55px; background-image:url(‘image/xxxx.jpg’);” valign=”top”></td>

- Place the right tag into the right place : For example, Stylesheet or meta tags should be placed between <head> </head> not <body> </body> or Doctype has to be declared before <head>.

- Avoid ‘&’ : The symbol ‘&’ should not be used in the HTML code. ‘&’ can be used to mean ‘and’ or in some dynamic urls (i.e. <a href=”http://www.xxxx.com/index.php?id=87&language=th”></a>). Therefore, what you should do is changing ‘&’ to ‘&amp;’.
i.e. <a href=”http://www.xxxx.com/index.php?id=87&language=th”></a> invalid
<a href=”http://www.xxxx.com/index.php?id=87&amp;language=th”></a> valid

OK these are some tips that you should keep in mind when you want to create the website. However, again if anyone has more tips or solutions for any HTML Errors, please please please share with us here..

Oh wait you can check your HTML Errors at http://validator.w3.org/

Category : Miscellaneous

Leave a Reply