Forum Moderators: open

Message Too Old, No Replies

different monitor sizes & px

         

Makaveli2007

8:00 am on Oct 13, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



If I'm using pixels and it looks great on my monitor in all browsers I can test, could it still mean that it looks horrible on a lot of different monitors? I dont know the exact values, but say my monitor has 1000 pixels from left to right and I create the site (using px for sizes at times), could this cause major problems if another monitor only has 800 pixels for example? Or do all (most) monitors have the same number of them?

thanks!

tedster

8:29 am on Oct 13, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What matters most is the size of the open window, not the total size of the screen. It you're worried about smaller windows, you can run your browser at less than full screen and see the results. In fact, Opera has a native choice to who the size of the window in the upper left of the screen eliminating any guesswork.

When it comes to 800 px width monitors, they are really going the way of the dinosaur. The last time I ran a signifiacnt test, 800x600 was just over 1% of traffic.

Makaveli2007

9:09 am on Oct 13, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



thanks!

When I used the example of 1000 pixels and 800 pixels monitors I was really just making a random guess. What i'm wondering is: Don't many monitors (Maybe display resolutions is the right expression in English?) have different numbers of pixels on them? If so wouldn't that mean that if I designed a website using "px" as unit for my CSS boxes, my site would probably look totally wrong on any monitor that has a different number of pixels?

For example, say my monitor has 950 pixels from left to right (I have no idea how many it has, just guessing!:)) and I create 3 div boxes from left to right. All of them have the width 300px (and a margin-right of 17 or so). On my monitor it would look like a decent lay-out..and hopefully on that of everybody else who has a monitor with 950 pixels from left to right (or more pixels). But what if somebody whose monitor only has 890 pixels from left to right tried to view it? Wouldn't that mean he'd only see 2 div-boxes and the third div-box would be placed below it? (Or would a scrollbar appear?)

I didnt even consider window size! But is that a big problem in the first place? Doesn't the scroll bar make sure there's always the same number of pixels (even if you cant see all of it)?

phranque

12:21 pm on Oct 13, 2008 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



(Or would a scrollbar appear?)

you would see the scrollbar, but you would want to design your site so that significant content can be seen without scrolling while using "typical" window sizes.
these typical window sizes should be based on the most common screen resolutions of your visitors.
if you have a lot of visitors with laptops, 1024x768 should be the lowest screen resolution you will typically see so you should optimize for that.
if you have significant seniors visiting you might see a lot of 800x600.

badbadmonkey

10:27 am on Oct 19, 2008 (gmt 0)

10+ Year Member



When it comes to 800 px width monitors, they are really going the way of the dinosaur. The last time I ran a signifiacnt test, 800x600 was just over 1% of traffic.

Heh, until handheld and mobile net access becomes more prevalent, what with wireless broadband etc - then the lowest common denominator is quickly gonna drop down to 640px again! - A no-man's land between low res phone screens and "normal" monitors, where mobile browsers like Opera probably won't bother re-styling the page...?

-

Resolution: TheCounter averages would indicate that 800x600 is still in use enough to justify consideration:
[thecounter.com...]
You don't want to ruin your pages for 7 in every 100 visitors, I'd guess.

Makaveli, in general I would recommend the use of no "width" specification - you could have a "max-width" attribute to deal with the opposite extreme (do you want your content spread out at 100% width on a 30" monitor @ 2560px wide?), but otherwise just let the content fill the screen as the browser wants. For specific elements on the page, like your three pictures, try not to have anything that can't be properly displayed at 800px or less.

Makaveli2007

10:43 am on Oct 19, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I have no pictures on the page, I meant to say I have three div-boxes (or well actually, just two :-)). Thanks for the replies anyone!