Build Your Own Business Website header image

Optimizing Images For the Web

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

Part 1 – Introduction

This is Part 1 of Optimizing Images, A Beginner’s Guide and in this session we discuss the purpose of optimizing images. The object is to find the “right” balance between file size and image quality. Then we discuss the 4 Elements of Image Optimization.

Video Transcript

Okay so Optimizing Images for the Web: A Beginner’s Guide. The purpose for optimizing images is to find the right balance between file size and image quality. And the point to remember about this is that there is actually a balance between the two, maximum image quality results in maximum file size and minimum file size results in minimum image quality. And so the challenge is to use the tools at your disposal to strike the balance so that that quality of the image is still appropriate and yet the file size is not too great.

Optimization has 4 elements. The first is the resolution of the image. We often talk about the resolution of an image in terms of dpi or ppi, that is dots per inch or pixels per inch. You know, most cameras these days capture images at 300 dots per inch or something like that. If you’re purchasing images like at Dreamstimes or that sort of thing, you can purchase very, very large images at 300 dpi.

So the first installment there is just the resolution of the image. The second element is the dimensions of the image, that is you know, 600 pixels by 200 pixels, that sort of a dimension. A height and width dimension of the image.

The 3rd element of optimization is the image compression format that’s used and you’re familiar with those as jpegs or gifs or pngs. Each of those 3 file types is actually a type of image compression. It takes the raw image data and extrapolates it into an image file type that can be viewed online. In particular, these 3 are the primary web based image types. There are other types of images as well and those other types of images are more appropriately used in the print medium, for example, a tiff file is very commonly used in print. But a tiff file is not appropriate for a display on the web because it doesn’t have nearly sufficient image compression.

And then finally, you have compression quality and I’m not talking about the technology that’s used. I’m talking about the level of quality that you select when you are converting it to a jpeg or when you’re saving it as a jpeg, a gif or a png. Each of those has varying levels of quality that can be selected and the higher the quality of course, the higher the image size.

0 Comments… add one
0 comments… add one