What is Image Optimization in SEO?
Image optimization is the process of editing your web page images in order to increase the overall speed and visibility of your website. Image optimization falls under on-page SEO and deals with optimizing image size, alt tags, and file types to be more SEO-friendly.
Why should you optimize your images?
Having images on your website makes your web pages more appealing to the human eye and are an important part to any websites design.
Images can help to tell your brands story and better explain a message that you’re trying to convey to your audience.
But what if the images you’re adding onto your web pages are negatively affecting the user experience of your website?
Unfortunately, this may just be the case.
Naturally, most images have a large file size and adding those images onto your website can increase the amount of time it takes that page with the image to load.
Testing it out
In order to show you how much an optimized image can help improve your page speed we did a little test.
First thing we did was download an image from UnSplash (highly recommended if you’re looking for free high quality images).
The image we chose had a file size of around 1.57MB as shown in the picture below.
The next thing we did was create a test page on our website, added the unoptimized image, and analyzed the page with Google’s PageSpeed Insights.
The test gave us a score of 71 for desktop and 25 for mobile devices.
Which isn’t awful but at the same time it isn’t as fast as it could be as every second counts when it comes to the load time of your pages.
Now it was time to optimize the image and see the results.
Using Squoosh, a free image compressor, we compressed the file size of the image to a more reasonable 540KB.
When optimizing your image,s always remember that you don’t want to sacrifice quality.
You have to find balance between getting that ideal compressed file size while maintaining adequate image quality.
Next we swapped the non-compressed image for the compressed one and and re-analyzed the test page.
Even though this test may not have been 100% accurate, it still shows that compressing your image size does help to improve the overall speed of the page with the image.
How will this benefit your website?
Optimized images do more than just look appealing and can not only increase your websites load time, but also rank on search engines and increase your websites visibility.
As briefly mentioned above, optimizing your images has 2 main benefits
- Faster page load time: With properly optimized images, users won’t be turned away by slow loading pages and be more inclined to stay on your website.
- Increased website visibility: Not only can editing Image ALT tags allow your product or decorative images to appear on image search results, but can also help to improve the overall ranking of your various web pages. Search engines consider page load speed as an essential parameter for user engagement, making it a key page ranking factor. The faster the page loads, the higher it could rank on search engines.
How to go about optimizing your images
Now that you know why optimizing your images is good idea, how do you go about doing this?
Well keep reading as we’ll be going over different ways to go about optimizing your various images.
Choose the right file type
First things first, before you jump straight into editing your images it’s important that you use the best file type for your various images.
There are many different file types for images and using the wrong one can mean a poor quality web image, a giant download or even a missing graphic in an email or on your website.
Here are several of the most common image file types:
- PNG – Produces higher quality images, but also has a larger file size.
- GIF – The best choice for animated images.
- JPEG – Uses lossy and lossless optimization. You can adjust the quality level for a good balance of quality and file size.
Beyond those 3 file types, JPEG XR and WebP are more efficient, next-gen format options.
JPEG XR and WebP image formats have superior compression and quality characteristics compared to their older JPEG and PNG counterparts.
However, JPEG XR and WebP are not yet universally supported by all browsers so ideally we recommend using the JPEG format for images with lots of color and the PNG format for simple images.
Edit image ALT tags
ALT tags, also known as “alt attribute” and “alt description”, is an HTML attribute applied to image tags to provide a text alternative for search engines.
One of the main purposes of ALT tags is to describe the image or what an image is representing.
This is for the benefit of visually impaired users who use screen readers when browsing, those who surf the web with images turned off, or users that have text only browsers.
Having image ALT tags are important for the purpose of aiding people who can’t see an image and for the benefit of possibly having your images appear on search engines.
Here’s Google’s advice on choosing a good alt text:
When choosing alt text, focus on creating useful, information-rich content that uses keywords appropriately and is in context of the content of the page. Avoid filling alt attributes with keywords (keyword stuffing) as it results in a negative user experience and may cause your site to be seen as spam.
For WordPress, editing the image ALT tag can be done directly when you upload an image or by going to the “Media” section in your WordPress dashboard on the left sidebar.
On Shopify, this can be done by going to the product image and clicking the three dots as shown in the image below.
Compress and resize images
Most high quality images naturally have larger file sizes, which impacts the amount of time it takes the page with such images to load.
However, compressing and resizing your images is a great way to reduce your page load time.
There are many ways to go about compressing and resizing your images, here are just a few options…
- Compress Image: Compresses and resizes images
- Squoosh: Compresses images (This is what we usually use to compress our images)
- TinyJPG: Compresses images
Using one of these tools, you can compress or resize your images for free before placing them onto your website.
Use a plugin
If you already have tens of hundreds of images on your website it may seem like a very daunting task to go through each one in order to properly optimize.
Well there’s no need to stress, there are many different plugins out there that will go through your websites images and compress and resize them for you.
Some of these plugins include:
- Imagify Image Optimizer
- ShortPixel Image Optimizer
- EWWW Image Optimizer Cloud
- Optimus Image Optimizer
- WP Smush
These plugins make it easier to optimize a large amount of images at once and can save you both the time and stress.
We recommend checking each plugin out and using the one that best suits your needs.
Conclusion: What is Image Optimization in SEO
Image optimization is a key aspect of your website that shouldn’t be neglected.
Although it may seem like having unoptimized images on your website is better than nothing, unoptimized images on your web pages may do more bad then good.
Using the points mentioned in this article, you can easily optimize your images so they can not only be used as a visual component that compliments your website, but also as a key SEO aspect which can help bring more customers to your website and improve your websites ranking on search engines.
Let’s work together!
We’re one of the leading full service eCommerce agency in Toronto. Our passion is in helping small to medium size businesses reach their goals through eCommerce. We’re looking forward to speaking with you, contact us today or check out the SEO services we offer here at Verdure Digital.