MikePadgett.com

Three cheers for (mostly) semantic markup!

Today was a classic British autumn day: unpredictable rain showers, short periods of pale sun and cold winds. In honour of that and the general decline in our nation’s weather, I decided to reskin the Blog for winter!

Lest it should catch a cold, I’ve decked the Blog in a lovely Norwegian wool jumper that should keep out even the most biting gusts.

Now there’s only J and I that still need to keep warm: atchoo!

Little by little, I’m being dragged into the 21st century (no coincidence that my boss’ name is Little) of CSS.

Bronwen Hodgkinson’s beautiful “Kelmscott” design at csszengarden.com

I’ve been doing CSS layouts for a while now, but on densely packed eCommerce sites, it’s never easy, particularly when you’re up against an audience used to three column layouts with header and footer.

Now it’s not the three columns or the header that are the problem of course. It’s the footer. Back in the day (only a few months ago for me in the build now care later world of digital agencies) we used to employ the DOMbuster 100% height table, which with a bit of tweaking you could even get working nicely on NN / Mozilla browsers.

In terms of annoyance, getting the CSS footer to sit at the bottom on shorter content pages without being broken by the column height spill (content frequently goes right under the footer and beyond!)ranks up there withmanaging form elements when they overlap with show/hide divs such as popup menus.

There are lots of possible solutions suggested. Some even work, butfew stand up to the constraints you start to add when adapting them.

Suzy Campbell writes that she won’t bedevelopingher three columnsolution any further as she thinks that CSS offers us other far more interesting opportunities outside of the (tabular) precedents we have.

I wholeheartedly agree. Why are we bothering totry tofind old solutions to new problems? Even a cursory look around shows us new ideas that focus on design rather than hacking (as it should be) and all with the cleanest semantic markup.

The code can be as beautiful as the design. All we need is for some of the browsers to catch up and make good design matter most.

Indeed.