Responsive websites are here to stay, but why do they always have a max-width of 960px? Isn’t that SO 2009?! Should we get away from the 960 standard width in lieu of a max-width of more like 1140px? The answer is nerdy, but interesting for you math lovers.
Today, the most common maximum screen resolution is 1024px wide. Most web designers don’t want the site to be 100% fluid. That is, they don’t want to design for ALL widths – just a handful. Also, it’s nice to have a little window “chrome”, or dead space that lies outside of the website body for things like backgrounds and fixed-position goodies.
Perhaps the most important reason we typically design for 960px max-width is mathematical. You see, 960 (as a number) has a lot of factors (28, to be exact).
1 2 3 4 5 6 8 10 12 15 16 20 24 30 32 40 48 60 64 80 96 120 160 192 240 320 480 960All these numbers evenly divide into 960. So a max-width of 960px has more layout options, such as 16 equally-wide columns. If we round 960 to 1000, you’ll see it has far fewer factors (16).
1 2 4 5 8 10 20 25 40 50 100 125 200 250 500 1000 Even though we have 40 more pixels to work with, our options for equal-width columns are greatly diminished.
Before you think the internet will forever be a world 960px wide, there ARE times we’ll develop a site to be responsive up to 1140px for those with enormous, wide screen monitors (like me). We’ve even been known to do sites that are 100% fluid (no fixed pixel widths at all). The determining factor, for JDM, is how the site will be used and what sorts of layouts we’ll need. If the site is supposed to be simple (no more than 4 columns – ever), we’ll design to these wider specs. Often, it proves just to be more trouble than it’s worth.
So there you go. It’s 960 because it’s just one of those magic numbers with a lot of factors. It’s likely to remain the standard until the most common screen resolution is much, much greater. For now, it’s proof to grade school math students that factors ARE actually good for something. :)