Bluehost Web Hosting Help

Optimizing Your Images

Problem:

How can I optimize my images?

Solution:

Bitmapped (or Rasterized) Graphics

When producing new versions of any graphic, always use the original to make each new version. This will retain as much of the quality as possible. Always ensure that the image mode is on RGB color.

Each time a graphics package shrinks an image, it reduces the number of colors , therefore reducing the quality. So if you use the original every time, you will always get the most colors possible.

Unless the image is a vector image, you can't create a good quality larger version as there won't be enough colors to render the image at the same quality.

Once a graphics package, such as Adobe Photoshop or Adobe Fireworks , has optimized the graphic, you cannot get back to the original quality. GIFs are indexed color and JPGs may have have their quality reduced to shrink the file size.

There will always be a sacrifice between quality and file size. A smaller file size will result in faster download times.

Re-sizing Images in a Web Page

Never use the width and height attributes of the < img > tag in the HTML of a web page to resize images. If you use this method to reduce the image size, you will increase the download time of the page as a whole. This is because the browser has to "re-draw" the image at an incorrect size which takes longer.

Avoid using the same technique to increase the size of an image. It severely reduces image quality as well as taking longer to download. Use you favorite graphics software to re-size your images properly and include the correct width and height dimensions for a faster download. The result will be a better looking website as well as faster download times.

Knowledgebase Article 92,694 views bookmark tags: images optimize (updated 2096 days ago)


Was this resource helpful?

Did this resolve your issue?


Please add any other comments or suggestions about this content:





Recommended Help Content

Optimizing MySQL: Queries and Indexes Article 1 of 4

Optimizing MySQL: Queries and Indexes Article 1 of 4 Courtesy of: Ian Gilfillan Badly defined or non-existent indexes are one of the primary reasons for poor performance, understanding and then fixing (updated 1011 days ago)

Optimizing MySQL: Queries and Indexes Article 3 of 4

Optimizing MySQL: Queries and Indexes Article 3 of 4 Courtesy of: Ian Gilfillan Ordering by surname is a common requirement, so it would make sense to create an index on surname. But in this example o (updated 1402 days ago)

Optimizing MySQL: Queries and Indexes Article 2 of 4

Optimizing MySQL: Queries and Indexes Article 2 of 4 Courtesy of: Ian Gilfillan Some knowledge of how indexes work allows you to use them more efficiently. Firstly, note that when you update a table w (updated 1401 days ago)

Related Help Content

Optimizing MySQL: Queries and Indexes Article 4 of 4

Optimizing MySQL: Queries and Indexes Article 4 of 4 Courtesy of:Ian Gilfillan Most systems need to be highly optimized for selects - take a news site which performs millions of queries per day, but w (updated 1401 days ago)

Optimizing images

Optimizing images by reducing size but keeping quality. (updated 1599 days ago)

MySQL Repair / Optimize Tables in phpMyAdmin

How to repair and optimize your database using phpMyAdmin: (updated 1089 days ago)

Images Not Displaying On Website

Why don't my images display on my site? (updated 2077 days ago)

Agora Cart Images not loading

Images in the Agora shopping cart not showing or showing broken link images. (updated 2095 days ago)

cPanel Image Manager

How do I view Thumbnails of images in a directory? How do I scale images? How do I convert an image to a jpg, gif, bmp, or png? (updated 2061 days ago)

Optimizing WordPress

Tips and tricks to make your wordpress blog load faster (updated 430 days ago)

Right-Click Image Protection

How can I protect the images on my website? (updated 1425 days ago)