tables: absolute v. relative (?)

[lostdreamer]

k, resident idiot here asking for (what i'm sure is) a basic question. i just received a new computer (so excited), which is great, since my previous computer was on its last leg. anyway, my new computer's monitor setting is 1280x1024; my previous monitor was at 800x600. while my understanding is that the majority of the internet world is on 800x600, my websites look a little "off" on monitors with higher res.

alphadesk was so kind once to help me understand the concept of tables with absolute widths versus relative(?). i use dw4, and i believe i just figured out how to make my tables relative instead of absolute, so that my pages can be centered.

but, now, i think i have a new question: as expected, my graphics on a higher res monitor look shrunken. does anyone have any recommendations for a happy medium of graphic size? i once read on the macromedia (http://www.macromedia.com) fireworks support site that graphics made in fireworks 4 (and above) should be made at a screen res of 1024x768. unfortunately, my previous monitor's maximum res was 800x600, so i didn't have that option. does anyone else concur with this thought, or are they any other suggestions for a happy medium when it comes to graphics and how they are represented on the various screen resolutions?

thanks for any and all input.

[blurchy]

hi

im in the same boat kindof

the computer im using is a laptop which has two

screen settings 800x600 and 1024x768

at the 800x600 setting the graphics look poor

and so does text (its cos of the shared graphics)

anyway getting to the point, seeing as youve said

800x600 is the most popular screen size (i agree)

then make them at that size. most web sites

ive seen are made at this size .


i do know what u mean about graphics

ive been making a cd full of web backgrounds

and it has been a nightmare i have had to change

many of my images cos yes they look great at

1024x768 but once u get to 800x600

they look huge and sometimes poor quality

because they are being viewed under the microscope

of 800x600 instead of the bigger 1024x768



besides the bigger the image the bigger

your webpage is going to be


generally i find when making web backgrounds

sometimes its better to make the image smaller

and have the quality high rather than the other

way round

id go for the 800x600

this is just my opinion


ive done 1376 background images so far

gees

[lostdreamer]

well, when you make your graphics, do you do it at a screen res of 800x600 or 1024x768? and, if you do it at the latter, do they look too big on an 800x600?

[blurchy]

well i have no choice

but to do them at 1024x768

and then i VIEW them on 800x600 computer

or i view them inside an iframe set to 800x600

id make them at 800x600 res if you can

(youll have to view them at this size later anyway)

and yes when you view them at higher res they will

look smaller theres no getting round that one

unless theres some javascript out there that will do it


you have a choice you can make your

page at the 1024x768 and have big bungly

graphics at 800x600 or make it at 800x600

and have small graphics at 1024x768


the best thing you can do really is look around

at web pages that look cool and view them

at different sizes and if you like the size

of a graphic (in both views) download it and see how big it is

banners are generally a set size 468x60-80

ad buttons are also a set size 88x31

go round a few sites and download a few banners logos etc

and compare them in size look at

"if you like this site link to us pages"

they will often have set sizes

go round a few youll see there is a standard



p.s. if you want the code for the iframe

page viewer let me know

[BerksWebGuy]

I use Flash5 for all my crap. I make the top images fit the size of the screen...no matter the resolution.

I make it for 800x600 (which is the middle). So its just a little different for the other resolutions...but it still looks good and smooth.

You can check it out at my homepage posted below:)

[sdbarker]

I don't think that you can even have a computer ordered anymore that comes with anything less than 800x600.

One solution that you might want to adopt, which I myself use on occassion is to design your page for 800x600, and surround your entire page in a relative table that's 100% x 100%, and centers everything horizontally.

What this will do for you is provide you with a page that stays how it's supposed to look, even at larger resolutions, but doesn't have the enormous amount of white space around the edges.

Now that I go back and re-read this, it sounds a little fuzzy, but I'm not sure how to clear it up. If you need some more explanation, feel free to ask questions.

-Scott

[lostdreamer]

scott, i played with one of my pages and changed the table, so the table is now centered no matter what the screen res.

but, i suppose my (new) question is regarding the graphics: how do i get a happy medium, so that they're not too big but not too small?

[RSaucier]

Don't forget to account for browser "chrome" :) Toolbars, window borders, etc. when making your design.

If you target your content table to be no wider than about 760 pixels, it should comfortably fit in the top 3 browser windows with no horizontal scrolling.

Robert

[sdbarker]

Originally posted by lostdreamer
scott, i played with one of my pages and changed the table, so the table is now centered no matter what the screen res.

but, i suppose my (new) question is regarding the graphics: how do i get a happy medium, so that they're not too big but not too small?

I'm not exactly sure that there is one. You need to design for your target audience. Obviously some people are going to be unimpressed. I design most of my stuff based on what resolution my friends and I run, because we're really the only people that are going to see it. So, that usually hits 1024x768 or better.

When I'm doing professional design, I usually design for 800x600. My most recent design project, for a comic strip, happens to fit perfectly into 800x600 by chance.

What it boils down to is: who is your target, and what are they viewing your site with?

-Scott

[Ddr]

You never mentioned what kind of graphics you were using. If they are really that critical, there is always the tedious solution of using javascript to detect the user's screen resolution and redirect them to a subdirectory of your site made to the resolution that particular user is dialed into.

Dale

[sdbarker]

Another thing that I've done, when width was critical, was using perl to detect the browser/os, and dynamically generating the page using widths that were calculated in that script.

-Scott

[RadioRob]

Another thing that I've done, when width was critical, was using perl to detect the browser/os, and dynamically generating the page using widths that were calculated in that script. Hi Scott!

Did ya code that script yaself or did ya download it from somewhere? I'd really be interested in seeing how it was setup and how it works.

That sounds like a really good solution to a problem I've had with one site I administer.

I'm just now starting to get my feet wet with CGI, Perl, and PHP, but I'm learning a lot. :)

Thanks!

[SBGlasby]

Just my 2 cents....

The bulk of the world is still browsing at 800 X 600....

and for those who aren't..... you can make them.... see your site a 800 X 600..... with javascript ..... that will create a New Browser Session in a non-resizeable browser window.....

Or a javascript.... that will detect.... browser resolution.... and send them to a particular version...... designed especially for that resolution.....

ie: using SSI.....and javascritps you can accomodate many differences.....

I guess the biggest impact..... of images is physical size..... for speedier downloads....... so smaller would be better.... resolution wise..... and speed wise......

try http://www.hotscripts.com ...... it's a directory of all kinds of scripts.... linking to the authors homepages.... so you can see most of the scripts in action.....

[sdbarker]

Originally posted by RadioRob
Hi Scott!

Did ya code that script yaself or did ya download it from somewhere? I'd really be interested in seeing how it was setup and how it works.

That sounds like a really good solution to a problem I've had with one site I administer.

I'm just now starting to get my feet wet with CGI, Perl, and PHP, but I'm learning a lot. :)

Thanks!

I did write it myself. But, it's not exactly portable, because it was coded very specifically to the site that it was used on.

The basic idea though is to use Image::Magick; Browser::Detect (iirc); and whatever module it was that detected the screen resolutions, and then take the detected browser version, do a hash lookup of the browser to find the right size for the image at a specific resolution, and then use image::magick to resize it.

-Scott