Since the beginning of web development, programmers have had the duty to guarantee a correct and possibly full user experience to all the web site visitors, regardless the browser that they use.
If we stop for a second and think about the above statement, we can probably understand how that is a very big problem. Allow me a strange similarity: it is as if we need to design a new shoe that fits all sizes. It surely can be done. It involves a lot of work and it won't probably satisfy all the users.
Two methods to solve the problem
Web developers normally use two different approaches in order to face the issue: the first and older one is graceful degradation. A bit newer method is called progressive enhancement.
The two methods are easily confused, but they have a big difference: graceful degradation focuses on browsers capability, while progressive enhancement focuses on content.
There are many documents discussing the two developing methods (and most notably Understanding Progressive Enhancement by Aaron Gustafson) and I don't think I will explain all the concepts here. However I need to bring your attention on one thing. In progressive enhancement, it is quite common the use of multiple stylesheets, giving them a strict structure.
Progressive enhancement and CSS
As an example (taken from the aforementioned article), imagine we have one homepage, named page.html. That page has three related stylesheets: typography.css, layout.css and color.css. That is already an idea: according to the progressive enhancement theory, dividing CSS rules in different stylesheets according to their purposes, simplifies the web developer work (CSS rules creation and especially maintenance).
A second level or group of stylesheets will be linked only to the layout.css stylesheet: screen.css, print.css and mobile.css. Those three new stylesheets will guarantee a correct web site display for different media (screen, print and mobile).
The above structure could be all we need, but in many cases it could be not enough. Thus our stylesheets structure and the relationship between them can became more complex and difficult to maintain.
What I think
I can't say I'm a full supporter of the progressive enhancement method. And that because complex websites will easily have a very complex stylesheet structure. And since progressive enhancement should make things easier for us, I believe we will easily loose that advantage when trying to elaborate the stylesheets structure.
It is clear that there's more behind the progressive enhancement method. But basically the more I read about it, the more I become skeptical about its usefulness.
As an example, consider, for a moment, the above stylesheet structure and let's say we need to change a color rule. It could be that we end up opening and modifying more than one CSS file. In more complex situations, it could lead us to revise five or six files, while without the mentioned stylesheets structure, we might need to change one or two files.
Applying the progressive enhancement theory to media makes more sense to me. Especially today, when we need to satisfy handheld devices users (tablets and smartphones). But again, it seems to me that a strict planning of the CSS structure is needed before starting to develop the web site. During the preliminary work, it is advisable to consider:
- if such a structure is needed,
- if it is useful and it gives us advantages,
- and what are the eventual drawbacks.
I would really like to know your idea on the topic, so please leave a comment.