Like the title says why do most designers suggest 950px width? Is this just a web standard that is commonly used. Generally whats size layouts is everyone using?
y’know I remember you writing that in another thread and it seemed logical after I followed up with some more reading. I should have remembered that.
I don’t want to be a pain here, and I agree with you Stephan that a fluid width is so much more flexible. But to say that the standard recommendation by professional designers is to use a fluid width goes a bit to far! Are there any numbers of this? I know a lot of designers, some of them, not just professional, but very professional and for certain designs they still use a fixed width
A maximum width set in em is probably the most appropriate. A column of text can be around 30 to 35 em wide (depending on how much space there is between lines of text) before making it wider starts to impair the readability.
NO IT DOESN’T
Screen size has NOTHING to do with browser viewport size (apart from mobile devices where the screen size is so small that you must use the entire screen for the one task).
Place two windows next to one another and you will soon find that your 950px layout has a huge horizontal scroll or use dual monitors with the window spanning both and you have a huge amount of empty space with the content hugging the border between the browsers where its hardest to read.
Also with a 950px fixed width for display you MUST have an alternate 748px or smaller layout for print - so why not set up a flexible layout that spans both widths and more.
When I find web pages that are stupidly that wide just about the first thing I do is hit the back button to look for a properly designed alternative site. (My monitor is set to 1280px width and my browser is set to 900px width leaving the rest of the space so I can monitor emails)
Only newbies get screen resolution and browser width confused (same as confusing chalk and cheese).
as far as screen resolutions go, these statistics might shed some light. I know after seeing these I’m definitely going to be testing in much smaller resolutions as i current work in 1080p.
http://www.w3counter.com/globalstats.php
http://www.w3schools.com/browsers/browsers_display.asp
Just a quick note on this: I think liquid layouts do have their limits, if you have a huge screen you shouldn’t keep to 100% otherwise the readability will significantly decrease as people will be seeing their content smeared and diluted across a large space (like a puddle of water). This is where min/max-width and CSS3 media queries (as used for iPhone friendly designs) are becoming an essential factor - you can span your sites layout to match the visible regions of the viewport.
I’ve had the same debate with a few users here regarding this topic.
I’ve taken what Alex had shown me in another thread and integrated into a 96% centered width with a max width of 1280px or 1440px, depending on content.
That way it is still legible if the user decides to widen their screen without a paragraph of text displaying on a single line and can easily adjust to view the full width of the page onscreen.
Designing a fluid or elastic width site is just as easy as doing fixed width and doesn’t create problems for you of having your visitors seeing a horizontal scrollbar (which will result in many of them leaving your site - which is your problem for not designing the site to cater for those visitors). Of course if you don’t want all those visitors then by all means design a site that is not so easy for them to use so as to encourage them to leave.
The “standard” (recommendation by professional designers) is to use a fluid width that adjusts itself to fit the browser with the alternative choice being an elastic width that adjusts itself based on your visitor’s selected font size. The “standards” recommend avoiding fixed width completely and so no particular fixed width can be considered to be the “standard”.
Having a really wide screen resolution and having only the one program open on it at a time is like a bicycle. Having multiple windows open side by side on your wide screen is the farrari. You have it backwards. I agree with your comment about the stupidity of using your computer like a bicycle instead of a Farrari though - that’s why I generally have at least two windows open side by side at once (and would have more if my screen were any wider).
Anyway you appear to be saying that you expect everyone to use their computer your way since designing for 950px forces everyone who wants to visit your page to have their browser open that wide. It is by making your width flexible that you actually provide choice. I am not saying everyone should do things my way, I am saying you shouldn’t FORCE everyone to do it your way. Professional web designers realise that every one of their visitors will make their own choices and will cater for as much flexibility as possible. Only newbies say my way or nothing and so end up with close to nothing.
Screen resolution has almost nothing whatsoever to do with web page width. My screen is way wider than 1024 but a page 950 wide always shows a horizontal scroll because my browser isn’t open that wide.
I’m with Felgall on this. I run 1360 monitor width, but my browser width varies and I ALWAYS have my bookmarks open in the side. I never, ever, ever view a site at my full width as a result. If I ever have to scroll sideways I just leave (there are limits, if my viewport is like down to like 800X600 I maximize my browser then decide…)
No real reason not to layout fluid, it’s actually MUCH easier than it may sound.
To the OP, I do small fixed width areas where I can’t avoid it, and fluid the rest. Like fixed sidebars and fluid content, header and footer.
If you fix your width, you’re fixing your audience too. Better to be all slick and fluid from the get go, device browsing will only get more prevalent.
do u have an example of this. i visual would really help.
There are common reasons, with two I’ll state, the first one being the main reason for the practice:
- 1024px resolutions are losing standard, but have been standard for years, so it was expected to design around them. If you design a design’s width to be 1000px wide max, then you won’t have a horizontal scroll on 1024px + resolutions. It’s all about the majority of resolutions being used (normally depending on the monitor itself), which 1024px is very common, or at least was.
- Viewer comfort, user experience. Something too wide can cause discomfort in reading, depending on resolution size. Like this forum, with a 1680px wide resolution and the browser window at maximized view, it’s hard for people to read past 500px before a line break (or some other type of barrier). While people can do so, it’s a psychological strain that causes discomfort, even if just a little. So to increase attention and ease of use (and expose more to the user), it’s good to size your content down, but it does depend on the design and purpose.
Up until the recent explosion of mobile devices, the smallest screen width that still had a significant market share was 1024px. (800x600 is pretty much dead). Once you account for browser and OS chrome, that leaves you with around 950-980 to play with. 960 divides easily into a grid (you can divide evenly by 15,20,30,40), so I figure that’s why it’s most frequently used (I see more 960s than 950s out there).
not a stat. i guess a number that i keep running across. i agree with the fluid sites. i just dont posess the ability to do so (still learning). hopefully ill figure it out soon.
just trying to see what size layout is the most accepted for static layouts as far as banner, site map, footer, etc go.
Because technically 950px is much easier to grasp than 59em or any other relative width.
Ems are certainly more flexible. A popular combination is to have a wrapper width set in ems with floated columns inside that with % widths. Then the columns narrow down if the browser window is narrow, and the whole design scales nicely if font size is increased.
thank you for all the feedback. it was very helpful. going to be doing a little more research on the matter. still learning. i am i right in thinking that i should be more concerend about em the px width?
But do they? Is that an actual statistic? Many sites I see these days are at least 1000px wide, or they are fluid and move with the viewport. Stats show that a lot of people now have monitors at least 1060px wide, but many are wider, of course. But mobiles are on the rise, and they are quite small, so ideally, design a site to be flexible enough for all environments.