Optimizing Images: Crop, Resize & Save

node

Optimizing Images: Crop, Resize & Save for:

1. Photoshop 6-CS2
2. Paintshop Pro 7-9(10)
3. The Gimp (2)
4. Irfanview

Rule Number One is that a complex image is always more difficult to compress than an image with a single background color. Consequently it is not only advisable to take pictures in front of a neutral background because it’s easier to see and virt, but also because it will decrease your final file size.

Rule number two, JPG compression is variable. There is not only one way of compressing an image using JPG, somewhere in the program you are using you can adjust the quality/compression ratio, try to find this option. It is possible to get every 800x600 pixel image under 70kb and every 640x480 image under 50kb, if you increase the compression enough.

Rule Number three, JPG compression is not JPG compression. The old compression type would already leave visible artifacts in the image at low compression rates. The new 'progressive' JPG compression can achieve much smaller file sizes without easily apparent loss of quality. Switching off all other save options like ICC color profiles or EXIF will save some space as well.

I personally use Photoshop, but this is expensive professional software, and not needed for this purpose here. Cheaper but also very good is JASC/COREL Paintshop Pro.

The GIMP is a freeware program that also has ambitions to reach professional level quality. DOWNLOAD

Apart from those 3 more extended pieces of software mentioned, there is also a plethora of image editors. Among them the very popular Irfanview. DOWNLOAD

Forget MS Paint!! *retch*

p.s. On request I can add additional tutorial for alternate popular image editors.

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

Advertisement

node

Photoshop:

Open the file you want to optimize and:


1. The first thing we may want to do is to crop the image cut away superfluous border space around the main object. To do this, select the Crop Tool from the Toolbar. [C]



2. Click an drag to create a selection for cropping. Photoshop allows you to adjust the selection by clicking and dragging the drag-points, shown as little squares around the selection.



3. Apply the crop by selecting ‘Image’ and ‘Crop’ from the menu. Alternately, double-clicking inside of the selection will also apply the crop. [ALT > i > p]

