XHTML Validation :: Most Common Mistakes (x-html)

admin's picture

To make sure that our x-html is as compatible as possible with all modern browsers we should strive to creating and publishing valid code in compliance with the recommendations of W3C (the body responsible for setting regulations and standards for valid web based code.) We can check or pages for validity very easily by using the W3C's online validation tools. We can check pages by pasting in a link to our online files or even by browsing and uploading from our local machines. So what things should we look out for when creating valid xhtml documents? I recommend you research the subject in more indepth terms using the W3C's main website, but to get you started here's what i consider the two most common mistakes made by developers and designers, which will result in invalid x-html code. You will be surprised at the number of errors thrown up by the validator can be fixed by adhering to these simple rules:

The ALT attribute

This is THE most common oversight which will result in invalid mark-up. All images and even map area have to contain an alt attribute to be valid. An alt attribute is a short one line description of an image or map area, which is visible on mouse over in IE or as replacement text when an image is missing or doesn't load properly. Useful to those who have set their browser not to display images and completely necessary for those with poor or no sight, using screen reading software. The alt attribute is place inside the img tag like so: < img width="100" height="50" alt="this is a picture of a horse" />

Closing Self Closing Tags

A self-closing tag is a tag which does not require a separate enclosing end tag to complete. Some of the most common self closing tags include: < img / > < input / > < br / > < hr /> You will notice here (as in the img alt example above) that even though these tags don't need a separate closing pair, they do need to be closed internally using a '/' before closing. To recap, here's an invalid and then valid version of the same declaration: Invalid: < img width="100" height="50"> Valid: < img width="100" height="50" alt="this is a picture of a horse" />

19 people like this