White Edition

What size do I need to support?

This page is a part of "Actual Browser Sizes"

Finally we can see what sizes we need to design for. E.g. if you want to design for 95% of your visitors you need design for no more than 776x424px (fixed layout) - or between 720x400px to 1408x912px (fluid layouts). You can also see the pixel "gab" when designing fluid layouts - at 95% it is a staggering 688px in width and 512px in height.

Coverage

Sizes to design for

% Fixed Layout Fluid Layout Fluid Gab
75% 1000x576 872x504 - 1256x808 384/304
80% 984x568 864x464 - 1264x848 400/384
85% 912x552 800x448 - 1328x864 528/416
90% 784x432 784x440 - 1344x872 560/432
95% 776x424 720x400 - 1408x912 688/512
100% 568x264 456x232 - 1672x1080 1216/848

See Also

Comments

1

John Fredrickson - Dec. 10, 2006

Why is there a difference between fixed layouts and fluid layouts? And what is "fluid gab"?

2

Thomas Baekdal - Dec. 14, 2006

John,

A fixed layout is on that does not scale to the width/height of the browser - as such it is based on the smallest width/height needed to support the largest amount of people.

Fluid layout is on the other hand flexible, scaling and adjusting to the browser size. In this case the min/max size is based on the average size.

The Gab is the min/max size from this average. in order to support the largest amount of people - more people = large gab.

3

Jason - May. 12, 2007

Hi Thomas,

Thanks for the info here. Can you give us some examples of good fluid designs. From my view, it appears there are websites that have fixed width to house the content for reading, with the asthetics on each side or right side that has color/pattern that accentuates the fixed "content" area.

But if by fluid, you mean that the actual content expands, much like you see with google or search engines..please clarify, or better yet share what you see are great examples of fluid designs.

It's amazing how many people we have to educate on this, as they get more and bigger browsers, but I'm wondering if we need to rethink the whole housing of layout, because I, (like you I think), prefer to keep text at a certain number of characters wide for maximum ease on readability.

Thanks again-- you've been helpful. Best regards, Jason Faber

4

Thomas Baekdal - May. 12, 2007

Jason, Thanks

You can read my follow-up article about that here:

http://www.baekdal.com/articles/Usability/browser-size-design/

5

gr8pixel - Nov. 24, 2007

great article Thomas! :)

 

Published: Oct. 24, 2006
in reports

Subscribe / Select »

Thomas Baekdal

Thomas Baekdal is a Writer, Interaction Designer, Change Advocate and Project Manager.

» About Baekdal
» Contact Information