Image Sizes

[Frank]

My digital camera takes its pictures in the size 1600x1200. I published them on my site but I resized them to 800x600. I am currently redesigning my whole site and I was unsure if I should keep them 800x600 because of the large file size and and dl time for dialup users. Whats you opinon on using the picture sizes of 800x600 vs 700x525 vs 600x450. What would you use? Keep in mind I still need the picture able to be viewed clearly...

-Frank

[Orange]

The smaller the better. Whether people are on dial-up or broadband you always want to have small file sizes. This doesnt mean you have to sacrifice anything though.


Since you have photoshop i belive, I would resize the pictures to the smallest readable size you want. Open the pictures in photoshop, select image, then image size. set the dpi to like 72-75, check the constrain iamge size button, the resize the hte width to what you like. When your finished save the picture as a .jpg, the click the image ready button on the button of the menu tool bar.

When your image loads up in Image ready, click view and choose create guides. Set the guides up on your picture like this for example:
check both horizontal and vertical guide boxes.
enter 2 inthe evenly spaced box's for each section.
This should give you 2 vertical and 2 horizontal lines across your image. Then click slices button.
Choose the Create slices from guides button (first button on the drop down menu.

Now you have cut the image into 9 smaller images.(This does not affect your original image)

Click File-->Save optimized as and save the file to whereever you want.
This should generate an html file + a folder named images whereever you saved it.

When you click on the html file it will have your image in it. The only difference is when the html page loads it loads the 9 slices you made instead of one huge image. This is better for low bandwidth users.

Note* That you can edit your save optimized as choice by selecting Output settings. This lets you choose how you want everything saved as. Just play with them till you get what you want.

You can also create simple or complex rollovers from your slices with image ready, which is pretty nice and it writes the javascript for you automatically. Pretty fun if you have kai goo and want to mess with peoples faces on a photo hehe.

hope that helps, but it will help on load times. Even though IE allows autoresizing of pictuers it is not a standard kept with all browsers, so smaller is better.

[TGecho]

I don't know what you're using the pictures for, but if it's some sort of display gallery I would suggest using thumbnails linked full sized versions.

[ByteWizard]

the html page loads it loads the 9 slices you made instead of one huge image. This is better for low bandwidth users.

Are you saying the total file size of the 9 pieces is smaller than the file size of the original. I was under the impression that while you slice it up and it load 9 smaller images, the total file file size is LARGER. You cant view the image until all parts are loaded so why is this better?

Images the size that you (Frank) mention, are way too large unless you have very demanding reasons for having such a large pix. Play with the resolution and image size until you get the smallest acceptable size. By all means create thumbnails for the user to view before loading such large images. Load the large images only on demand.

[MikeParent]

Wouldnt progressive JPG be easier instead of image slicing?