Now, without going into the wrongs and rights of it all, most of my websites follow a familiar theme of being a set width. This blog, even though it’s WordPress, is, as is BMTG and Copy+.

This width is designed to fit on the width of what I deem to be the smallest screen that a reasonable number of people are using (on PC’s – not going into mobile phone handsets and the such). That size, in my belief, is 800×600 (according to Google Analytics this was the 5th most popular resolution used by visitors to the BMTG site)- the initial Asus PC’s, which sold so well this year, were exactly that.

However, the width I’ve been using has been very much a “finger in the air” affair – so much so, that the appearance of a vertical toolbar causes the horizontal one to appear in some cases. Yep, I got it wrong.

I’ve therefore, recently, been doing some research – I wrote a JavaScript program to display the current browser size, and display a horizontal bar in varying lengths. This allowed me to work out how much “real estate” the browser was using up – e.g. launch IE7 and it takes up 21 pixels horizontally. That means whatever your screen size is set to, the web page will 21 less to play this. In fact, IE7 was the worst offender (along with IE6), so that’s become the benchmark – 779 pixels (IE does something that the other browsers don’t – it has a permanent horizontal scrollbar. So whether it’s needed or not, it’s there using up the same amount of space all the time).

Firefox uses 17 pixels and Opera, well, god only knows – I got strange results. Without a vertical scrollbar, it took up (strangely) 1 pixel horizontally. However, introduce the scrollbar and it took up – the same. It would allow my image to be 799 pixels wide and not bat an eyelid. Make it 800 though and the scrollbar appeared. Why this happened I honestly don’t understand. But I’ve tried a 779 wide page and that works, so Opera is certainly not using up more than the “magic” 21 pixels.

Konqueror uses 19 pixels and Safari (on Windows) is the slimmest at just 15 pixels.

The Copy+ site has already been converted to this new width, and the BMTG site will be soon too.