dionidium.com

Wayne Burkett's Weblog | Home

Markup Review #1: Revisiting CSS Signatures
06:45PM CST June 28, 2003

We've added id="www-dionidium-com" to the html element of each page of our site, a practice dubbed "CSS Signatures" and introduced by Eric Meyer late last year. This technique allows anyone to restyle pages on our site within a user style sheet without affecting other sites. For example, if you think links on this site would be easier to locate if they had a dashed, red border, simply add the following line to your user style sheet:

#www-dionidium-com a { border: 1px dashed red !important; }

Visually impaired users may wish to increase our font size. Color-blind users may wish to change color combinations. The possibilities are nearly unlimited.

We're adding id="www-dionidium-com" to the html element because we already use ids on the body element to control presentation of other elements in our own style sheets. We could have applied the signatures to the body element and used classes for other controls, like Mark Pilgrim (suggested to him by Simon Willison), but felt a little dirty using a plural attribute, the class, to control singular items on the page, like our you-are-here marker.

We're bringing this up now because, though this technique was first discussed in September 2002, there are still several high-profile webloggers who do not use it, even those who traditionally jump on simple accessibility enhancements. This is a very simple way to increase usability and grant control to those who should have it: users.