Attached Images

	psd_01.jpg (65.0 KB, 93 views)
	psd_02.jpg (69.3 KB, 91 views)
	psd_03.jpg (68.2 KB, 91 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

4. The next step is to resize the image to make is small enough to post on the forum. Again go to the ‘Image’ menu and this time select ‘Image Size’. [ALT > i > i]




5. A small window will open which will show the options for resizing the image. Make sure that the ‘Constrain Proportions’ box is checked and that the Units are set to ‘Pixels’. Resample image should be set to ‘bicubic’. Look at your width and height, and change the LARGER value to your desired maximum image size. Press ‘OK’ to apply the resize.




6. The next step is to save the image. To do this, go to the ‘File’ menu and select ‘Save for Web’. [CTRL+SHIFT+ALT+s]



7. A new window will open, presenting you with the save options. The 2-Up Display Tab at the top of the window will show you the original image together with the optimized image. This will let you see the difference between the quality of the two versions. Select ‘JPEG’ and check the ‘Progressive’ box. Now adjust the ‘Quality slider’ until the desired filesize has been reached and click ‘Save’ to save the image. Do choose a different file name, otherwise you might overwrite your original file.

Attached Images

	psd_04.jpg (62.8 KB, 89 views)
	psd_05.jpg (66.0 KB, 88 views)
	psd_06.jpg (66.7 KB, 87 views)
	psd_07.jpg (68.7 KB, 87 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

Paintshop Pro:

Open the file you want to optimize and:

1. The first thing we may want to do is to crop the image cut away superfluous border space around the main object. To do this, select the Crop Tool from the Toolbar [R].

2. Double-clicking inside the selection will apply the crop action.



3. The next step is to resize the image to make is small enough to post on the forum. Go to the ‘Image’ menu select ‘Resize’. [ALT > i > z]



4. A small window will open which will show the options for resizing the image. Make sure that the ‘Lock Aspect Ratio’ box is checked and that the Units are set to ‘Pixels’. Resample image should be set to ‘bicubic’. Look at your width and height, and change the LARGER value to your desired maximum image size. Press ‘OK’ to apply the resize.

Attached Images

	paintshop_01.jpg (66.6 KB, 83 views)
	paintshop_02.jpg (69.2 KB, 84 views)
	paintshop_03.jpg (66.7 KB, 84 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

5. The next step is to save the image. To do this, go to the ‘File’ menu and select ‘Save as...’. [F12]



6. Select 'JPG' from the 'Save as Type' dropdown box. Do choose a different file name, otherwise you might overwrite your original file.

7. Click on 'Options'.



8. In the new window that appears select progressive as 'Type' and click on 'Run Optimizer'.



9. The window will change to include a few more options among them the file size for the image we are about to create. Now you can adjust the 'compression value' to achieve the desired file size. When done press 'OK' to save the file.

Attached Images

	paintshop_04.jpg (69.8 KB, 81 views)
	paintshop_05.jpg (69.8 KB, 79 views)
	paintshop_06.jpg (65.0 KB, 78 views)
	paintshop_07.jpg (67.5 KB, 78 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

The GIMP:

Open the image you want to optimize and:

1. Click on the 'select rectangular regions' tool. [R] Click and drag to create a selection of the area you want to crop.



2. Apply the crop by selecting ‘Image’ and ‘Crop Image’ from the menu. Alternately, double-clicking inside of the selection will also apply the crop. [ALT+i > c]



3. The next step is to resize the image to make is small enough to post on the forum. Go to the 'Image' menu select 'Scale Image'. [ALT+i > s]



4. A small window will open which will show the options for scaling the image. Make sure that the chains next to the width and height are linked and not two separate chain links, this will lock the aspect ratio. Also check that the Units are set to ‘Pixels’. Interpolation should be set to ‘Cubic’. Look at your width and height, and change the LARGER value to your desired maximum image size. Press ‘Scale' to apply the resize.

Attached Images

	Gimp_01.jpg (63.0 KB, 72 views)
	Gimp_02.jpg (68.5 KB, 71 views)
	Gimp_03.jpg (69.2 KB, 71 views)
	Gimp_04.jpg (68.3 KB, 72 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

5. The next step is to save the image. To do this, go to the ‘File’ menu and select ‘Save as...’. [CRTL+SHIFT+s]



6. Choose a file name and a folder for saving, then click on ‘Select Filetype’ and select ‘JPEG’ from the list, when done press ‘Save’.



7. Another Window will pop up. Make sure the Advanced option are on, check the 'Show Preview' box so you can see the file size, and check the boxes for 'Progressive', 'Optimize' and 'Force baseline', uncheck the rest.

8. Adjust the 'Quality' slider until you reach the desired file size, and press 'OK'.

Attached Images

	Gimp_07.jpg (69.4 KB, 67 views)
	Gimp_06.jpg (68.6 KB, 66 views)
	Gimp_05.jpg (61.6 KB, 67 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

Irfanview:



Open the file you want to optimize and:



1. With the correct tool selected as default, start by clicking and dragging to create a selection to crop the image.




2. Select 'Edit' and 'Crop Selection' from the menu to apply the crop action. [ALT > e > r]




3. The next step is to resize the image to make is small enough to post on the forum. Go to the 'Image' menu select 'Resize/Rescale'. [CTRL+r]



4. A small window will open which will show the options for resizing the image. Make sure that the ‘Preserve Aspect Ratio’ box is checked and that the Units are set to ‘Pixels’. The 'Size Method' should be set to 'Resample' and 'Lanczos'. Look at your width and height, and change the LARGER value to your desired maximum image size. Press ‘OK’ to apply the resize.

Attached Images

	IrfanView_01.jpg (60.9 KB, 63 views)
	IrfanView_02.jpg (63.6 KB, 62 views)
	IrfanView_03.jpg (66.2 KB, 63 views)
	IrfanView_04.jpg (68.0 KB, 61 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell

node

5. The next step is to save the image. To do this, go to the ‘File’ menu and select ‘Save as...’. [s]



6. In the new window select 'JPG' from the 'Save as Type' dropdown menu. Also make sure the 'Show option dialog' box is checked.

7. In the options window, check 'progressive' uncheck everything else.

8. You can now adjust the Quality slider.

9. Irfanview will not give you any feedback as to the final filesize, so you will have to check the file size manually in the windows explorer, and possibly repeat steps 5 though 8, adjusting the quality until the desired file size is reached.

Attached Images

	IrfanView_05.jpg (65.8 KB, 61 views)
	IrfanView_06.jpg (68.9 KB, 61 views)

__________________
Whenever you find that you are on the side of the majority, it is time to reform. - Mark Twain
Never let your sense of morals get in the way of doing what's right. - Isaak Asimov
The most savage controversies are those about matters as to which there is no good evidence either way. - Bertrand Russell