When taking into consideration the average person browsing the Web, there isn’t much cause for concern regarding user style sheets interfering with your intended CSS. Many people are not aware of the fact that you’re able to control virtually every aspects of any document rendered in your own browser. This can be attributed to the fact that in order to take advantage of such a feature, a working knowledge of CSS is required.
Customizing browser form controls with user CSS
A small post over at Open Switch clued me into an article with instructions on how to prettify the Firefox widgets (screenshot provided). The post provided readers using Linux a way to improve the aesthetics of the various form controls provided by default in Firefox.
I was intrigued so I took a second to run the small script, after a quick Firefox restart all of the ‘default’ form controls had a new and improved look. At first glance, they’re a vast improvement over the stock controls originally offered. Naturally, I became curious as to what exactly was happening under the hood.
I began poking around the shell script, inspecting the installation process. To put things simply, the script appends two style sheets as well as a set of six images to complete the new control designs.
The purpose of user styles
User styles are designed to allow readers the ability to control how their browser displays content by default. While user styles can still be influenced by site CSS, user styles can have great affect on the final display of any webpage. A good way to think about user style sheets is giving your reader the ability to infinitely expand various dialogs in their browser preferences to include any aspect of a documents design.
In my personal experience, however, I don’t think that I’ve come across anybody that has taken the time to customize their default font size or link colors, let alone use an entire style sheet.
Does anyone you know use their own style sheet?
In your personal experience, have you ever run into a reader who uses a custom style sheet? I personally don’t use one, and haven’t seen any circumstance in which a user style sheet was used.
The Firefox form control updates put a different spin on user style sheets, however. This script doesn’t require that the reader have any working knowledge of CSS, yet a custom style sheet will be applied to all documents after installation. This concept isn’t something that had occurred to me before, but it could be a trend that becomes more common in the future.
There is a moral to this story
What I took home from installing these custom Firefox controls is that user style sheets can have a strong impact on the CSS I author. While some of the applied CSS in this example is overridden by author CSS, there are other selectors that need attention to achieve the look I originally intended. Some of these specific selectors are proprietary, and the thought of having to nullify or correct them wouldn’t normally cross my mind.
Authors have absolutely no control over user styles, and in all honesty, stressing over the possibility of their presence isn’t in our best interest. What’s important to do, however, is be mindful of the possibility that a reader may have a user style sheet for accessibility purposes over aesthetic reasons.
A user style sheet that bumps up the default font size is very important to readers with impaired vision. User style sheets can also be used to improve color contrast by default by forcing a certain
background-color. These things are important to keep in mind, and the best thing we can do is compensate our CSS with a bulletproof design.