Max-width for non-responsive websites

Get Started
1

Im just curious about what is the maximum width you would ever go for a non-responsive fixed width website…

I really like large wide websites but do you think that 1280px is much too wide and going to cause horizontal scrolling?

Im designing a website for a pub at the min, which doesn’t really call for responsive web design so im just wondering if 1280 is too much or should i stick to 1000 as a max-width with a content container width of 980?

2

There will only be hz scrolling if the site is wider than the window (monitor), so really what you are asking is… “what is the most common monitor size, or how wide do most user make their browser windows” Which is an almost ridiculous question.

I would approach the problem from a different angle. How wide is a comfortable-length line of content? The human eye is comfortable with a line length of 30-80 characters… this is ROUGHLY 20-60 ems ( this is off the top off my head I could be off by 10 ems… or so but you get the idea).

So lets say you site uses a 3 column layout; we could AIM TO LIMIT the main content 30ems, and the other columns 9em, with maybe 1em gutters. BTW … I’m picking these numbers because they fit comfortably, but also because it will make the math in this example easier. toy around with the values to what appeals to your client.

So we can then do something like :


.container { width:100%; max-width:50em; margin:0 auto; overflow:hidden;}
.main,.sides{float:left; }
.main{ width:60%; margin:0 2%}
.sides{width:18%}

We would then have a site that the user could easily adjust to to the size of his monitor/ preferred font size.

hope that helps.

3

That’s not true. As monitors get wider the chances increase that the person will have multiple windows open side by side. Windows 7 makes it easy to have two windows exactly filling half the screen width each so that you can see both easily at the same time. This becomes practical once the monitor is 1600pcx or wider as web pages need to be able to fit within 740px for printing.

4

I still use 960 grid even on non-responsive sites. Just to make the grids easier to manage.

5

That’s not true. As monitors get wider the chances increase that the person will have multiple windows open side by side. Windows 7 makes it easy to have two windows exactly filling half the screen width each so that you can see both easily at the same time. This becomes practical once the monitor is 1600pcx or wider as web pages need to be able to fit within 740px for printing.

Stephen, that’s exactly what I was hinting at tho. That it is hard enough to guess at monitor size, let alone if users begin to develop habbit’s in which they have multple windows open,possibly with each window being a different width.