A

Anonymous

Answered

What is the standard size for website??

Forum|Forum|16 years ago
July 25, 2009
6 replies
216295 views

What is the standard size for a website? height x width

I would like to create a website that is a good width, and have the leangth expand as needed depending on the content, which might expand in the future...

Some sizes I have worked with in the past have been 760x360 (pixels) and 800x600 (height x width), yet this was awhile ago..

How to

This topic has been closed for replies.

Correct answer Nadia-P

As David says, it all depends on your viewing audience.

Have a look at the stats for the site (if you have any at this point). What type of people are going to be viewing the site. If it's a more technical audience, then they probably have pretty wide monitors, but it's a 'mom & pop' type site, then they may still be using small monitors.

These days I've gone from 780 width (for 800px wide window size) to 980px width to cater for at least 1024 window size. As for height, don't declare a height at all. This will allow the content to expand vertically as needed regardless of window size.

--

Nadia

Adobe® Community Expert : Dreamweaver

Unique CSS Templates |Tutorials |SEO Articles

http://www.DreamweaverResources.com

http://csstemplates.com.au/

--------------------------------------------------

http://twitter.com/nadiap

S

Scooby007

Participating Frequently

There's definitely a standard for fixed-width or max-width sites, around 960 +/- 20px

look at almost all major sites, cnn, b&h, cnet, bbc, etc. etc they're all close to that

https://addons.mozilla.org/en-us/firefox/addon/measureit/

C_F_McBlob

Inspiring

"There's definitely a standard for fixed-width or max-width sites, around 960 +/- 20px"

No... that's NOT a standard. It's a common choice.

A standard is like a mandate. CD's are made to a standard size. Paper is made to a standard (regular 8.5X11 or legal 8.5X14) size. Nuts, bolts, screws and nails are made to standard sizes. That's so that they work in the application(s) they were intended to, be it a CD/DVD player/recorder, a printer, or an automobile (or whatever).

There is NO SUCH THING as a webpage width standard so they all fit into the internet. For a very long time (in computer time), the vast majority of viewports were CRT 13" (1024X768) monitors. Most of the "major" websites were designed to fit that viewport. Others followed suit and many who design sites today choose to follow suit, because it makes sense. Not everyone has a 24" wide screen on their desk.

S

Scooby007

Participating Frequently

