Website - Display Size impact on design

<p>What screen display size should you generally design for now ?</p>

<p>I had set a template up on mine with a central main section of approx 900px wide so that it was viewable on a 1024px display. There is a degree of 'scaleability' that I could introduce but I prefer to stick with a specific width for the main area to have greater control over the setup.<br />Obviously this looks a little small on a larger monitor / display setup.</p>

<p>What sort of impact has mobile / ipad browsing had on webpage display widths ?</p>

<p>Should I stick with the 900px width ?</p>

<p>Thanks for any advice</p>

<p>You ask the right question BEFORE design your site. Some suggestions:</p>

<p>- Be careful with the terminology: monitor size/resolution, display ppi, browser window size, viewport size.</p>

<p>- Beware of the trend and statistics:<br>

http://www.w3schools.com/browsers/browsers_display.asp</p>

<p>- Decide which of your site's target viewers are most important to you. And design your site accordingly.</p>

<p>- BEFORE launching your site, test it on different platforms, browsers, resolutions, window sizes, etc. The tools/sites referenced here can be great help:<br>

http://www.luminous-landscape.com/forum/index.php?topic=41252</p>

<p> </p>

<p>Thanks for those links Robert - very useful - Just going to do a little reading from those before going to far in the sketch design stage.</p>

<p>You can code the site using CSS so that it will fit different size screens.<br>

If you look at your web stats package after a month or so you will be able to see what size monitors your websites users have and make alts if required.</p>

<p>CSS alone (even given the power of CSS3) will not allow you to fool proof the design for different sizes. More than likely, your person with the lower resolution monitor will also be the person running IE6 or IE7, both of which will not support any CSS3 commands. In fact, even IE8 won't support most of them. Your better bet is to do a javascript/CSS combo to implement different stylesheets based off of browser width. Or just build your design liquid enough that it can handle the browser sizes. Or just say that 90% of your target market is slightly up to date and can use a site designed for 1000px wide, or less.</p>

<p>And don't even get me started about considerations for mobile.</p>

<p>All that said, I would say that a 1000px max is pretty acceptable for a website designed to be viewed by laptop and desktop computers. You will need thinner for an iPad (I think, have to double check it's resolution) and smart phones. Also take in to consideration that touch devices need a different interface design than mouse based interfaces.</p>

<p>Thanks Zach,</p>

<p>I've been looking for stats on % browsers using ipad - but can't find anything - I guess that for the moment the % is pretty low to the point of being insignificant, but I'm not sure how things will change.</p>

<p>From what I gather the display is 1024 x 768 - so a limit of 1000px would seem to be a reasonable starting point.</p>

<p>I'm coding in HTML / Dreamweaver for the first time in years - exploring the flexibility of DIVs over the way I have worked in the past (using tables).</p>

<p>Thanks for the replies</p>

<p>Actually, on one of the sites I manage, iPad viewers were at 7,000+ for the month of January, just barely being edged out by Android for the mobile platforms. iPhones were at 5k. Of course, there was a change in this, for other sites, but i would say that iPad viewership should be considered at the same level as all other mobile devices.</p>