Background

PHP has the built in ability to optimize images which can be very useful in web development. Take a social networking site for example - if you let users upload an unlimited amount of unoptimized images, you could find both your server hard drives and your bandwidth allotment quickly overrun. The solution is to optimize and possibly resize user images when they are uploaded. How does this work? The below example shows how images can be optimized in PHP.

For more information on why image optimization is needed and how to do it in Photoshop without PHP, click here: Image Optimization.

PHP Image Optimization

In order to optimize an image in PHP, you need to have an image saved to a known location. You can then call the following bit of php code to load the image into PHP's memory, and the output it to a destination with a given quality. The function that does all the work is imagejpeg(). This function takes the destination of the output image and a quality specification (1-100) in addition to passing it the image object you created.

<?php $filename="myimage.jpg"; $img = imagecreatefromjpeg($filename); header("Content-Type: image/jpeg"); imagejpeg($img, $filename, 100); ?>

Pretty simple right? Note that this script does not display an image on the screen. Instead it outputs the image to a file, shown above as the $filename variable. Because we created the image and output the image using the same $filename variable, the image will overwrite itself. If you wanted to output the image somewhere else, you could change the destination variable to something else. For example: imagejpeg($img, "optimized_images/my_new_image.jpg", 75); If you wanted to display an image on the screen you could give the destination operator as an empty string, and this would send the image to the browser.

So what does this numeric quality value mean? There is no exact science to picking the best quality number. The higher the number, the better the quality, but the larger the filesize. Sometimes, the 100 value will actually have a larger filesize than the original image. Below is a test case where i experimented with the quality of an optimized image.

Test Case

I tested the optimization of the below image at various quality levels. The goal of this test is to find the best quality for an everyday use web image at the size shown below. The original image was saved in an unknown program years ago at a high quality setting. Your own results may differ depending on original image quality.

Summary

Taking both quality and size into consideration, I would choose 70 quality for ordinary images needing to be optimized, and I would choose 80 quality for cases where the image is going to scrutinized closer (photography websites, e-commerce). Images with quality higher than 80 have a greatly increased filesize (see graph below) without much increased quality.

Extending This Example

So now that you have determined the ideal image quality, what do you do next? As mentioned in the opening paragraph, you could also resize the image at the same time you optimize it. Pictures from today's digital cameras are far too large for webpages and need to be resized substantially before display. PHP's imagecopyresampled() and imagecopyresized() functions can do this for you.

Need to resize and optimize multiple images at once? If you have PHP 5+ you can use the scandir() function to get an array of all the files in a specific folder. You could then loop through them one by one and resize them all. If you're still using PHP 4, then the readdir() function will let you loop through all the files in a directory.