Jump to content

Cre8asiteforums Internet Marketing
and Conversion Web Design


Photo

How many pixels wide do you design website for?


  • Please log in to reply
31 replies to this topic

#1 RisaBB

RisaBB

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 1437 posts

Posted 17 November 2004 - 12:19 AM

Hello,

For the past few years, I've been designing websites to be 730 pixels wide. Now that I bought a flat screen monitor and changed the resolution of my screen, I'm wondering if this is a trend and that I can design for a wider page.

What pixel width are most people designing for?

Thanks.

Risa

#2 Tim

Tim

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 3094 posts

Posted 17 November 2004 - 02:55 AM

IMO, it would be a good idea to keep to your 730 pixels, as a lot of web users still use 800x600 resolutions.

What would be useful though, would be to look at your server logs and see how many of your users use this resolution. If there's none, or a very very small percentage, then there's probably no harm in designing bigger.

But just remember that anyone visiting the site on a 800x600 resolution would see horizontal scrolling.

#3 paranoidandroid

paranoidandroid

    Light Speed Member

  • Members
  • 821 posts

Posted 17 November 2004 - 06:21 AM

Hi Risa,

You may find this thread useful.

Personaly I tend to design to around for 740.

#4 Minna

Minna

    Gravity Master Member

  • Members
  • 225 posts

Posted 17 November 2004 - 06:28 AM

Besides, it is easiest to read about 800px or narrower. The text can't be very wide, and at least i don't pay attention to more than 1-2 columns at same time.
Wide is less effective.

#5 Scratch

Scratch

    Light Speed Member

  • Members
  • 964 posts

Posted 17 November 2004 - 07:08 AM

Ditto Tim, Marvin and Minna.

Unless there's a good reason to go full-width, stick to 800x.

What makes a good reason to go full-width?[list]

[*]This forum works well full-width, but only because the text itself doesn't go full-width. There's also plenty of white space between the posts, that help keep them readable.

[*]If you've got a page of thumbnails, e.g. Google Images, the more thumbnails you can see on screen without scrolling, the smoother the experience. This may work for any other content that's formed in discrete boxes rather than one big column of text.
[list]
Anyone think of other appropriate uses?

#6 paranoidandroid

paranoidandroid

    Light Speed Member

  • Members
  • 821 posts

Posted 17 November 2004 - 07:25 AM

Anyone think of other appropriate uses?


I think ebay's full width auction pages work reasonably well.

#7 Scratch

Scratch

    Light Speed Member

  • Members
  • 964 posts

Posted 17 November 2004 - 08:14 AM

O'Reilly.com is good, because it has several columns, so no individual column line-length goes too long.

Creative Commons (my fave site of the week) works well. Short paragraphs and loads of white space help full-width readability.

There are some decent blog sites, e.g. Jason Santamaria.

But I note that 90% of my favourite site designs are fixed-width, and mostly centre-aligned.

#8 Lyle

Lyle

    Light Speed Member

  • Members
  • 627 posts

Posted 18 November 2004 - 10:29 AM

I just prefer pages to go full-width anyway. Seeing pages with empty space just seems wasteful - surely it's easier/better to work to a flexible width that doesn't care whether about a user's screen resolution?

#9 RisaBB

RisaBB

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 1437 posts

Posted 18 November 2004 - 10:55 AM

Thanks, everybody.

#10 Scratch

Scratch

    Light Speed Member

  • Members
  • 964 posts

Posted 18 November 2004 - 01:19 PM

Lyle, when you put a newspaper on a table top, are you bothered about all the 'wasted' space on the table top?

The goal of design is to communicate effectively. Some situations will benefit from showing as much content on screen at the same time, while other situations will benefit from keeping line lengths to scale, and increasing clarity.

#11 Jesus

Jesus

    Ready To Fly Member

  • Members
  • 13 posts

Posted 20 November 2004 - 01:11 AM

Personally I like to design between 730 and 770 pixels width centered. I normally use a background trying to do some kind of contrast with the centered layout.

Also another good idea, if your're designing a portal (example), you can have your header at 100% width (using a nice background) but you can use just 770 pixels for the content. It might feel like a liquid design, but it will be fixed all the time ;)

Jesus

#12 thirstymoose_2000

thirstymoose_2000

    Mach 1 Member

  • Members
  • 268 posts

Posted 22 November 2004 - 12:13 PM

If there's a good chance the page will be printed I try to stay under 740 (for the printed area) as I find that prints well.

I try to stay nice, clean and uncluttered in my design. I find a lot of elastic designs end-up with odd areas of white space, text that is too wide to comfortably read, bad word wraps, images that end-up floating and lose their conection with the rest of the content and most end-up being a little distracting because the design falls apart.

