Web Log Costa Blanca

You can see that once again I am being assertive. Why design for just this one monitor resolution? And, accepting my rule 1, exactly what fixed width ‘page’ does this imply?

The facts of monitor resolution are worth being aware of. In the year since I last analysed the statistics of visits to my small personal site, the variety of monitor resolutions has increased. There isn’t space here to list them. Look simply at the last 10 visits I received: 4 visitors had monitors set to 1024×768, 2 had monitors set to 1280×1024. The other 4 had monitors set to 1120×840, 1280×800, 1440×900, and 1680×1050 (1 each).

Apart from the variety, there are two things that can be learned even from this small example (and they are borne out by the total statistics). All of the visitors had monitors set to at least a width of 1024 pixels (most had more). And there isn’t one visitor with a monitor set to 800×600 (which some backward-looking people think we should still take as the norm).

(more…)

I can imagine your response. Isn’t this a bit arbitrary? Might we not restrict our creativity this way? Hasn’t there been a long debate in the Web design community about the merits of fixed and fluid designs—and isn’t it still an open question?

Yes, yes, and yes. All the same, this is the first rule of website design. It’s the first rule because it’s where we start, the first decision we have to make. (Can we change our minds later, when the design is under way? Of course. There’s lots of natural reiteration in the design process. This affects that, that affects this. We adjust and move on.)

It’s not a rule I used to follow myself. I wanted to use as much of every visitor’s screen as possible. If you read my own contribution to the “fixed/fluid’ debate, an article on the implications of varying monitor resolutions, which I wrote about a year ago, you will see that I ended by throwing my hands up in despair.

But for the last nine months or so, I have found the rule not only useful, but creatively liberating. So here it is again:

1. Use a fixed-width layout

By now, you may have worked out what I mean by a ‘rule.’ A rule is a bit of advice that you should always follow—unless, in the particular case, you know better. A rule should never be broken unknowingly. It is worth knowing, and worth remembering.

At the end of the day, what matters is the visual clarity and power of your site. If you can see how breaking a rule will add to a new site’s effectiveness, go ahead and break it. If you can’t (yet) see this, follow the rule absolutely.

With a fixed width to work with, like the width of a CD cover or a magazine page, you can place your design elements with loving care—adjusting the alignment here, adding or subtracting whitespace there. Life is suddenly easy and fun.

So, use a fixed-width layout. But what width, exactly? That will be the subject of Rule number 2. Coming soon.