New Perspectives On Web Design

(C. Jardin) #1

CHAPTER 1 Modern CSS Architecture and Front-End Development


<a href="#" class="big-red-button-with-white-text">Foo</a>

It’s just pretty poorly named. The separation of content and style is about
separating content and styling languages, not their locations.
By understanding this, you begin to see that this misconception has led
to a blanket and dogmatic hatred of any form of presentational classes. Just
because classes might read as presentational does not equate to mixing
content and style; in fact it comes back around to our points above: it’s all
about how sensibly you’re doing things.
A snippet of HTML like <div class="red"> ... </div> has perfectly
decoupled content and style, it’s just not very sensible.

Takeaway: We’ve still got a couple of misconceptions surrounding CSS. Rec-
ognizing and dropping them is very liberating and opens up the possibili-
ties to build better front-ends.

A Change in Attitude
By now, we should find ourselves in a frame of mind better equipped for
building more powerful, pragmatic front-ends.
If we accept that the Web is a much more serious environment than
it was ten years ago, and if we accept that the code we write has to serve a
number of different people in a number of different ways, then I don’t think
it’s too much to assume that we also accept that we need a change in attitude.
As Nicole Sullivan once said, “Our (CSS) best practices are killing us^7 ”;
our desire to write markup that doesn’t use any classes serves no one, and
often causes ourselves problems.
The pursuit of clean markup and semantic classes and all that came
with it was well-intentioned but helped no one. It led to verbose, diffi-
cult to maintain, tangled style sheets. The price of omitting a few classes

7 Nicole Sullivan, “Our (CSS) Best Practices Are Killing Us”, (April 28, 2011).
http://www.stubbornella.org/content/2011/04/28/ our-best-practices-are-killing-us/
Free download pdf