#13 Lyle

Lyle

    Light Speed Member

  • Members
  • 627 posts

Posted 23 November 2004 - 03:25 PM

Scratch, if I put a paper on a table top then no, I don't worry about wasted space. However, if my paper had four inches of blank white either side of the columns of text it would bug me.

I agree, regarding clarity - I tend to use a margin of, say, 15-20 px all the way round, but still prefer to allow a site/page to maximise its use of screen real-estate. Personally I find that if someone's got a higher resolution screen, they want to use that width, and get frustrated at using a 1280width screen when the site's designed for a fixed width of 750px, resulting in nearly half the screen being blank space.

And thirstymoose, fair point re printable size - I admit, I hadn't considered that one overly.

#14 eron19

eron19

    Light Speed Member

  • Members
  • 582 posts

Posted 24 November 2004 - 05:25 AM

740-788

#15 Tangaroa

Tangaroa

    Light Speed Member

  • Members
  • 513 posts

Posted 24 November 2004 - 11:21 AM

I try to use a maximum of 748 (for the 800*600 users) but not smaller than that.

Full-width is a nice thing for users who do not maximise their browser and still can see all the content but full-width can be a pain to develop. You need to use multiple layers with visible overflow and you can't use full-sized banners...

When sites are being reviewed that are not suitable for a 800*600 resolution you'll always get the remark that too many people are still surfing at 800*600. However, and this is just a thought, if all webmasters start making sites at 1024*768 won't the users start changing the resolution in the end (except for the visual impared people)?

#16 TheManBehindTheCurtain

TheManBehindTheCurtain

    Time Traveler Member

  • 1000 Post Club
  • 1035 posts

Posted 24 November 2004 - 11:27 AM

Once you've chosen your width (whether liquid or fixed), please also give some thought to the layout inside that width to ensure not only readability but "printability." In a fixed width of 740 pixels, if you do nothing special, only about 600 pixels on the left will print. I can't tell you how many times I've printed out product pages or some other information I wanted to read offline, only to find the right inch or so was missing, making the reading a sort of word puzzle.

Nowadays, you can create a specialized CSS for printing, but that will cover only a percentage of your readership. What percentage? I heartily endorse the previous comment to sift your logs or consult your web analysis program (WebTrends, etc.) for the answer to that and other questions. The "right" width and the "right" design is the one that represents the best choice between your reader's technical capabilities (like monitor resolution), the type of audience you're reaching, and the type of content you're providing.

#17 eron19

eron19

    Light Speed Member

  • Members
  • 582 posts

Posted 22 May 2006 - 09:15 AM

1000 wide

#18 bwelford

bwelford

    Peacekeeper Administrator

  • Admin - Top Level
  • 8995 posts

Posted 22 May 2006 - 09:26 AM

740-788

