you're reading...
Designing for the Web

Optimizing Your Images

Don’t make your visitors wait and wait for your page to load. By correctly creating images for use on your page, you will not only catch the viewer’s eye but help your page load quickly.

  • Keep each image between 10k-12k in size.
  • Size your images to the dimensions you want them to appear on your page.
  • Save the images for “web use” using your photo editing software like Photoshop Express Editor.

Here are a few questions to ask yourself as you plan your image library.

By , About.com Guide

Is the image in the right format?

There are only three image formats for the web: GIF, JPG, and PNG. And they each have a specific purpose.

  • GIF—Use the GIF format for flat color images. These are images with just a few colors.
  • JPG—Use the JPG format for photographic images. These are images with millions of colors.
  • PNG—Use the PNG format if you don’t need your images to display on mobile devices. They are good for both flat color and photographic images. It’s best to save your images as both PNG and either JPG or GIF and then use the version that is smaller.

What are the image dimensions?

An easy way to make your images smaller is to do just that, make them smaller. Most cameras take photos that are way bigger than the average web page can display. By changing the dimensions to somewhere around 500 x 500 pixels or smaller, you will create a smaller image.

Is the image cropped?

The next thing you should do is make sure that the image is cropped as tightly as you can. The more you crop off the image the smaller it will be. Cropping also helps define the subject of the image by removing extraneous backgrounds.

How many colors does your GIF use?

GIFs are flat color images, and they include an index of the colors that are present in the image. However, a GIF index can include more colors than are actually displayed. By reducing the index to only the colors in the image, you can reduce the file size.

What quality setting is your JPG set to?

JPGs have a quality setting from 100% down to 0%. The smaller that quality setting is, the smaller the file will be. But be careful. The quality affects how the image looks. So choose a quality setting that isn’t too ugly, while still keeping the file size low.


About K E R N girl

I am a graphic designer, instructor, and crafter with an eye for detail and a love of all things printing, type and felt.


No comments yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: