search marketing

How to Optimize Photos for Faster Load Times, Better Search Rankings

Written by Paul Steinbrueck

Throughout Church Website Photography Month, we’ve been encouraging you to take great pictures and publish them on your church website.

One problem when adding photos to a website, however, is they can dramatically slow down the load time of a website.

This results in a bad experience for visitors often causing people to leave the website frustrated, and it’s also bad for search rankings. Google has made it well known that page speed is a factor in its search ranking algorithm

Our observation is that un-optimized images are almost always the biggest problem causing a website to load slowly. Therefore it’s critically important to understand…

How to optimize photos for faster load times and better search rankings

1) Determine the ideal width for each photo

The smaller a photo is, the smaller its file size is, and the quicker it will load. However, if you make a photo smaller than the space on the website in which it is placed, it will either look odd with too much white space around it or the viewer’s web browser will stretch it to fill the space and it will look pixelated or blurry. Therefore, it’s recommended to resize photos to the width of the content area they will be displayed in.

What makes this tricky is most websites today are “responsive,” which means they automatically resize to fit the viewers screen.

To find the ideal width, maximize your web browser to the full width of your computer screen. Then measure the width of the content area using this online tool that can measure anything on any web page.

For example, we used the tool to determine the width of the content area in this blog is about 600 pixels. (See below)

If you are adding a photo to the background of a page or an image slider that spans the full width of the web browser, We recommend an image width of 1,920 pixels. Currently about 98% of people use a screen that is 1,920 or smaller.

2) Resize the photo

In a previous article, we wrote about our favorite free, online image editing tool, Pixlr, which you can use to resize an image in less than a minute.

The vast majority of the time, we recommend resizing photos to the width of the content area as we explained above.

One exception is if you need to fit an image in a small content area (like this blog post) or a photo gallery but you want people to be able to click on the image to see a larger version of it. In this case, if the image is larger than 1,920 pixel wide, it’s still best to resize it to 1,920

3) Optimize the file format and quality

If a photo is saved in the .PNG format, converting it to .JPG format will reduce the file size of the photo by 70-90%. The JPG image format also has a quality setting which can reduce the file size of an image. The lower the quality, the lower the file size, so there is a trade-off. But most photos can be saved with a quality setting of 70% to 85% without a noticeable decrease in quality to the viewer.

Remember…

We’re obsessed with speed. -Google

Click to share this image on Facebook, Twitter, Pinterest or Instagram

If you want to evaluate your website’s load time, GTMetrix is a great tool for that. It even provides recommendations to improve the load time of your website.

We here at OurChurch.Com are also obsessed with speed because it leads to better search rankings and better living out your mission online. If we can help you with the SEO of your church website or Christian website, let’s schedule a time to discuss it – no cost, no obligation.

Are the photos on your website optimized for speed? Post a comment and let us know.

About the author

Paul Steinbrueck

Paul Steinbrueck is co-founder and CEO of OurChurch.Com, husband, father of 3, blogger. You can follow him on Twitter at @PaulSteinbrueck.

2 Comments

Leave a Comment

What is 5 + 6 ?
Please leave these two fields as-is:
IMPORTANT! To be able to proceed, you need to solve the following simple math (so we know that you are a human) :-)