What caused you to change your mind, eron19. :(

#19 eron19

eron19

    Light Speed Member

  • Members
  • 582 posts

Posted 22 May 2006 - 09:58 AM

its a new day :(

more people using 1024 wide screens...

and besides...you can always throw a banner to the right or some unimportant info over there.

its kinda like doing to the public what the gas sellers are doing...
forcing you to buy hybrids if you wanna save on gas...but us designers would be forcing people to switch to 1024 wide res

#20 bwelford

bwelford

    Peacekeeper Administrator

  • Admin - Top Level
  • 8995 posts

Posted 22 May 2006 - 10:45 AM

Your elephant, eron19, is powerless against my mouse. :(

#21 Respree

Respree

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 5901 posts

Posted 22 May 2006 - 11:04 AM

more people using 1024 wide screens...


I can't disagree with that statement.

If one is comfortable with 20% of your visitors scrolling to the right, I don't see a problem.

#22 dgeary9

dgeary9

    Mach 1 Member

  • Members
  • 334 posts

Posted 22 May 2006 - 11:53 AM

I monitor several general interest sites where the 600x800 resolution visitors are 25+%. I think it is a matter of knowing your audience. I'll also add that just because someone is using higher resolution doesn't mean they are using full screen.

Edited by dgeary9, 22 May 2006 - 11:56 AM.


#23 manager

manager

    Time Traveler Member

  • 1000 Post Club
  • 1331 posts

Posted 22 May 2006 - 12:02 PM

Hi there, If you are still unsure about website width there is a lot of the same here.
More website width info :(

TreV

Edited by manager, 22 May 2006 - 12:02 PM.


#24 joedolson

joedolson

    Eyes Like Hawk Moderator

  • Technical Administrators
  • 2902 posts

Posted 22 May 2006 - 01:00 PM

I guess I pretty much don't think about pixels when I design - I think more about whether the design looks acceptable at 800x600, sort of optimize for 1024x768, and pretty much let it go for larger screens.

Pretty much, as Respree says, you can easily survive larger than 770px wide designs if you put unnecessary material on the right side - I've seen this in action, and it doesn't bother me (much). Still, I always hate seeing that horizontal scroll bar, even if I don't actually need to use it...

For me, though, a site has to be usable at 800x600 - so either I'll go for a design which is flexible and compensates perfectly well at 800x600 or a design which can safely sacrifice a couple hundred pixels off the starboard bow.

#25 rynert

rynert

    Light Speed Member

  • Members
  • 858 posts

Posted 22 May 2006 - 02:58 PM

For my information / community sites where I have Adwords the right-hand section that is missing at 800*600 is just the adwords, once you scroll once and see this I am hoping my visitors at 800*600 just ignore the horizontal scroll.

For commercial sites where I don't want / need adwords I make it fully fluid between 800 and 1000 wide - working equally well at both widths.

#26 sanity

sanity

    Honored One Who Served Moderator Alumni

  • Hall Of Fame
  • 6889 posts

Posted 22 May 2006 - 11:37 PM

Am I the only person who does not *ever* have my browser maximised?? Ever.

Any resolution stats do not take people like me into account.

#27 EGOL

EGOL

    Professor

  • Hall Of Fame
  • 5187 posts

Posted 22 May 2006 - 11:53 PM

I am mainly 750... but will have some new pages that go for 990. Lots of high res visitors on my site and I have some big images.

#28 rynert

rynert

    Light Speed Member

  • Members
  • 858 posts

Posted 23 May 2006 - 01:19 AM

Am I the only person who does not *ever* have my browser maximised?? Ever.

Any resolution stats do not take people like me into account.


No, my wife doesn't either and it drives me nuts when I am trying to explain something and all I can see are loads of windows floating over each other!

#29 joedolson

joedolson

    Eyes Like Hawk Moderator

  • Technical Administrators
  • 2902 posts

Posted 23 May 2006 - 03:52 AM

Any resolution stats do not take people like me into account.


You're absolutely right - but I don't readily see how they ever could. The variability possible when assuming people don't have their viewports maximized is just too great to be used as a design guideline. What I'm primarily concerned by is making certain that it's possible for the maximum number of people to view the whole width of the design. What they choose as their viewing preference is entirely their business.

It's the same with CSS on/CSS off - people can choose to browse with CSS off, and my site will be usable - but they can choose to change that, and see something nicer.

I consider the viewport width to be a relatively easily changeable factor, up to the limits of the screen resolution. Changing screen resolution is a very different school of user changes - perhaps it's not possible, perhaps somebody won't be able to make out the text if they adjust the resolution up, etc.

Still, since I try to design so to be accessible on mobile devices, my sites should generally be at least reasonably usable for any viewport width. Mobiles do get a different style set, however, and the linearization makes a big difference.

#30 eron19

eron19

    Light Speed Member

  • Members
  • 582 posts

Posted 23 May 2006 - 08:28 AM

hmmmm maybe its best to move back to 800 wide then......wow.

i have been englightened.

and thats rare.

#31 TheManBehindTheCurtain

TheManBehindTheCurtain

    Time Traveler Member

  • 1000 Post Club
  • 1035 posts

Posted 23 May 2006 - 10:42 AM

I always think of the "how wide" question in different terms. The type of monitor your audience has is just a statistic, meaningless by itself. More important are issues such as age, learning style, educational level, etc. And of course, an analysis of your content and how it's best organized and presented.

Just because you *can* design for a 1024-wide screen doesn't mean you should. I think some sites make the leap beyond the magic 750/760 boundary because they simply want to cram more stuff into their layout -- add more columns, more boxes, more headlines, more links, more more more. The result may be "more content" but frequently the real result is "less comprehension." The great challenge is not to cram more info into the screen; the real challenge is to condense, distill and organize content to make it more comprehensible. I think there is simply a limit to the amount of information a normal human brain can take in at one time, and beyond that you're reaching a point of diminishing returns.

My favorite example is CNET. It is spread across a wide layout. I grok maybe 60% of what's on the screen, mostly in the upper left quadrant. The rest tends to be white noise.

Just a thought. I would analyze your audience and your content, and come up with a layout that best conveys the information. That will lead you to best width. Making your layout wider "just because you can" is the wrong motivation.

#32 SwissAboriginal

SwissAboriginal

    Ready To Fly Member

  • Members
  • 10 posts

Posted 30 May 2006 - 03:42 PM

if I design for the poore, I go for 800 x x600 - if not I go for 1024/1280 x 768 :-).

... or 80 - 100 %



RSS Feed

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users