Adobe Community: What is the standard size for website??

Currently Being Moderated

1. David_Powers,

Jul 25, 2009 2:14 AM in reply to DRivera

Report

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.

|

Mark as:

Currently Being Moderated

2. helpvid,

Jul 25, 2009 7:26 AM in reply to DRivera

Report

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

|

Mark as:

Currently Being Moderated

3. Nadia-P,

Jul 25, 2009 7:57 AM in reply to DRivera

Report

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

|

Mark as:

Currently Being Moderated

4. Zabeth69,

Jul 25, 2009 10:44 AM in reply to DRivera

Report

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

|

Mark as:

Currently Being Moderated

5. DRivera,

Jul 26, 2009 10:44 PM in reply to Zabeth69

Report

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!!

|

Mark as:

Currently Being Moderated

6. Nadia-P,

Jul 26, 2009 10:49 PM in reply to DRivera

Report

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

|

Mark as:

Currently Being Moderated

7. Kath-H,

Jul 26, 2009 11:12 PM in reply to Nadia-P

Report

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..

Please be aware that you could be driving towards a big road-block there. Of course sketch out your design in Photoshop if you want, but please don't think you can just export the slices and achieve a liquid layout. You are also going to need lots of live text on your page, not just 'text' in PS images.

I'd advise, stop and read those pages and tutorials that were just linked to before you go further down this road.

|

Mark as:

Currently Being Moderated

8. DRivera,

Jul 27, 2009 4:39 AM in reply to Nadia-P

Report

Hey thanks for the Links Nadia the material seems really helpful!

Kath-H, I know that I will need to add live text which I was going to add in DW, I have added text in PS for layout purposes.

I was planning on slicing and exporting the design from Fireworks to DW, and then plugging to proper code... This is is my intention...

|

Mark as:

Currently Being Moderated

9. LarryWard,

May 3, 2013 9:20 PM in reply to DRivera

Report

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.

|

Mark as:

Dreamweaver

What is the standard size for website??

Jul 25, 2009 2:08 AM

Liquid layouts the easy way

More Like This

Bookmarked By (1)

Answers + Points = Status