• Compressing an image is simply the process of minimizing the number of bytes of the file without diminishing the quality of the graphic.
  • Improperly using an alt attribute for the sole purpose of adding keywords is not a practical technique.
  • Photographs of landmarks, local attractions and other events you have attended over the years are great additions to your portfolio.

Get Inman via Facebook Messenger
Our top headlines delivered once a day.
by CareyBot

No one wants to look at a poorly designed website with blocks of text and bad images — least of all, potential homebuyers and sellers. Imagery is key to attracting website visitors and turning them into clients.

Buyers want to see the meat on the market, and sellers want to know that their homes will be marketed with care and great imagery.

Critiquing the process of image optimization for your website can help improve the performance of your site and more importantly improve the experience for the user.

Adopting some of these good image habits can reflect a more user-friendly website.

5 tips for image optimization

Let’s take a look at some of the basic actions that should be routine when adding images to your website.

1. File size and image compression

Compressing an image is simply the process of minimizing the number of bytes in the file without diminishing the quality of the graphic.

Properly doing so allows for a better user experience. This reduces the overall time to fully download the page, and the user is still left with a good quality image.

example of how to improve image optimization

If you do not have access to Adobe products such as Photoshop, there are image compression tools available online for you to use. This is an image-optimization must and can drastically help improve page load speed.

2. Different file types

Some of the most common file types that you will notice across the web are JPEG, PNG and GIF. Deciding on which one to use might be difficult at first, but many bloggers have sided with using JPEG as their default choice.

JPEG
With .jpg, you have more flexibility to compress the image because of the way it’s formatted, which means you are less likely to lose quality from the photograph.

One mistake that some might make is saving their logo as .jpg. This can cause the logo to look blurry and grainy.

Logo example of PNG vs JPEG

PNG
As mentioned above, PNG is more suited for smaller images such as a logos because this file type tends to be larger in size but greater in quality. Plus, the ability to be saved and uploaded with a transparent background can be beneficial as well.

GIF
Graphics interchange format, also know as GIF, is commonly used for short, animated graphics.

The size of the graphic and its number of frames will determine how large the file will be. These files are not necessarily ideal for photographs because the more colors that are being used to improve the quality will greatly increase the file size of the image.

Personally, the only time I use .gif is when creating gifographics. If you are not familiar with what a gifographic is, here is an example of one I created about the process of buying a home.

3. Alternative attributes

Commonly referred to as an “alt tag,” the original purpose of an alt attribute is for screen readers and browsers to decipher what the image is by reading the text-based description.

Example of Alt Attributes

Improperly using an alt attribute for the sole purpose of adding keywords is not a practical technique.

Instead, focus more on using an image that is properly related to the text and helps support your article. This will avoid any need to improperly name the alt attribute.

4. Image captions

Users today tend to scan articles for things such as titles, bold type and images. When a user scans over an image with a caption, he or she is more likely to read the text in the caption.

This does not mean you need to add a caption below every single image on your website, but consider adding them to monuments, landscapes, photos of people and textbook descriptions.

5. Stock images versus real images

When creating a blog post, you want your article to be as authentic and original as possible.

proper use of Image CaptionsStock images work if you do not have an actual photograph to use. However, it’s ideal to have a library of your own images.

Photographs of landmarks, local attractions and other events you have attended over the years are solid additions to your portfolio.

Nathan Garrett is a real estate agent at Garretts Realty Group – Coldwell Banker McMahan Co. Connect with him on Facebook or LinkedIn.

Email Nathan Garrett.