Standard width/height that a website should be

im just wondering, what is the standard/default width and height that a webpage should be? i know its dependent on content too, but i see many sites who have really narrow widths to their pages, is this the way to go or utilise the entire window/screen area! :rolleyes:

width: fluid
height: as high as you need to (within reason of course)

oh right ok thanks stymiee! :slight_smile:

Width : I would never go over 950…remember there’s laptoppers…
Height : IMHO 1000 is max per page. Spread your info out in different pages.

ok thanks for the advice Lister! :spf:

I like to code my width=“100%” so it fills the screen no matter what screen resolution the user has set or if they have the browser minimized or maximized. I think it is annoying when there are scroll bars at the bottom of the screen. Just my opinion.

yeah it is annoying! thanks for the useful info! :slight_smile:

I think fluid widths are great if you’ve got the content to make them look good, but if you’ve only got a paragraph or two on a page it can look silly. I try to keep my widths to about 760px to allow for those using 800x600 resolutions and height as necessary depending on the amount of content.


P.S. You might find this info from the Yale Style Guide useful.

I concur with the fluid width 90 or 100%. There’s nothing more annoying than having to scroll to the end of every line. As for height, I think a couple of screens in height is enough. Not everyone has broadband, me included, so pageweight is a factor. You don’t want the page to take too long to download. If you use columns in the page, one of them could be fixed at, say, 180px for the menus or adverts or tips or something like that while the rest is fluid. I think Steve’s point about 800x600 screens is a good one. Many still have this size screen.


PS. Jakob Nielsen used to have a very good site all about usability. Google his name and you’ll likely find it.

I use fluid widths where possible. I also try and build the page so it will be usable at 640 x 480! not always successful, as you can imagine. So I make sure it looks OK at 800 x 600 and font size increases don’t break it too badly.

I still haven’t figured out the right thing to do for visitors with hi res screens. My paragraphs run right across the screen and are probably difficult to read.

Maybe I should put a little notice like “if the sentences are too long, resize your browser window!”. :slight_smile: :slight_smile: :slight_smile:

Have alook at the sites you admire. Resize your browser window a few times on each. Figure out what you like. Imitate. :x

thanks alot fisherboy, steve and mark…!! lots of useful info…

appreciate it ty! :spf:

I pretty much always develop at 760 wide and whatever height; but most pages are no more than a 1 page of a document max.

Eh. I know a lot of people are big fans of allowing the content to spread across the entire width of the browser, but IMO there’s nothing worse than reading lines of text that go all the way from one end of my 1200x800 screen to the other. Especially if the text is small.

I generally like to create pages with a width of 760 pixels, and I generally try to keep text content no wider than 400-500 pixels. It’s so much easier and more pleasant to read that way.

There are plenty of exceptions when 100% width works best, I just haven’t created many websites myself where this was the case.

Fixed, elastic, fluid - they all have their advantages and their disadvantages. You need to look at the content of the site, who the target group are and your client’s preferences and then ensure that the site is still usable, accessible, attractive etc when the font-size is increased a couple of times, when the browser window is very wide or narrowed to 800px for example.

It is hard to legislate for every possibility - but you should certainly examine the possible problems of whatever your choices are and try to address them.

I’d say a web page should adapt to the size of the browser window up to a certain maximum width, where the widest column is 60-70 characters wide.

A fixed width has its obvious drawbacks (it only works at one given viewport size and at a specified text size).
An unconstrained fluid layout has usability problems, because the lines of text can get far too long for comfort.
The solution is a constrained fluid/elastic hybrid: sidebars specified in ems; content column takes up the remaining available space; and the whole thing has a min and max width specified.

thanks for all the info guys…appreciate it!

I usually use width=995 max and the height depends on the content. (I never make it too long.)

width 995 because I get to place more good stuff on the visible area and still I leave a little room for the browser’s scroller.

In these days I believe that targetting the 1024x768 is better than targetting the 800x600 audience. It’s not 1995 anymore… (BUT, it also depends on what you have to place on your page. If it’s important to have as much compatibility and you don’t have a lot of content for the page, go for 800x600. (width=775 max)


Targeting any particular screen size is just as wrong since browser viewport size has nothing to do with screen size.

If your page can’t adjust to 748 pixel width it can’t be printed and if it can’t adjust to 544px then it can’t be viewed on webTV. Of course most viewing devices these days have a smaller screen size than that.

Be careful not to make it too wide. I hate sites that are wider than the screen.

Very true. By rule i always make sure my page is smaller than viewed at full-screen on a 800x600 resolution.