Brisbane WSG Meetings are consolidating into a smaller, but more dedicated group. Still a fair bit of variety of memebrs at each meeting, though.
December 8th saw 14 of us ride the elevators up the ASX building and enjoy the view during the meeting. The view over the river is spectacular – that alone makes it worth attending.
The usual technical chitchat preceded the presentation; there was talk of new apps people were building, the challenges met and overcome. Eventually we locked the doors and banged the gavel.
Scott Barnes gave this month’s presentation, an interesting talk called ‘Now and Zen, a journey into the Fantasy and Reality of CSS’. This was based on the concept that the CSS Zen Garden gives people misleading impressions on how CSS is useful.
A large, dynamic application is a different beast to what a lot of the designers who are popular on the internet seem to be familiar with; it would seem that a lot of them work on small sites which, while they may have to solve tricky layout problems, don’t have to overcome related issues of large systems – reuse and aggregating small pieces into a single system.
Take as an example a page with a small data table in it. This may have a caption, which is to be styled in a certain manner. Assume we have html:

<div class="dataGrid">
<table>
<caption>a caption</caption>
<thead>
...
</table>
</div>

and css:

.dataGrid caption {
...
}

To maintain consistancy of look and feel, headers on other elements may need be styled the same way. This will eventually lead to css as:

.dataGrid caption, .calendar h2, .otherBlock .h2 {
...
}

if we then want to reuse this – eg. someone wants to reuse our calendar block – it is difficult to extract the specific css elements. A superior way to structure this is to add classes to the html:

<div class="dataGrid">
<table>
<caption class="heading">a caption</caption>
<thead>
...
</table>
</div>

and to use css that is far more structured:

.heading {
...
}
.dataGrid .heading {
... // any specifics that apply only to the heading inside dataGrid
}
.calendar .heading {
... // any specifics that apply only to the heading inside calendar
}

Using this sort of structure (styling selectors rather than tags) allows us the freedom to change the HTML implementation without having to change the CSS; this is quite a change from the usual attitude to CSS ‘you can change the look and feel without touching the markup'; here we are saying ‘this method allows you to change the implementation without requiring extra work on the look and feel’!
Clearly, this system, based on using classnames for any markup which is targetted, is more robust than styling the tags directly, because it means that we can extract portions of the system for reuse and because we are less dependant on browser-dependant uses of HTML structure.

I liked this reasoning, it makes sense, but it is implementation dependant – smaller sites which are more static wont see the benefits; Scott was targetting large, dynamic sites.

In additon, Scott discussed breaking CSS up into multiple files.
He proposed breaking it up across functional liines, and within each functional area have two files; one for theme (ie colours and graphic elements) and one for layout.
I’ve been flirting with this concept myself, but havent really had the push of reuse to push me into using it very much.

It was a good meeting, and it was surprising how many people there had worked on porn sites in the early stages of their career. Or maybe it was the beer talking.
Were you there? Maybe you should make the next one?

(The above is my understanding of what Scott was saying; any misunderstandings are my responsibility – feel free to correct me!)