Comments on: Thoroughly skippable: CSS blogwank rant (with bonus Mozilla bug tip)

By: paul mison

paul mison — Fri, 05 Dec 2003 01:12:11 +0000

Since this article, I’ve run into a couple of other blogs who’ve adopted plasticbag.org-esque designs, notably Mark Pilgrim, who knows (but apparently doesn’t care) that it’s unreadable at small browser widths.
Sadly Pilgrim doesn’t even provide full-entry RSS feeds. I may have to start screenscraping the bastards.

By: Michael Williams

Michael Williams — Wed, 10 Sep 2003 18:35:35 +0000

What’s wrong with that is precisely that is a fixed width. Using a max-width ensures readability for your typical Windows user, with their maximised browser, but avoids horizontal scrollbars for people who have their browser taking up only half the horizontal space of their screen (á la typical Mac/$X_WINDOW_MANAGER user).

By: rjp

rjp — Tue, 09 Sep 2003 16:50:04 +0000

What’s wrong with “width=40em” or whatever? That’s fixed width but scales with font changes.

By: Paul Watson

Paul Watson — Thu, 04 Sep 2003 21:59:05 +0000

Wow, awesome. Thanks MW.

By: Yoz

Yoz — Thu, 04 Sep 2003 20:51:22 +0000

Cor, thanks, Michael! I’ll apply that to my stylesheet shortly.

By: Michael Williams

Michael Williams — Thu, 04 Sep 2003 20:39:38 +0000

And the link to that hacky workaround is http://www.svendtofte.com/code/max_width_in_ie/

By: Michael Williams

Michael Williams — Thu, 04 Sep 2003 20:38:04 +0000

An upper width setting exists: max-width. It’s supported by the major graphical browsers, with the really major exception of IE (up to and inclusive of IE6). There’s a hacky workaround which uses max-width for browsers which support it, and feeds IE a bit of Javascript in the CSS

By: Paul Watson

Paul Watson — Thu, 04 Sep 2003 19:34:18 +0000

Very quickly; You have heard this arguement a billion times but it bears hitting with the legs of table until it bleeds and everyone has it fixed in their heads:
Crikey it is hard to read all this text when I have my browser in full-screen. My eyes go from left to right like a cartoon character eating corn off the cob. I have to un-maximise my browser and fiddle with the width until I get it down to about 400px so that I can track properly from line to line.
What would be really nice is an upper-limit width setting in CSS. Then you get the fluid nice to-crappy-old-small-screens-and-mobile-rubbish as well as stopping the paragraphs from becoming miles wide on bigger better screens.
my 2 cents, and good post over all (yours, not mine I mean)

By: Tom Coates

Tom Coates — Thu, 04 Sep 2003 14:50:38 +0000

Thanks Yoz! I’ll implement that as soon as I get a moment. In the meantime, can I just take issue with a couple of minor things. You say, “Even so, I have to question any text-heavy site design that kills basic readability for many users in favour of a styling trick that only works for some others.” You use a rhetoric of many vs. some when in fact I could just as easily say (and in fact did), that it would kill basic readability for a small fraction of users in favour of a preliminary attempt at styling something in quite a likely-to-be-wanted-way using CSS that works for the vast majority. It’s important that we acknowledge that CSS isn’t going to become a standard way of building things if we can’t find ways to undertake simple pieces of design – that all designers will want to accomplish at some time or another – like centring fixed width blocks. Sites like mine are trying to find a way to do that – unfortunately without an unlimited amount of time to do so.
As to tables vs. CSS positioning – you’re making a typical absolutist distinction between tables and CSS without any regard for incremental changes or improvements. By using CSS I’ve made that site considerably lighter than if I was using Tables, and I’ve also (for the most part) used styled paragraphs, lists and divs to separate up chunks of content in a mostly logical fashion. It’s not entirely semantic in the sense that I haven’t yet done stuff like put the titles in as H1s or H2s, but again I don’t have all the time in the world and – to be honest – quite a lot of that stuff would be a relatively simple fix if someone else wanted to do it. This is not me claiming that it’s shiny and brilliant and awesome, simply that it has benefits over tables even in a not-quite validating, not-quite semantic enough, bit of a rough-place-to-try-and-work-things-through way.
Finally, as to the “fixed widths and shit” – I really think you’re just going to have to get over that one. I haven’t worked on a single commercial site in the last four years that wasn’t fixed width, including UpMyStreet which had celebrated and much-vaunted accessibility and standards-compliance as one of its main objectives. That’s not to say that they’re not all wrong, of course – but it is to say that if they thought there was a substantial problem associated with doing it in terms of people being able to read the things, then they wouldn’t do it. The uncomfortable truth of the world of the web is that at the moment for the most part, we do know what kind of screen resolution and text sizes people are likely to have, and that a good designer should be keeping that in mind throughout the process – ideally finding ways in which good typographic line-lengths will be seen by as many people as possible – enhancing readability and quick-parsing of information. As long as we design in ways that mean that they degrade relatively gracefully when people use them in non-average ways, that’s ok with me. Now, plasticbag.org doesn’t degrade well in many ways – a horizontal rule bar at the bottom would be my preference for the 2% of people using browsers below 800×600 or who choose to not have their browsers anywhere near full-screen – but that’s because I couldn’t find a better way at the time, because it’s a place for me to learn and experiment, not because I don’t care about it. I actually really don’t think that full screen width sites are the best design strategy most of the time, because they make sites completely unparseable for normal human beings who DON’T change their browser window size simply in order to be able to read certain individual sites (which after all is what they’d have to do to be able to get a recommended number of words per line that a human can read and follow – AND PRECISELY WHAT YOU’RE NOT PREPARED TO DO WHEN YOU COME TO MY SITE).