Optimizing Online Images


How to Avoid Plagiarism of your Digital Images.

Online Image Specifications

Optimized images meet these specifications:

Small file size
Keep file size less than 30k if you can.
Exact dimensions
Crop and reduce the size of images to fit the dimensions of the space in your web page.
Correct file format
Online photos are usually .JPG.
Flat-color images like logos and clipart are usually .GIF and sometimes 8-bit .PNG.
Graphics with true transparency need 24-bit .PNG.
Reduced resolution
Monitors render 72 or 96 pixels per inch (ppi); the standard is 72ppi.
Color Mode
RGB for .PNG and .JPG and Indexed for .GIF.

At the completion of this tutorial, students will be able to:

  1. Understand why we optimize images.
  2. Change the five specifications with various software.

The main purpose of optimizing images for online viewing is to reduce the time it takes a browser to display an image file in its correct size. Visitors to web sites do not want to wait for photos and other graphics to load; they want instant reading and viewing. Updating the dimensions of images to fit within the scroll area of a browser is also helpful because visitors want to view an entire image in one glance without scrolling around to see it. And they don’t want graphics to overlap other important information on the page.

In addition, web site servers around the world would fill up too quickly if we all loaded large graphic files onto them because we were unskilled at reducing the file size. To keep from filling up our allotted server space, we will reduce the file size, dimensions, and resolution, and save in the proper format.

Example files and their properties

The three most common file formats for the web are .GIF, .PNG, and .JPG:

Tools and Tutorials for optimizing images

For any of these tutorials, have ready a digital file of your photo, art, or graphic.