If you’re a blogger, you probably already know how important it is to add quality, relevant images to your posts. Photos, illustrations, and other images help make your content more attractive and divide text blocks well. You should always use at least one image per article and multiple images if your articles are long.
Images not only make your content more enjoyable to read, but they can also help you with on-page SEO. In this article, you will learn how to make sure all the images you use on your site are optimized for filename, size, alt text (very important!), Subject relevance, location, etc.
In this comprehensive step-by-step tutorial, you will learn everything you need to know to properly optimize your website images for SEO.
Let’s start, will you?
Selecting the right image
Before you start optimizing images, you first need to find the right ones for your post (or page). A good image will have the same themes as your blog post, help showcase your writing, and effectively improve your reader’s experience.
There are many websites with free photos that you can use, including the following:
- flickr (Creative Commons Extended Collection)
- FREE IMAGES
- public domain files
Then you can further refine your results as follows: image size; aspect ratio; colors in an image; type of image; Region; site or domain; SafeSearch (you can use it to filter explicit results); type of file (.jpeg, .png, .gif, etc.); and finally the rights of use.
Depending on the rights of use, you want to filter the results by “free or shared use, even commercial” or “free use, exchange or modification, even commercial”.
This is a very useful tip for finding quality images that you can download, resize, and use in your blog posts.
With some search terms, you may not be able to find images that you can freely reuse for commercial purposes. It really depends on what you are looking for.
Note: Before reusing content found through Google’s advanced image search on your website, please verify that your license is legitimate and read the full terms of reuse. In some cases, the license may require that you give credit (in the form of a link or otherwise) to the creator of the original image.
Choosing the best file format
When selecting the most suitable file format for your images, you should choose the one that saves the smallest file. Usually, JPEG files will be smaller than PNG files, but this is not always the case.
What I do: With Adobe Photoshop, I resize my image to fit the width of my post or the page’s content area, then I select Save For Web & Devices. Once in this window, I switch between JPEG-High and PNG-24 and see which gives the smaller file type. For photos, JPEG is always smaller and should be used. For graphic text or other images, PNG is usually smaller.
Mixing it up
Try to keep an open mind when searching for images on websites (and generally in life, too). DO NOT just look for photos, but try to mix them up a bit by using different types of illustrations on your site.
Use a good combination of the following types of images:
- illustrations, paintings and drawings
- tables, charts and diagrams
- infographics or other graphics that you design yourself
- Animated gifs
- screenshots (works especially well for tutorial articles)
Use descriptive file names
When saving images for use on your website, be sure to name them descriptively. You want to make sure you’re using keywords that are relevant to the image and content you’re writing about.
Keywords should always appear naturally, whether in file names, alt text, blog posts, or page titles. Never include keywords in your content as this will not provide any benefit and may even result in a penalty for Google.
If you have a photo of a smiling child, it is better to name the file smiling-child.jpg rather than leaving the original file name (for example, _DSC0428.jpg). Make sure that when naming your files, you separate words with a hyphen (your-file-name-as-this.jpg), because Google (and Bing also interpret this hyphen as a space) .
Naming your images with precision is one way to help Google find them more easily. This means better overall visibility of your website in the search engines. All of these optimized images add up to help your website perform better.
Write captions when needed
You can also use captions on images, but only if their inclusion provides valuable information for your readers. When people browse your posts, they tend to look at the images and read the captions below. Be sure to take this opportunity to capture their attention by writing eye-catching and informative captions to accompany your images.
Some are for illustration purposes only and absolutely do NOT require a caption. With each image you use, ask yourself if a caption will add value to your website visitors. If the answer is no, then you don’t need it.
Make sure to use alt text
Alt text (short alt text) is an attribute that is added to an HTML image tag. It appears in an image container and allows the image to be described to search engines when it cannot be displayed.
Screen readers also use alt text to help visually impaired people navigate the Internet more easily.
Descriptive alt text (in bold) in the image link below helps identify the image in search engines (are people really using anything other than Google?)
<img src=”https://mlgulxlroqec.i.optimole.com/5ojBCQs.2M5G~1aa2a/w:auto/h:auto/q:90/https://www.mprstudio.com/wp-content/uploads/babe-ruth-original-new-sepia.jpg” alt=”Add sepia tone to an image in Adobe Photoshop” />
So be sure to add descriptive alt text to your site images and include keywords naturally.
Pay attention to the location of the images
When adding images to your post, be sure to place them near the associated textual content. I usually use multiple captions and place the associated images nearby. It’s a good way to split the text and make blog posts easier to read and more visually appealing.
Correct image size
The width of the content area of my site is 665 pixels, so I size my images accordingly (sometimes even smaller).
Website speed plays an important role in both SEO and user experience, so it’s imperative that your site is fast for your visitors. Images play a big role in how quickly your website loads, so be sure to size them correctly.
If you upload images that are 4288 x 2848 pixels in size and display them at 600 x 400 pixels by modifying the source code, it will seriously slow down your website (and needlessly take up a lot of server space).
Since you are using WordPress, all images you upload are responsive by default. This means that you need to resize your image to the width of your desktop site’s content and that it will serve in smaller sizes for visitors on all devices including tablets and smartphones.
That’s what I do
I use Adobe Photoshop to resize my images, then I choose Save For Web & Devices and I select jpg or png, whichever image type and smaller file type is. Then I use EWWW Image Optimizer to compress my image files further. It’s a free plugin that works great and even allows for bulk image optimization.
Compress your files
After formatting your images successfully, you can further reduce the file size by compressing them. There are several ways to do this, and since you are using WordPress, you can use a plugin.
There are several different plugins, including the following:
EWWW Image Optimizer – This is my plugin for compressing image files, and I highly recommend it. All the images you upload to your media library will be automatically optimized and you can use its bulk optimization tool to compress any files that were uploaded before installing and activating the plugin.
Compressing and optimizing Smush images – WP Smush is available in free and premium versions. It also automatically compresses all images uploaded to your media library and has a bulk optimization option, allowing you to optimize 50 files at a time with the free version.
The free version of WP Smush uses lossless compression, but if you buy the pro version you can use lossy compression (called Super-Smush) which further reduces the file size with minimal loss of image quality.
Kraken.io – With the Kraken API, you can optimize .png, .jpg, and .gif files. To configure the plugin, you must first create a free account on kraken.io. Once registered, you will receive an API and a secret key that you can use on different WordPress sites.
Kraken’s default settings ensure that your images are compressed using a smart lossy compression technique, which was created to dramatically reduce file size without drastically reducing image quality. You can manually enable lossless compression in the settings.
Compress JPEG and PNG images: Unlike other plugins already mentioned, this one offers lossy compression methods ONLY. It doesn’t offer too many configuration options in the settings, but it does allow you to choose the maximum resolutions for the images you download and choose exactly which image sizes you want to compress (e.g. thumbnail, large , etc.).
Why compress images on my website?
Your website pages will load faster which will get your visitors excited. Higher website speed can also lead to higher income, especially if you have an eCommerce store.
Site backups will take less time due to the smaller file sizes.
You will save hundreds of kilobytes per image and therefore use less bandwidth.
In addition to the plugins I mentioned above, there are a variety of online image compression tools that you can use, including:
As you learned in this article, optimizing your images for SEO involves a number of steps and things to consider. Take the time to properly prepare the images on your website and make it easier for them to be indexed by search engines.
I hope this article has provided you with useful information that you can use to easily optimize all images on your website. If you have any questions or comments, please leave them below. I will do my best to help you.