Preparing Images and Photos for the Web

Here are some guidelines for making your images download quickly and display correctly.

Preparing Images

To prepare images for presentation on the Web, follow these steps:

  1. Begin a new file. If it’s a photo or original artwork, use 300 dpi as the resolution. If you are creating something simple, set the resolution to 72 dpi.
  2. Use the drawing, text, shape and other tools provided in the graphics program to create your image. Can you explain more what the Drawing tool would do? 
  3. Save your file in the native file format (a file type meant for editing that is specific to the image editing program) of the program you are using. If you need to make a change or edit later, do it in this file rather than on the Web.
  4. If necessary, lower the resolution of the image to 72 dpi.
  5. If necessary, resize the image to the height and width specifications desired.
  6. Save the file in a Web-ready file format, usually a GIF (most programs give you several choices for file types), finding a balance between the way the file looks and an appropriate file size. Some image programs will let you preview the final file output, whie in others, you have to save it and load it in the browser to see the final effect.

Preparing Photographs

To prepare photographs for presentation on the Web, follow these steps:

  1. Download the photo from your digital camera or scan in the photograph. The process for this varies depending on the software bundled with your scanner or camera. The image will probably end up in "Your Photos" on Windows, or the "Photos" folder on a Mac, unless you chose some other folder as the default destination.
  2. Use the color correction, drawing, text, shape, and other tools provided in the graphics program to alter and improve your image.
  3. Save a copy of your file in the native file format of the program you are using. Make later changes or edits in this file rather than on the Web. With photographs, save an untouched version of the photo in case you want to use it again for another purpose.
  4. If necessary, lower the resolution of the image to 72dpi.
  5. If necessary, resize the image to the height and width specifications desired.
  6. Save the file in a Web-ready format, usually a JPEG, finding a balance between the way the file looks and an appropriate file size.

Making images Web-ready is all about compromise. In general, the better your image looks, the larger the file size will be. The larger the file size, the longer it will take to download. Your job is to find a compromise between quality and file size. Some things to consider are:

  • Is this image conveying crucial information? If so, go for higher quality.
  • Is the image on a page with a lot of other images? If so, make the file size smaller.
  • Will your Web visitor be able to detect that the quality of a photo or image isn’t very good?
  • Make images of people fairly high quality because visual acuity is strongest with people’s faces. 

> READ NEXT ARTICLE: Checking and Changing Resolution

 

recent comments

    Be the first to comment on this page. You must register before you can leave a comment.


post a comment

You must be registered (free) in order to post a comment.

 

More on This Topic

Evaluate This Page

How useful was this article?
(5 is extremely useful)

rate this a 1 rate this a 2 rate this a 3 rate this a 4 rate this a 5

Others have rated
this article: 7.0 / 5

discuss this topic

Post a comment

on Online Libel Issues

Here are some good tips for avoiding online libel attacks:

http://michael-roberts-mile2-xellex-mile-2.com/Michael_Roberts_Mile2_Libel.html

on Writing and Editing a Blog

I was searching for blog editing and found this article to be helpful. People love bullets and lists in blogging. I also found an blog editing site that looks interesting as well http://www.quickpostedit.com where they charge for editing by the word more or less. If I didn’t have an editor for a girlfriend maybe I would use it. winkAs for the editing of comments I only every edit the curse words out, I think that if they have bad grammar that reflex poorly on them. My blog is primarily about marketing not editing so I don’t get to up tight.

on Polls and E-mail Surveys

why do we poll? well, just to know what most of the people wanted or like. just like if we make a poll about the candidacy of the next president of the United States, we will know who among the candidates are most loved by the people or who they want to rule them…
___________________

cutie_tech123
A team of successful entrepreneurs credited for http://www.SelectWealthSystem.com
A new home-based-business marketing system that provides the strategic high ground for internet marketing.
Pro Team Marketing uses an automated marketing system that is currently promoting a cutting-edge young company, entering the early growth stage, that targets the largest consumer base in the United States with their financial educational products.
http://www.SelectWealthSystem.com

on Planning Site Content and Organization

There is a new link for the calpoly page on content organization:

http://warc.calpoly.edu/planning/conceptualization/content_organization.html

on Creating a Basic SWiSHmax Animation

you forgot to add to click the motion path before moving the object..