How wide should a page width be for a good web design?




When designing a website, a common reoccurring question that arises, is how wide should a page width be for a good web design?  Is there an easy answer to this, sadly there is not.  There is a lot to take into account, and below are listed a few of the essential points to take into consideration. 

Remember the goal of designing any website, is to ensure that it looks good across as many browsers, and screen sizes as possible.  You will not be able to make them all look amazing, but aim high, and the world will be a happier place.

With screen sizes differing on desktop pc’s and laptops.  Possibly the best place to start is by looking at an analytic program to determine who is looking at your site and with what screen. 

Normally, results will look something like this.  Google analytics is probably the program of choice for most designers.

19.96% – 1280 x 800
16.58% – 1024 x 768
16.37% – 1280 x 1024
13.65% – 1680 x 1050
10.07% – 1440 x 900

As you can see, the most common one is 1280 by 800, but as the percentages are so close together, perhaps it is best to adopt a width that will look at least “ok”, on all screens.   The most popular screen size years ago, was 800 x 600, but things, as you can see have changed.  The world of web design is a complex place.  Choosing the right layout for all screens could prove tricky, but worth making the effort.  In short, it is probably the best idea to tailor your screen width to your sites audience.  It will vary from site to sight.

For a technology or web design site, such as Dreamtemplate.com, the chances are that the site will be viewed on high spec monitors, which are a must have for many that work in those industries.  If your site is a charity organisation, or an organisation that has people looking at it from all over the world, there screens could be a much lower spec.  This is all something to think about.

As a web designer, facing the question how wide should a page width be for a good web design, you should take into account browser chrome.  This includes Yahoo toolbars, Google toolbars, history toolbars from the browser, and indeed any toolbar or gadget that is above where the actual design is situated.  This reduces the amount of space to play about with, and leads back into screen sizes, as this is a factor.  This will have to be a consideration in choosing the width of your site.  Do not forget too, that many browsers have open tab browsing, and a status bar to think about as well.  The task bar at the bottom also takes up room on the view port.  All these aspects affect what space you have to play around with.

Many web designers allow 1/6 of the horizontal screen height for browser chrome.  This also allows white space which many believe enhances readability, as well giving plenty of space for the all important design.  So for a browser that works to 1024 x 768, this works out at roughly 900 px. 

It goes without saying that after you have factored in all these elements the design itself, should look good to a user using any screen or any browser.  If you are lucky enough to have or be running a bespoke site, it may be possible not to worry too much about the guy using the ten percentile screen, but if you have one that is pretty regular, it is important that you get the width right, and that the site appears as it should do, or you could drive traffic away.  If you can answer how wide should a page width be for your own web design, the chances are you have a good one.

Share/Save
If you enjoyed this article, please consider sharing it!
Icon Icon Icon

Related Posts


Fatal error: Call to undefined function yarpp_sql() in /home/dream/public_html/blog/wp-content/themes/infralight/single.php on line 81