What browser screenwidth should I design for to support Mac OS?

Question

Most statistics out there for browser stats show you the resolution of the screen.

Thats fine for Windows where browsers typically open full screen and most people leave it as that. So if the browser stats say 1024x768 you just need to subtract a little width for the browser chrome.

On a Mac however browsers typically dont open full screen.

What kind of width is a mac browser likely to be when it opens as such.

I'm thinking of a width of 960 as recommended by what-is-the-best-absolute-width-for-a-webpage. However I'm wondering if this is equally as good width for a mac?

I'm not sure when Apple last made 1280x768 laptops or screens anyway so its probably a non issue. It just frustrates me a little that most places I find statistics on screen resolution dont show you the actual available width.

Answer 1

Design away, my friend. The Apple display packs many pixels.

A window will open to fullscreen on the Mac, no problem. It simply conserves space when it can, unlike the PC behavior, which will fill the screen regardless of how much space the site actually needs.

In other words, the case where the Mac doesn't open the window fullscreen is the case where the user has room to spare. So those are cases you don't need to worry about. If a Mac OS browser has to go fullscreen to fit the site, it will. But when the site is only 960px and the user has a gorgeous 2560x1600 cinema display, it will stop at 960, enough to eliminate the horizontal scrollbars.

The reason people notice this behavior is because apple displays are often too big, so the fullscreen is often not needed. The smallest display Apple ships on any notebook is a roomy 1280x800. The smallest iMac is already 1680x1050. They only get bigger from there.

As far as choosing your dimensions, the normal considerations apply. Play to your lowest common denominator. Simply know that the screen resolution of even a modest apple display will be on par with the industry standard. If you're willing to go 990 or 960 for the PC, it will also be acceptable for the Mac.

_{(source: akamai.net)}

Most of the designers I work with are more concerned with making designs too narrow for Apple users. They design in the 960 pixel realm so that it works for the larger audience, and then they try to find creative ways of showing a little extra love to the owners of that giant cinema display.

Sidenote: @Taylor Marshall asks a good question: "What if the widths are all set to 100%? How big does [the browser window] get..?"

Without any constraints, Firefox will simply go fullscreen, like the MS Windows behavior. Safari will expand up to a width of 800px, unless the width is already greater than 800, in which case it maintains that width and only modifies the window height. Of course, if there aren't any hard width values, then the design is a liquid layout, so the concern about designing for a particular width is somewhat altered. Usually good liquid layouts, despite being displayed correctly at any dimension, are nonetheless designed to be viewed at reasonable window widths.

Answer 2

Instead of fretting about absolute widths, why not do percentages, and give it a min-width so that it doesn't start to look too terribly bad at lower resolutions?

The min-width could be where your 960 or 990 comes into play.

Answer 3

The stats you've read are based on actual screen sizes of visitors. If you're looking for stats on what size the average user's browser is at, you'll need to look elsewhere. Also I never browse full screen on windows or mac OS, and I consider a design that's wider than 960px or so to be very annoying. (it's 2^16+2^17+2^18+2^19)

I'm feeling lucky for browser size. See the second chart.