Images are an integral part of the modern real estate website. They account for the majority of elements on an average page; and whether those images are optimized, plays a big part in the performance of a website.

Why Is Website Image Optimization Important?

Bad User Experience

Large, bulky photos take a considerable time to load. Slow loading pages negatively impacts bounce rate because visitors lose patience and leave the site. Each “bounced” visitor is the loss of a potential lead.

Page Speed Infographic

Poor SEO

Not only do visitors dislike a slow loading website, Google does too. Slow sites are not indexed as well as quick loading websites are by Google.

Also, images present an opportunity to increase search engine optimization by including valuable keywords.

What Is an Optimized Image?

Image Size (Weight)

Size refers to the number of kilobytes or megabytes the image file weighs. Photos directly from a camera or smartphone can be several megabytes in size. Images optimized for the web will be a fraction of that.

Save images in the correct file format (JPG for photos, PNG or GIF for logos) and compress the files to reduce image size. Part 2 of this blog series will cover image editing tool options.

Image Dimensions

The length and width of an image play a large part in the weight of the file. Large images will weigh more.

Resize images to the actual dimensions needed for the page, rather than using the WordPress Media Library to make a huge image fit a small space.

Alt Tags

Including keywords in image alt tags scores extra SEO points. Describe each image using the WordPress Media Library to improve Google search result placement.

File Names

The names of the image files are also seen by Google. Be sure to give files a name that includes keywords before uploading to the website.

Is There a Page Size Issue?

The average web page weighs 3MB. Real estate web pages tend to weigh a bit more due to MLS content, but 3MB should be the goal.

Pingdom.com offers a free website speed test that makes it easy to identify page size problems. This test is on a per page basis, so it will need to be run multiple times to analyze an entire website.

Pingdom Website Speed Test

The total “page size” is clearly presented.

The report shows the total size of images on the page. Image request provides a quick reference as to the number of images on the page.

Pingdom Content Type

Tip: The quickest way to reduce the weight of images on a page is to remove unnecessary images. Keep only the photos that add value.

Which Images Need Optimizing?

There are numerous free tools that help identify images that need optimizing. Each tool presents different information in particular ways. Choose a combination of the options for a complete picture of the images on a page.

Google PageSpeed Insights

Google provides website image optimization suggestions through their free PageSpeed Insights tool. Both the desktop and mobile experiences are analyzed.

PageSpeed Insights

The “Optimize images” section provides the total possible reduction in weight; as well as, the possible reduction for each image on the page.

PageSpeed Insights Image Optimization

 

Website Speed Test

Website Speed Test is another tool that presents the total weight of images on a web page and the potential weight reduction with optimization.

Website Image Optimization Analysis

The image details show file name, image size, and dimensions providing a fairly complete look at each image.

Website Speed Test Image Optimization

 

Developer Tools Audits in the Chrome Browser

The Chrome browser has page auditing tools built in. Right-click anywhere on a page and choose “Inspect”. In the Developer Tools panel, choose the “Audits” tab.

Developer Tools In the Chrome Browser

The “Properly size images” section shows each image’s size and potential savings when optimized.

 

Developer Tools Website Image Optimization Audit

 

View Image Info (properties) Extension for Chrome

Download View Image Info (properties) from the Chrome Web Store. Right-click any image on a page and choose the “View Image Info (properties)” option to open a details window.

View Image Info for Chrome

The details window displays all website image optimization factors for that image (file name, image dimensions, file size, alt tags).

View Image Info Photo Details

 

Web Developer Extension for Chrome

Another useful extension from the Chrome Web Store is Web Developer. This tool displays valuable information next to each image on a page.

Web Developer Options

Easily identify images without alt tags.

Web Developer Alt Tags

Identify the dimensions needed for resizing image before uploading.

Web Developer Image Dimensions

 

What About MLS Photos?

Completely optimizing a real estate web page with MLS images is close to impossible. Listing images added to a site through an IDX can’t be optimized. It is up to the MLS to optimize the images before they serve them to the IDX service. In extreme cases, listing images can be a megabyte or more each.

Since MLS image size can’t be controlled, it is important to use IDX widgets strategically. In many cases, less is more. Including multiple featured listing widgets could really bloat a page’s size quickly.

 

Optimizing a website’s images is one of the easiest ways to improve the user experience and attract new visitors through Google searches. Part 2 of this blog series will offer tools to optimize images.

 

Listen to this post...
Voiced by Amazon Polly
Agent Evolution Real Estate Marketing Solutions

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Sign up for Newsletter

Get notified about the new ideas, tutorials, and product updates.