Average monitor size?
- Started
- Last post
- 15 Responses
- bainbridge
What is the average monitor size you take into account when designing a website? I'm designing one at 980 pixels wide, but am not sure how big it could get.
- chrisRG0
I mainly work with:
480 for mobile
768 for tablet
up to 1150 for desktop
- prophetone0
adaptive css is your friend. look into twitter bootstrap to see stuff.
- jaylarson0
1000px is easier to grid up than 980.
- ETM0
What are we taking into account? A fluid or adaptive layout? Or how you fill the extra space with a fixed 960/980px site on something like a 1920px monitor?
- monNom0
Don't forget to consider browser zoom. Mr. 1920px might have his browser zoomed to 125%.
*brain melts*
- citizen_h0
Back in 2007, a resolution with 1024 x 768 would roughly have a safe area for desktop at 968 x 578. Since Jan 2013 - 90% of users have a browser resolution higher than 1024x768 (http://www.w3schools.com/browse... So my question is do we increase the safe area to now be 1024 x 768? Your thoughts...
- Nathan_Adams0
If you're redoing an existing site, check the stats and see what the average is for people that visit the site. That's much more relevant than an average for everyone.
- citizen_h0
So existing site so starting completely from scratch.
- set0
5.5 inches
- ukit20
I wouldn't rely on that W3schools site. They are a site about web design so it's not going to reflect what the general public uses.
This page offers some sources for more accurate stats:
- Hombre_Lobo0
not sure why you would use 980, as it doesnt split into 8/12/16 columns easily.
if its going to be responsive, you shouldn't design around current popular displays.
Instead you should let your content decide how it is designed. design it small, stretch out the window, when it looks bad, add a media query to better present the content and repeat.
If its not responsive most people stick to 960. although i prefer http://978.gs/ though, prefer the bigger 30px margins.
- doesnotexist0
based on the audience you expect, but easy grid systems are...easy and boring. go responsive, go big. people like to scroll; scroll forever.
- formed0
I think the comment on basing it on content is key. Some sites have generic background images that are fine huge and pixelated, but for many that'd look like crap.
Personally, I hate sites that scale all the way up, unless the content can accommodate (like a grid of images). I am working on a 30" and 24" screens, anything that scales to that looks like total crap. Not all, but most.
Depends on what you are displaying.
- ukit20
You didn't mention responsive design which is the key factor here. If the site is not responsive, then I would say still go for 960-990px or less to be safe, since around 10% of users still use a 1024px screen and another 10% are on smaller screens than that.
If it is responsive, you can look at what some commonly used frameworks do:
Bootstrap uses a width of 970px for 1024px screen, and then scale up to 1170px for larger screens.
The new version of WordPress (twentythirteen theme) scales up to a maximum width of 1080px.
So that gives you an idea but obviously it's somewhat arbitrary and you shouldn't let some exact number limit your design.