Being Freed
Being Freed
Being Freed

SEO for Images

Applying thoughtful SEO to images improves page load speed, user experience, and search engine ranking. And only takes a few minutes.
A graphic with the following words: SEO for Images - JPG, WebP, Sizing, Descriptions, Captions, PNG, Alt Text, SVG, Files names, and Coloring for all types of sight.

What is Image SEO

Whether they’re graphics or photos, most web images can benefit from a little SEO.  If you take just a few steps when uploading, search engines will reward you for your efforts. 

Simply put, image SEO is the practice of sizing, compressing, formatting, and labelling images so they’re most useful for, well, everyone.  Taking a few simple steps when uploading images makes your page load faster, takes pressure off of your server, and gives your visitors a better user experience.

In the timeless words of Indigo Montoya, let me sum up…

Make sure images are the right size

Larger files are slower – we all know this.  And while we want images to be crisp and clear, we need them to load quickly, increasing your page load speed so viewers don’t click away in a huff. 

You only have a few seconds for your page to load before people roll their eyes and move on, so it’s important to increase your page load speed as much as possible.  Properly sizing your images will help with this.  A lot.

A good question to ask yourself is: what is the largest size the image will display on any screen?  The answer to that question gives you the dimensions for your image.  If it’s never going to appear larger than 300px wide, make it 300px wide.  Simple.

Another bonus of sizing images properly is keeping your carbon footprint down.  The smaller your file sizes, the less energy it takes to store and serve your site.  Check out my post on Your Site’s Carbon Footprint for more info.

It is possible to change an image’s size inside of WordPress, but I prefer to size images before loading them to the media folder.  I use Adobe Photoshop or Illustrator, but you can use any number of apps to change file size, including Paint and Pictures on your PC.  If you don’t have an app on your computer, do a search for “free image size reducer” and you’ll find plenty of apps that can help.

If you do want to edit media in WordPress, from the Dashboard go to Media, then hover over the image you want to add words to and select Edit.

A screenshot of the WordPress interface for editing an image. It has an arrow that points to the edit button.
To edit an image from the WordPress Dashboard, hit Media, then hover over the image, select Edit, then hit the Edit Image button.
A screenshot of the WordPress interface for editing an image. It has an arrow that points to the edit options buttons.
From the edit screen, you can crop, rotate, and resize images.

File formatting

As of publication of this article, WebP is the recommended file format for WordPress websites.  Files in this format are small and load quickly but retain their image quality.  A couple of the articles I’ve linked to later in this post haven’t been rewritten recently enough to reflect this update, but hopefully they’ll edit and catch up soon.

My website host, SiteGround, gives me the option to change all my images to WebP right in the WordPress interface.  To date, my procedure has been to size and save all my images as png’s, upload them to WordPress, then convert them in the SiteGround Optimizer plugin.  I’m currently experimenting with saving them as WebP’s right from Adobe, though, so we’ll see how that goes. 

For more on image formats, see my post here.

Compress images

Compressing images does just what it sounds like; it fits a ten-pound cat into a five-pound box.  Smaller file sizes help servers move data faster – the fewer 1s and 0s they need to load, the quicker they can be.

There are so many ways to accomplish compression, but I let WordPress and SiteGround do it for me. 

Scrolling back up to the images above, you’ll notice at the bottom of the panel, there’s a field for compression.  I set that to high.  I also use SiteGround’s Optimizer plugin to compress images. 

A screenshot of the SiteGround Optimizer - Media panel in WordPress. It shows several fields where you can optimize images for SEO, including Image Compression, Use WebP Images, Lazy Load Media, and Maximum Image Width.
Here’s a screenshot of the SiteGround Optimizer – Media interface for my website

File names

Here’s a place where most websites can improve their image SEO.  How many times have you downloaded a meme to your phone to find the name is an incomprehensible string of letters and numbers?  Sometimes the platform you’ve downloaded it from has given it this name, but sometimes it was the people who created the image.  They’re missing an opportunity to increase their influence.

Name your images so they make sense and boost your SEO.  File names are seen by people who download them and are an excellent place for you to add your company name, a bit about the image, or a bit of whimsy.

Labeling images for accessibility & SEO

Aside from file names, there are three other places you can add text to images: alt descriptions, captions, and descriptions.  These fields help search engines understand your images and they allow those who use page readers know what’s on your site. 

WordPress provides a simple and clear interface for adding text to images.  The first thing I do when starting a post is to upload images and add verbiage.  That way when I’m ready to build my post, they’re ready to go.

From the WordPress Dashboard go to Media, then hover over the image you want to add words to and select Edit.

A screenshot of the WordPress interface for editing media. It shows the image plus fields for File Name, Alt text, Caption, and Description.
If you can fit your keyword naturally into the verbiage on your images, do so.

For more information on how to tailor words for each of these fields, see my post on image labeling here.

Designing graphics so everyone can see them

Designing graphics for colorblindness may not affect your SEO per se, but I can’t write a post on images without mentioning it.  When you produce graphics, make sure everyone’s eyes can see all the elements.  What does that mean?  See my post on images and color blindness here.

Knowledge is power - check out these links!

A quick note here.  As of publication date of this post, the Mailchimp and articles I’ve linked below are surprisingly outdated.  I’m including them here in hopes that they edit the articles in the near future.

Like my posts? Toss me a tip!

digital nomad hiker drysuit diver queer woman sober ukulele player scorpio Tough Mudder goofball

Freed with her ukulele while scuba diving

All content © by Freed

Want to know more about what I do?  When I have a new post?  Where I’ve been lately?  (I do get around.)  Sign up for my mailing list below.  I promise to not fill your inbox with junk.