A recent study by Opera has found that only 4.13% of websites are valid. Although admittedly sometimes writing invalid HTML can’t be helped, there are many errors that can be easily avoided. These are:
Using outdated tags and attributes
Over the years, W3C have depreciated a number of HTML tags (such as <center> and <u>) and tag attributes; stuff that can be better done with CSS. However, many people forget to update their HTML (or a WYSIWYG editor uses these depreciated tags), and so they end up in websites anyway. Sometimes using CSS doesn’t quite cut it, and the author has no choice but to use depreciated tags and attributes.
Using the incorrect tag
This won’t throw up an error in the validator, but is certainly incorrect HTML. It seems loads of people don’t realise how much HTML and CSS is actually out there: there’s definition lists (for question/answer type lists), css for better form and page layout (rather than tables), more table tags than the usual column/cell tags, and six different header tags (which shouldn’t be used for their typography!). If you use the correct semantic HTML, it will vastly improve site accessibility and SEO.
Not using HTML entities
Certain characters, such as &, <, >, and £ need to be converted to their entities. Again, this is usually down to poor WYSIWYG editors, or people who are unaware of this requirement editing sites. Not using entities isn’t usually the end of the world, especially if it’s a common character (such as the ampersand), but it may cause problems with foreign characters.
Using invalid HTML/XHTML syntax
In XHTML all tags need to be closed, even if it’s a self closing tag such as <br />. In HTML, not all tags need to be closed but a good number still do. There are other changes such as only allowing lowercase tags and requiring quotes in attributes. Often when converting from HTML to XHTML, these are missed, and sometimes can cause problems with the website not displaying as intended.
Also, sometimes you may forget to close your tag pairs. A good HTML editor will warn you about this!
Putting tags in the wrong place
Sometimes if you put a tag somewhere where the validator isn’t expecting it, an error will show. This includes not surrounding inline elements (such as <span> or <a>) with block elements, or putting other tags inside lists.
Not using the ‘alt’ attribute
I cannot stress how important the alt attribute is! It’s important not only for accessibility but also for SEO. If your image is purely decorative, still use the alt attribute but leave it empty (alt=”"), or better yet use CSS.
And there we have it, six HTML errors that I see a lot, although there are many more. It’s always good practice to run your site through the validator to catch any mistakes you make, to make everybody’s life easier!
Clair, what about the
titletags? It’d be more than 6?Hi Dani, I’ve appreciated your replies today and hope you’re happy with my responses.
I’m not sure what you mean by title tags, do you mean where those who use web editors such as Frontpage forget to change it from the default “Untitled”?
I enjoy here, reading your nice posts, Clair.
Sorry for the unclear question.
Sometimes the use of
titlein a links is too much accessibility. They already have a descriptive anchor text. No need moretitle.And Clair, I’m using 1024px screen, but always in less than 1024px wide for browsers. On Firefox 3.0.8, your comment form is too wide, breaks the design.
Thank you very much
Agreed, sometimes you can go too far with accessibility — not just with the wasted effort and time (Paul Boag talks about this on Audioboo) but with giving too much to screenreaders… something I need to look more into myself. I guess it’s a fine line
Thanks for letting me know about the comment form issue, will look into the best fix for that