1

Some websites fix the main content (or whole website) width to 980px, others to 1200px. What's the criteria for choosing this size?

  • It's whatever you want it to be. There are no rules around this. Do whatever your design requires. – John Conde May 19 '16 at 0:23
  • @JohnConde I don't expect for rules, bit at least some recommendation. Although it's not hard to believe there's none, as each website will have it's own pattern. – Tom Brito May 19 '16 at 0:44
  • 3
    Actually the best answer is "neither" and have a responsive design. – John Conde May 19 '16 at 0:45
  • 2
    @JohnConde or set only max-width, as a too large line of text would not be pleasurable for reading. – Tom Brito May 19 '16 at 1:49
  • This might answer some of your questions: webmasters.stackexchange.com/questions/1689/… – Tim Malone May 19 '16 at 3:35
1

My recommendation is to base the width on the screen sizes of your visitors. If more of your visitors use screens that are under 1200px wide, go with 980px wide. Even if you have a responsive design, you'll want to know what breakpoints to use so that you have designs that look right at the various screen sizes.

As for how you get this information, most web analytics tools contain this data. For instance, in Google Analytics you can go to Audience -> Technology -> Browser & OS -> Screen Resolution. That gives you a report that looks like this:

Google Analytics screen resolution

If you are working on a new website without existing traffic data to pull, you could also look at global stats that suggest trends, like what you can get from StatCounter's global stats.

1

You can do any of those.

1200px width would probably be the most you would go. There are a lot of frameworks that base their column/page width based on a pixel range (bootstrap - 980px) and that is mainly the reason you see these numbers, but you don't have to stick to that because they do. My recommendation would be to go with what makes your site look best at a maximum width, but no wider than 1200px because it starts to get difficult to maintain the aesthetics.

These days, screens are getting larger and larger, so you shouldn't focus on accommodating screen size, just what looks best for you. Pick a width that looks good for your site and make it fully responsive from there - that is your best bet.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.