Final salvo for the peeing match. (at least that I'll deliver)

Webster's defines a standard as "something set up and established by authority as a rule for the measure of quantity, weight, extent, value, or quality".

It also says "something established by authority, custom, or general consent as a model or example" but then follows it up with "criterion <quite slow by today's standards>"

If everyone at Starbucks one morning gets a 24oz latté with vanilla mocha creamer and no lid..... IT'S NOT A STANDARD. IT doesn't mean that everyone from then on MUST get a 24oz latté with vanilla mocha creamer and no lid.

That's the difference between a standard, and a common choice.

Windows 7 MUST have at least 256mb of RAM to function at the most basic level. THAT'S a standard.

Adobe Premiere Pro CS5 MUST have a 64bit operating system in order to install. THAT'S a standard.

Photoshop MUST have a minimum 1024 X 768 resolution monitor or it WON'T function. THAT'S a standard.

In order to become a commissioned officer in the military you MUST have a college degree. THAT'S a standard.

Websites come in all shapes and sizes. There is no standard except by some people's obscure definition of the word.

the spirit and substance of the OPs question was - I'm making a site, what's the standard width these days. The best gauge for this is what is pretty much every major website on Earth doing. and that is 960px +/- 20px. I think anything else is semantics and beside the point, but whatever. I think if people are going to tell him there is no standard, you can make it 700 or even 1200 (not saying that has necessarily been the case here so far), that's really bad advice in the context of his question

L

LarryWard

Participant

As people are noting, there is no 'standard'. I like to go with 960 pixels wide. Height is not as important. Just make sure you have some valid content viable for someone with a 1024x768 screen. So, be careful not to make your header overly big.

Zabeth69

Participating Frequently

Know your audience. If everyone is using old computers, the monitors might be 15". If everyone is a digital designer, the monitors might be 22" or more.

If you want a scan of how many of what size monitor is still in use, take a look at http://www.w3schools.com/browsers/default.asp where you can find statistics on displays as well as on who is using which browser.

You might consider making your file look great in a smaller monitor but stretch (through liquid CSS design) to fill larger monitors, or to float and center on any monitor. Or use Adobe Spry widgets to make an "Ajax" layout that appears to change only the data/content area and not the whole screen (accordions, sliding panels, spry data objects, etc.)

Test your site on as many different configurations as you can get hold of.

If you are working in Dreamweaver, set your Window to Cascade files. Then you can read off the size of the window in the right end of the tag selector bar. Adjust the window manually to the size you want to work toward, and you have an on-the-job reference for what fits and what doesn't.

Viewport size is one of the ongoing challenges of design that can't be nailed down...

Beth

A

Anonymous

Thank you all, for all the great responses!

I feel like a human spunge because I want to learn as much as I can..

I am still in the creative process, I am designing two pages (in photoshop) that will be used as templates for a website..

I went with 960 pixels for the width of the site, and I am leaning towards keeping it liquid..

I guess I will cross that bridge when I get to it..

I have either read the articles (Dave) or saved your link for future use (Mark).

I appreciate the feedback people!!

Nadia-P

Inspiring

This is a good article to bookmark as well if you're going the liquid layout route:

Liquid layouts the easy way

http://www.maxdesign.com.au/presentation/liquid/

and from w3org:

http://www.w3.org/TR/WCAG20-CSS-TECHS/G146.html

Good luck and I like the fact you want to keep learning - keep at it and you'll get there :-)

---

Nadia

Adobe® Community Expert : Dreamweaver

Unique CSS Templates |Tutorials |SEO Articles

http://www.DreamweaverResources.com

http://csstemplates.com.au/

--------------------------------------------------

http://twitter.com/nadiap

Nadia-PCorrect answer

Inspiring

As David says, it all depends on your viewing audience.

Have a look at the stats for the site (if you have any at this point). What type of people are going to be viewing the site. If it's a more technical audience, then they probably have pretty wide monitors, but it's a 'mom & pop' type site, then they may still be using small monitors.

These days I've gone from 780 width (for 800px wide window size) to 980px width to cater for at least 1024 window size. As for height, don't declare a height at all. This will allow the content to expand vertically as needed regardless of window size.

--

Nadia

Adobe® Community Expert : Dreamweaver

Unique CSS Templates |Tutorials |SEO Articles

http://www.DreamweaverResources.com

http://csstemplates.com.au/

--------------------------------------------------

http://twitter.com/nadiap

helpvid

Participant

It all depends, I use CSS so i make the width 800px so the whole site fits all types of moniter, I never specify a height this way my site auto expands to accomodate whatever is placed within. So I would say the standard width would be 800 px.

http://www.helpvid.net

David_Powers

Inspiring

DRivera wrote:
What is the standard size for a website? height x width

There isn't one. People have different size monitors. Even those with large monitors don't always browse full screen. See this page that was written many years ago, but which is still relevant today: http://www.thepattysite.com/window_sizes1.cfm.

C

CaramelMacchiato

Inspiring

Hi David,

I have this problem, though. What you said is all true. But, unfortunately, I wholeheartedly disagree. Lot had changed from those days of "old school" thinking of old HTML and CSS coded in those days back in 1990s.

In fairness, we have to adapt and adopt new thinking with more forward-thinking in designing more user-friendly that is more accessible to any device, whether if it is a smartphone, or tablet, or laptop, or desktop with two or three extra large elegant monitors. We don't have control over this but if we do this way... Which means more work in designing and code in HTML5 and CSS3 and some awesome javascript scripts, so on.

But you are correct, though. In other words, you should be a bit more clear about what you meant... Just because... Lot of things has changed since 1990s to now and next 10 years from now.

Best, Brian

Herbert2001

Inspiring

For a good (and current) perspective, check out LukeW's presentations on this subject:

http://www.lukew.com/presos/

"Mobile First" and "Multi-device Web Design" are quite interesting.

In a nutshell: think content design, and leave the screen width paradigm where it belongs: in the past.

Liquid layouts the easy way

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded