What Is The Best Width for Website?
Screen Resolutions
There are so many different monitor resolutions people use while viewing your web pages. The old standard was to build for 800 x 600. But currently most of people use computers/laptops/notebooks with screen resolution higher than 1024 x 786. Of course this varies greatly depending on the audience of the website.
You want to design your website to look good on the biggest percentage of visitor monitors as possible. So how do you find out what the standard resolution is? Look up some statistics! You can find the statistics in many places online. For example, very comprehensive statistic an be found at
http://www.w3schools.com
Screen Resolution
Today, most visitors are using a screen resolution higher than 1024x768 pixels:
|
Date |
Higher |
1024x768 |
800x600 |
640x480 |
Other |
|
January 2012 |
85% |
13% |
1% |
0% |
1% |
|
January 2011 |
85% |
14% |
0% |
0% |
1% |
|
January 2010 |
76% |
20% |
1% |
0% |
3% |
|
January 2009 |
57% |
36% |
4% |
0% |
3% |
|
January 2008 |
38% |
48% |
8% |
0% |
6% |
|
January 2007 |
26% |
54% |
14% |
0% |
6% |
|
January 2006 |
17% |
57% |
20% |
0% |
6% |
|
January 2005 |
12% |
53% |
30% |
0% |
5% |
|
January 2004 |
10% |
47% |
37% |
1% |
5% |
|
January 2003 |
6% |
40% |
47% |
2% |
5% |
|
January 2002 |
6% |
34% |
52% |
3% |
5% |
|
January 2001 |
5% |
29% |
55% |
6% |
5% |
|
January 2000 |
4% |
25% |
56% |
11% |
4% |
So, the standard width you should make the content area of your website is about 1000px wide. As you see from statistic, 85% of users have a higher resolution than 1024px wide, but there are still 15% of people using a 1024px and lower width display. You want to make sure that you leave a little breathing room for your content and you never want to have a bottom scroll bar.
Thus: about 1000px wide is the perfect width for websites today.
Please note: the recommended width of 1000 px recommended for the traditional web surfers who use personal computers, notebooks, laptops. For people with smartphones, iPods, iPads, Androids and other mobile devices we recommend design a separate web site – using the same content but different layout.
Anyway, we will talk about that soon in our new articles. So stay with us!
Similar topics:
Designing horizontal gradient image
Designing vertical gradient background image
Designing gradient images for buttons, sub headers, etc.
Applying horizontal gradient background image to a web page
Applying vertical gradient background image to a web page
Applying gradient background image to a table cell
Gradient background - Photoshop tutorials on softfern.com
How to design your web site
Happy new Year 2012. Part III
Happy new Year 2012. Part II
Happy new Year 2012 from SoftFern.com.
Animated images - new Year 2012
new Year 2012 elements - for graphic designers
new Year 2012 elements. Part II