As a blogger, we often forget to optimize images uploaded in a post. We simply upload it without being worried about its size, tags, etc. We try to concentrate on the writings, but eventually forget how important the images are. Images are the face of a blog post. We often have that misconception that only keywords are important within a blog post. But, that’s not true! From a reader’s perspective, an article is only valuable with valuable contents. We should first try to write for our loyal readers, then cleverly for search engines. With image optimization and in-depth writings, your blog posts will shine for sure.
Why Image Optimization is Important for SEO
In a single sentence, Image optimization not only helps in improving page load speed, but also boosts websites’ SEO ranking, and improves user experience. About 60% of a website comprises images. And obviously, if not properly optimized these images will make a site heavier to load.
Almost 50% of internet users love to read those websites that load within 2 seconds. No doubt hosting plays a critical role in this loading speed, but your images too have a great impact on it. If we are somehow able to reduce the size of these images without reducing the image quality, then it will have a direct positive impact on page load speeds and user-experience of visitors on your website.
Here are 11 Tips to Master Image Optimization for SEO,
1. Use Appropriate and Descriptive Alt Tag
The alt tag is the actual description of the image in short form. Browsers display alt text if there’s a problem rendering images.
What Google says about it and how it’s used to show what a well‐written alt tag looks like.!
Be sure to add alt text to every image you use, and make sure the alt text includes the SEO keyphrase for that page (if appropriate). Most importantly, describe what’s in the image so both search engines and people can make sense of it. The more relevant information surrounding an image has, the more search engines deem this image important.
2. Optimize Images with Compressed Size without Losing Quality
As stated earlier, about 60% of a website comprises images. And obviously, if not properly optimized these images will make a site heavier to load.
Try to reduce the size of the images by its minimal value without losing their quality. Try to do it with desktop image editors like Photoshop rather than free plugins. Plugins work in some predefined rules. Their way of working might destroy the quality of your images. One of the best ways you can reduce the file size without affected quality is within Adobe Photoshop’s “Save for Web” functionality.
Within Photoshop, you can resize the image before saving it, making the file size more appropriate for user experience. Photoshop has preset for you to choose image quality, ranging from 1.38MB to 86k. Generally, somewhere in the middle will not affect resolution or increase page load speed.
3. Proper Naming of Images
Google isn’t a human. You should do everything in your power to help them understand your images. Appropriate naming of an image will help Google to understand the subject matter. Try to make your filename a good description of the subject matter of the image. For example, Bluehost-hosting-review.jpg rather than Screenshot123.jpg. The first one has a lot more information about the subject matter.
Do not do keyword stuffing. Just keep your filenames descriptive and straightforward.
4. Descriptive Caption
The caption is the text that appears — usually in a gray box — below the image, explaining what you see in the picture. While the words in your article may not be read, chances are high that the text under your image will be read.
Captions are beneficial because not all images are understood right away, and the function adds context for the image to provide more context for the search engines to understand (aside from your alt text). Captions see up to 16 percent more readership than text, according to Poynter Research, which can prove to be valuable to readers.
5. Use the Appropriate Image
An image should be able to convey the message of the original subject matter. Unnecessary uploading of an image with keyword stuffing will ruin the future of your content. Using an image and using the right image, both are different. If your content needs the image to depict the message accurately, please add. But do not add any image just for the sake of doing it.
It is also a bad practice to use stock images. Stock images will look unoriginal as many other websites would be probably using the same pictures. Always try to add some uniqueness to your images. You can get the help of your designer, and if you don’t have one, then you can use some excellent online tools such as Canva, Pixlr, etc.
6. Use the Correct Image Format
The most commonly used image formats are JPEG, PNG, and GIF. These three image formats account for 95% of the total images on websites. But you should use these formats as per their specific use case to churn the maximum benefits.
JPEG image format is a lossy compression specification and is best suitable for the captured photographs. The compression for JPEG images works by averaging out the colors of nearby pixels. But if your images contain texts or lines, JPEG wouldn’t be a wise choice.
PNG is a lossless image format and is best for texts, logos or charts. PNG images look sharper than JPEG. GIF is also a lossless image format and is used mainly for displaying animation. Choosing the right image format can be of great use in optimizing your website images.
7. Use XML Image Sitemap
Before adding anything, let’s check what Google says about it,
Now, you might wonder how to create XML image sitemaps. If you are a WordPress user, I would recommend Yoast SEO for this purpose.
8. CDN has a Negative Effect on Image SEO
Everyone that uses CDN (Content Delivery Network) know how fast a website loads after using it. As we stated earlier that 60% of a website’s size is consist of images. And if 60% is loaded from the CDN, automatically your site will load faster.
But, by placing your images on a CDN, you are most likely removing the image from your domain and placing it on the domain of the CDN. So when someone links to your image, they are actually linking to the CDN domain.
As we all know, how important those natural backlinks are and the more backlinks you have, the better your site does in the search engines.
9. Display Responsive Image
Let’s assume that you have inserted an image with 720px width. If someone visits on a mobile device with a much smaller display, say 320px‐wide, then their browser still has to load the 720px image. That image will look perfectly fine. But so would a 320px‐wide image.
Do you see the problem? Loading the 720px image is a waste of bandwidth and serves only to slow down how fast the page loads. That isn’t good for SEO.
The solution is to use srcset.
This is a magical piece of HTML code that tells the browser to load different versions of an image for different screen resolutions.
Here’s the syntax,
<img src="image.jpg" srcset="image-medium.jpg 1000w, image-large.jpg 2000w">
In this context, I prefer to use WordPress. It takes care of everything regarding this. For each image you upload, WordPress makes these versions by default:
Thumbnail: A square crop (150px by 150px).
Medium: Resized so that the longest side is 300 pixels wide or high.
Medium Large: Resized to 768 pixels wide.
Large: Resized so that the longest side is 1024 pixels wide or high.
Full: Original image.
10. Utilize Lazy Loading Feature
Lazy loading is where the browser defers the loading of images (or any other objects—video, etc.) until they need to be shown on screen. Other images are loaded as and when they need to be loaded—i.e., as you scroll. Eventually, it makes page loading faster which is good for SEO.
Let’s check what Google says about Lazy Loading,
Pagespeed Insights, which is also owned by Google, also recommends Lazy loading.
If you are using WordPress, you may use any one of the several plugins available for Lazy Loading.
11. Make Your Images Social Media Optimized
If you’re providing valuable content and information to your audience, they will share the content on social media. From Facebook to Twitter, content is shared and links are distributed.
When you have the HTML code set up for Open Graph (OG) and Twitter Cards (found in the Yoast plugin in WordPress), you can guarantee the image will appear on the social platforms each time your link is shared.
For OG tags, you can set the image you want within WordPress, but also create your own meta property in HTML. Add the tag to the <head> section of your page, so it looks like this:
For WordPress Users, Yoast SEO plugin has a Social section where you can set and even – in the Premium version – preview your Facebook and Twitter posts. Make sure you use a high-quality image, like the original image you used in the post, as the social platforms use higher quality/larger images more often than not. If you have set this up correctly, and it doesn’t work, try to flush Facebook’s cache in the URL Debugger. Twitter Cards do the same for Twitter and are also generated by this plugin.
While writing an in-depth article we have a tendency to neglect the images used. This mistake not only plays a vital role in SEO but also hamper on Traffic generation.
With Google getting better at recognizing elements in images every day, it makes sense to make sure the image and all its elements contribute to good user experience as well as SEO.
Image SEO is a tough topic to cover. I might forget to mention some important tips in the article. Feel free to share your thoughts on the comment section below
You May Like To Read: Ping Sites for Faster Indexing of Your Site