Adapting Images for the Internet

As the internet evolves into the most popular medium, we too, have to evolve to adjust the expansion.

As the internet evolves into the most popular medium, we too, have to evolve by adjusting to the expansion.

As our digital age evolves, more information is being placed on the Internet. Hard copies of books, documents, and other forms of media are rapidly disappearing. The Internet has quickly become the world’s number one source for information and archival data. With this change in information access, people everywhere are noticing they too have to adapt to this massive virtual expansion.

Adapting to Virtual Expansion

Teachers are placing classroom material online for students, companies are doing business from their websites, newspapers and television networks are broadcasting their content online, and even the government is keeping the country informed with websites and email updates.

It is no surprise then, that the content we place on the Internet must also be adapted to accommodate the fastest loading speeds, and highest quality possible. This can be tricky for many Internet users, since there is no real rule of thumb for preparing material for the Internet.

Images on the Internet

Since images are usually the slowest elements to load online, I figured this would be a good place to start.

As a graphic designer, it is imperative that I adjust the images I’m working with if they are going to be placed on the Internet.

Here are some pointers that I’ve picked up and researched along the way.

When placing images onto the Internet, reduce the image size to 72dpi.

When placing images onto the Internet, reduce the image size to 72dpi.

72 dpi

Most images from the Internet are already at 72 dpi, dots per inch. However, images from digital cameras, scanners, and stock-photo websites tend to have a higher number, or more dots per inch. The higher the number, the slower an image is to open.

So before you post an image on the Internet, reduce the dpi to 72.

If you want to print an image, make sure the image is around 120-300 dpi for increased clarity.

Tip #1: Keep two separate images in folders: One at 72 dpi for inserting into webpages or sending over the Internet as attachments, and one at a higher dpi for printing.

Tip #2: Add onto the title of the image with a number that matches its dpi. For example, the photo titled “christmascard.jpg” should be title “christmascard_72.jpg” and “christmascard_200.jpg”

Dimensions

Another way to insure that an image opens in less than 7 seconds is to change the dimensions of the image.

Most images from a digital camera are around 24 by 16 inches, which is enormous. Change the dimensions to a smaller small size like, 6 inches by 4 inches, or whatever size you want on the web.

Change the size or dimensions before you insert the image. This way the image will load quicker than if you shrink it after it is already inserted into your web page.

256 Colors

The next way to help the image load faster is to reduce the number of colors to 256.

Any more colors are unnecessary on the Internet, since most computers only support this specific amount.

Depending upon the editing program you are using, sometimes there is an option to “save the image for web.” This will reduce the number of colors for you. But it’s always good to do it manually, just in case.

Editing Software

To edit images for the web, software designed specifically for the editing of images is definitely needed.

Purchasing Software

The industry standard for editing images is Adobe Photoshop. Adobe Photoshop also makes a cheaper, but limited version of their program called Adobe Photoshop Elements. This program is made for the purpose of editing images quickly and simply.

Macromedia Fireworks is another purchasing option. Macromedia Fireworks is about two hundred dollars cheaper than Adobe Photoshop. It is made specifically to optimize graphics, and create prototypes of websites and application interfaces.

The good news is, if you are purchasing software for educational use there is usually a substantial discount.

Free Software

There is also a variety of free image-editing software on the web. I talked about some of them in one of my previous entries on Art Technology. However, there are also a ton more.

Advertisements

3 Comments

Filed under Uncategorized

3 responses to “Adapting Images for the Internet

  1. Pingback: free online scanners | Digg hot tags

  2. Pingback: photoshop elements graphics free | Digg hot tags

  3. hi thanks for this! it could help alot…

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