[Webinar] Learn how to a build a cloud-first strategyRegister Now


What is the best res to set in Fireworks or PS when designing websites?

Posted on 2007-07-27
Medium Priority
Last Modified: 2013-12-13
What is the best res , when designing websites in Fireworks or PS, to set my res to?
I use Fireworks with designing web pages, and even though a made alot of sites, this has always stumped me. I have my monitor's resolution set to 1280 x 1024. So when designing still to look clear in 800 x 600 and for web surfers who have their monitor resolution set to 800x 600,1024 x 768, or even 1280 x 1024.
Now when i first start out in fireworks when designing a site, i set 800 x 600 for my canvas, and my res is 72<-- this is what i want to understand.  Please help me make the best looking sites!!!
Question by:Sam Cohen
LVL 11

Assisted Solution

L00M earned 200 total points
ID: 19581965
I still design all my sites with 800x600 as my target resolution. Why? Well, most users today don't use 640x480 anymore, and 800x600 looks just great on larger resolutions (if the designer knows what they are doing.)
And, yes, 72ppi is the max resolution you can display on a web page.

As seen here, 640x480 is really no longer an issue:

It states:
The current trend is that more and more computers are using a screen size of 1024x768 pixels or more:

Does that help? Or were you looking for more information?

Author Comment

by:Sam Cohen
ID: 19582310
ok. well i usually design is 1280 x1024 monitor res
now if i start a website at 800x 600 canvas...the site looks the same on 1280x1024 as i design it in 800x600.
and after i design it and if i change my monitor to 800x600 the websites looks a bit larger.
so i are you tell me to change my monitore res to 800 x600 than start designing on 800x 600 canvas?
LVL 70

Accepted Solution

Jason C. Levine earned 400 total points
ID: 19582425
Actually, it's a bit more complicated then that.  When designing for the web, you need to think about the VIEWPORT size and not the full resolution.  800 x 600 is not the size of the browser window.

Check out these links for a discussion of who browses at what resolution and the last link I give has a recommendation based on viewports:

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

LVL 29

Assisted Solution

matrixnz earned 400 total points
ID: 19582503
Hi all4artz

1280px x 1024px, 1024px x 768px or 800px x 600px isn't related to resolution, it's actually talking about pixels width x height on a screen, so when you design your page,  within the HTML you or CSS you specify the width of your web page, so for e.g. the most common place to set this is either on the most outer div, if using css, the outer table or most commonly the banner.  It doesn't matter what screen resolution you create your website in.

Most new designs are moving towards 1024px x 768px since most people have 17" screens or larger these days, previously 15" screens 95-2000 were very common so the resolultion was 800px x 600px.  It depends on you and your clients.  As a rule of thumb here is a list of sizes you should create your pages in.

640px x 480px = 600px x 300px
800px x 600px = 760px x 420px
1024px x 768px = 955px x 600px
NOTE: don't worry to much about height, the width is the most important aspect, so why make the pages slightly smaller?  Because all browsers have scrollbars, this takes up approx 40px screen space i.e. 800px - 40px = 760px

Hope that helps.


Author Comment

by:Sam Cohen
ID: 19582720
Yes it helps...So you guys are saying to design in those numbers....regardless of my native monitor res(1280x1024) . But how can i account for the images i use?
If i make a big image that look good to me, in my res, being that it is filling the whole height (e.g. 80px x 420px ) then when i change my monitor res to 800x600 it get bigger, seems to lose pixels, and it doesn't sit on the whole page.
LVL 70

Expert Comment

by:Jason C. Levine
ID: 19582759
Once an image is set, it's set.  You may have the Zoom feature in FW screwing up how it looks, but on the web, 80x420 is 80x420

Author Comment

by:Sam Cohen
ID: 19582921
oh--ok you are right!!!

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article, I'll explain how to change the color of a selection in Photoshop. I'm sure there are a couple different ways to do this in photoshop, but this is my preferred method in Photoshop. I am using Photoshop CS6 and I will be adjusting the…
This article outlines the struggles that Macs encounter in Windows-dominated workplace environments – and what Mac users can do to improve their network connectivity and remain productive.
In this Micro Tutorial viewers will learn the basic shortcuts and functions of Illustrator. The viewer will learn about the paintbrush tool, anchor points, font sizing, and more.
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Suggested Courses
Course of the Month20 days, 11 hours left to enroll

865 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question