Holmes is a CSS stylesheet for diagnosing potentially invalid, inaccessible or erroneous HTML markup.
holmes.css is useful for checking the quality of your code (up to W3C HTML5 standards), nitpicking over ensuring markup is valid and semantic and accessility guidelines are met, and when you are tasked to fix up and debug an old, OLD website. It has a simple implementation and a mostly unobtrusive effect on your page. Not recommended for live enviroments.
Remember too that these are just guidelines: if something is flagged but you can’t change it for a good reason, don’t worry about it 🙂 Also use a validator if you want to be 100% sure.
It works by adding a class to the <body> tag and highlights elements with:
- missing required attributes on tags, such as name attributes on inputs
- possibly improvable markup, such as links with href=”#”
- deprecated and non-W3C elements – see W3C.org’s article on obselete tags
- non-W3C attributes – as above, just the most important ones since there are oo much of them
When a highlighted item is hovered, an informative message explaining the “reason” is displayed.
And, there is also a bookmarklet provided which can activate Holmes for any website instantly.
Compatibility: All Modern Browsers
Website: http://www.red-root.com/sandbox/holmes/