Jens Oliver Meiert

Get 15% off on select books on Gumroad—use discount code â€śtestdrive”.

Diagnostic Styling Reloaded

Post from August 1, 2009 (↻ December 5, 2021), filed under .

This and many other posts are also available as a pretty, well-behaved ebook: On Web Development. And speaking of which, here’s a short treatise just about managing the quality of websites: The Little Book of Website Quality Control (updated).

Eric cultivated the concept of “diagnostic styling,” meaning using CSS to track down problems within HTML documents. I’ve been working with diagnostic style sheets for general quality assurance or to uncover specific semantics or maintainability problems mostly through bookmarklets. One of these bookmarklet style sheets is now publicly available on Google Project Hosting GitHub:

QA Style Sheet.

I wrote this style sheet a couple of months ago for Google, not necessarily following specific needs but to provide an additional quality-related tool. To follow many other—though obviously much more impactful—examples of Google sharing code, I decided to make that QA style sheet public, too, on Google Project Hosting GitHub so as to play with that as well. This should explain both hosting and licensing of this rather small project.

Some things on the QA Style Sheet’s site are still work in progress. Above all I couldn’t directly link a bookmarklet of the style sheet, which is the most useful way of working with it (that bookmarklet link is available on a separate page). There are many ways to inform me about issues though, be it on the project site or in this place. While I hope it’s not difficult to understand what the style sheet does and why, I hope to slowly extend the site’s documentation.

About Me

Jens Oliver Meiert, on September 30, 2021.

I’m Jens, and I’m an engineering lead—currently manager for Developer Experience at LivePerson—and author. I’ve worked as a technical lead for Google, I’m close to W3C and WHATWG, and I write and review books for O’Reilly. I love trying things, sometimes including philosophy, art, and adventure. Here on I share some of my views and experiences.

If you have a question or suggestion about what I write, please leave a comment (if available) or a message. Thank you!

Comments (Closed)

  1. On August 1, 2009, 14:43 CEST, Neovov said:

    This is freakin’ excelent ! Thanks a lot, I’m gonna over-use it !

  2. On August 1, 2009, 21:55 CEST, Vladimir said:

    Useful. Thank you for sharing.
    I was thinking of building something similar, but with powerful tools like Firebug doesn’t make much sense now. It will be cool to make bookmarklet for IE6 who will simulate the DIV behavior.

  3. On August 4, 2009, 16:22 CEST, Jens Oliver Meiert said:

    Thanks, Nicolas, Vladimir (I’ve noticed that you’re experimenting a bit with bookmarklets, too).

Read More

Have a look at the most popular posts, possibly including:

Looking for a way to comment? Comments have been disabled, unfortunately.

Cover: The Web Development Glossary.

Get a good look at web development? Try The Web Development Glossary (2020). With explanations and definitions for literally thousands of terms from Web Development and related fields, building on Wikipedia as well as the MDN Web Docs. Available at Apple Books, Kobo, Google Play Books, and Leanpub.

Stay up-to-date? Learn about new posts by feed or on Twitter.

Found a mistake? Email me,

You are here: Home → Archive → 2009 → Diagnostic Styling Reloaded

Last update: December 5, 2021

Professional frontend developers produce valid HTML and CSS.