Consider the last time you updated your website with a picture. You probably got it from a stock photography source, uploaded it to your site’s backend, and then incorporated it into the page.
Isn’t this an excellent example of image optimization? That’s not the case.
You’ve put a huge bowling ball weight to your site, which is slowing it down. Furthermore, without alt text, search engines will not be able to understand your photographs.
Let’s make a change.
According to Jumpshot statistics from 2018, Google Images accounts for over 20% of all web searches in the United States.
Both SEO novices and experts agree that optimising photos for your website is time well spent.
By optimising one of his photographs, Dan Morgan of WebSpection was able to reach #1 in Google Images for “greatest person in Cardiff” in less than four days.
Robbie Richards, on the other hand, produced 150,732 visitors by using image alt tags, compressing pictures, and other SEO techniques.
You’re squandering a vital SEO tool if you don’t optimise your images properly.
It’s as if the search engines are handing out free Oreos and milk. You, on the other hand, only take the Oreo. In actuality, the Oreo is far superior when dipped in milk.
Image optimization has several benefits, including improved user experience, quicker website load times, and increased ranking prospects. It’s a function that’s growing increasingly vital.
Gary Illyes’ comment on picture search in a recent Reddit conversation, as Matt Southern pointed out:
“We just believe that media search is underappreciated for what it can accomplish for publishers, so we’re putting more engineers and outreach behind it.”
But, in order to guarantee that your photographs are searchable and don’t slow down your site, what variables are most important?
These are the 12 most significant picture optimization strategies you should be aware of.
- Select the Correct Format
Decoding all of the different picture formats might seem like ordering Taco Bell for the first time. However, before you begin uploading photographs to your site, be sure you’ve selected the proper file format.
While there are several image formats to pick from, the most popular for the web are PNG and JPEG.
PNG: Produces higher-quality pictures, but the file size is bigger.
JPEG: Image quality may suffer, but the quality level may be adjusted to achieve a suitable balance.
WebP: This is the only picture format supported by both Chrome and Firefox, and it allows you to choose between lossless and lossy compression.
PNG is the unsung hero of image formatting in my opinion. However, for my everyday use, I prefer PNG, which I then convert to WebP.
If you use.jpg pictures inside an inline SVG format, be aware that Google’s algorithms will not index them.
- Compress Your Photographs
Yes, nothing makes hell rage like a huge web page caused by an uncompressed picture.
You can’t honestly contemplate placing that on your website, right? Search engines will look at your web page like you might look at a large vat of Crisco.
According to HTTP Archive, graphics account for about 21% of the total weight of a webpage.
As a result, I strongly advise compressing your photographs before posting them to your website. This may be done in Photoshop or using a programme like TinyPNG.
You may use TingPNG’s WordPress plugin as well.
WP Smush, on the other hand, is my WordPress plugin of choice. It decreases the size of the image file without sacrificing quality.
Make sure that any plugin you use compresses the pictures externally on their servers. It alleviates the strain on your own website.
Use an image CDN that recognises the device and optimises the picture before to delivery to take it a step further. Cloudinary and Imgix are two alternatives to consider.
By compressing pictures, Increasingly.com increased website performance by 33% /2 seconds.
I mean, there’s something seductive about a speedier page speed when your graphics are compressed.
I recommend utilising Google’s PageSpeed Insights tool if you’re not sure how your images are influencing your page performance.
- Make your own images
You want your images to stand out on your website. If you use stock photography on your website, you’ll appear generic, much like the millions of other websites that don’t stand apart.
There are just too many websites using the same generic stock photographs.
Consider a corporate website, a consultancy firm, or a company that values customer service. All of these websites employ a stock image of a businessman smiling that looks almost identical.
I’m sure you’ve seen something similar like this:
Even if your stock photographs are fully optimised, they won’t have the same impact or SEO advantages as a high-quality original image.
The better the user experience and the greater your chances of ranking on relevant searches are, the more original photographs you have.
Keep in mind that Google Discover is more likely to show huge photos.
According to Google’s Advanced SEO site,
“Large pictures must be at least 1200 pixels wide and enabled by either the max-image-preview:large option or AMP.”
Use a different picture than your logo.
- Check For Copyright Conflicts Regardless of the picture files you utilise, ensure sure there are no copyright issues.
In an image copyright complaint, the USPS will pay $3.5 million. Skechers was also sued for $2.5 million.
You risk a costly lawsuit if Getty, Shutterstock, DepositFiles, or another stock picture supplier owns an image you use and you don’t have a permission to use it.
If you have breached any copyright concerns, you may be issued a notice under the Digital Millennium Copyright Act (DMCA). If the owner of a piece of content notices it on your website, they have the right to submit a DMCA Takedown, which you must honour.
Google Images lets you filter results based on whether they’re free to use, and Mindy Weinstein lists 41 websites where you may find them.
- Change the names of the image files
When it comes to SEO, it’s critical to have descriptive, keyword-rich file names.
It’s like getting a burrito with no filling if you don’t change the name of your picture file. It’s simply plain bad.
The picture file names inform Google and other search engine crawlers about the image’s subject matter.
The file names will usually be something like “IMG 722019” or something like. It’s the equivalent of ordering from a menu in a foreign language. It’s not going to benefit Google.
To assist search engines comprehend your image and boost your SEO value, change the file name from the default.
Depending on how large your media library is, this may take some time, but changing the default picture name is usually a good idea.
Assume you have a picture of chocolate, for example.
I could just call it “chocolate,” but if you sell chocolate online, you could call each image “chocolate-1,” “chocolate-2,” and so on.
To help visitors and search engines comprehend the image, I titled it “dark-chocolate-coffee.”
- Create SEO-Friendly Alt Text Alt tags are text alternatives to pictures when a browser is unable to show them properly. The alt property, like the title, is used to explain the contents of an image file.
When an image fails to load, an image box appears with the alt tag in the upper left corner. Make sure they go with the image and add to the overall impact.
It’s also a good idea to pay attention to alt tags as part of your overall on-page SEO strategy. All other optimization areas should be in place, however if the picture fails to load for any reason, users will see what the image is meant to be.
Additionally, by linking keywords with pictures, adding proper alt tags to your website’s images will assist your website obtain higher search engine rankings. The importance of alt text in photographs has even been acknowledged by Google.
It supplies Google with relevant information regarding the image’s topic matter. This data is used to help us choose the best image to return in response to a user’s inquiry.
Individuals who are unable to examine photos themselves must use alt text, which is mandated by the American Disabilities Act. Users can be alerted to what is in the photo by using informative alt text. Let’s assume your website has an image of chocolate on it.
The alternative text may be something like this:
/> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> />
However, the following might be a better alternative wording for describing the image:
/> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> /> />
The cached text version of the website includes alt text, which is useful to both users and search engines. When the picture connects to a separate page on the site, the alt text can be used as the anchor text of an internal link for further SEO value.
- Consider the file structure of your image files.
Google’s Image Guidelines have been changed. One of the major updates they announced was that they now rank images based on the file path and file name.
The file path and file name are, once again, a real ranking factor.
Instead of storing all of your product photographs in a general /media/ folder, I would consider arranging your subfolders to more category relevant themes like /shorts/ or /denim/ if you’re an online firm with several goods.
- Improve the title and description of your page
Google also revealed that their picture search algorithm includes your page title and description.
All of your fundamental on-page SEO elements, including as meta data, header tags, page text, structured data, and so on, impact the way Google ranks your photos, according to the Google support website.
It’s like piling all of your favourite toppings onto a burrito. With guac, it’s even better. As a result, make sure to include the guac if you want to improve your image ranks.
- Decide on the dimensions of your project.
You must declare your picture dimensions in the source code if you’re utilising AMP or PWAs.
Even if you’re not utilising either, defining the width and height is still a good idea. It gives the user a better experience.
Furthermore, it enables browsers to resize images before the CSS is loaded. This prevents the page from bouncing during the loading process.
Image dimension parameters are particularly critical for avoiding Cumulative Layout Shift (CLS) difficulties, which might cause problems with Core Web Vitals optimization.
It’s critical to make sure that every image and video element has width and height characteristics.
This instructs the browser on how much space to set aside for the resource, avoiding the unpleasant content moving that decreases your CLS score. More information may be found here.
Make Your Images Mobile-Friendly (No. 10)
Oh, SEO for mobile devices. It can result in a high bounce rate and low conversions in the worst-case scenario. However, at its finest, it may provide you with more ranking power and improved user engagement.
How can you optimise your photos for the mobile-first index, though?
Fortunately, Google provides guidelines for picture best practises.
In a nutshell, you want to make photos that are responsive. This ensures that the picture will resize to fit the site’s size, whether the viewer is on a desktop or a mobile device. It adapts to the device’s size.
Mozilla provides a detailed explanation on how to use the srcset and sizes properties to supply extra source pictures to the browser, allowing it to show same image content scaled for the device.
It’s critical to format each line with a distinct portion of the property value, as seen in this example from their resource:
img srcset=”elva-fairy-480w.jpg 480w, img srcset=”elva-fairy-480w.jpg 480w, img srcset=”elva
sizes=”(max-width: 600px) 480px, (max-height: 600px) 600px, (max-height: 600px)
alt=”Elva in a fairy costume”>
Here’s more on how to use srcset for responsive images.
- Include Images in Your Sitemap Whether you’re adding photos to an existing sitemap or establishing a new sitemap just for images, you’ll want to include images in your sitemaps.
Including your photographs in a sitemap boosts the likelihood of search engines scanning and indexing them. As a result, there is an increase in site traffic.
If you’re using WordPress, Yoast and RankMath both have plugins that include a sitemap generator.
- Incorporate Structured Data
Use structured data markup to help Google and other search engines produce better visual results. If you add structured data to your photographs, Google may be able to present them as a rich result.
If you use schema markup on a product page and identify an image as a product, Google may associate that picture with a price tag. To deliver the proper image, search engines bypass the algorithm and rely on the information supplied in structured data.
Takeaways from Image Optimization
So, before you start submitting your image to your site, make sure you complete the above image optimization routines.
The most critical factor is that the picture and replacement text are appropriate for the page. Other important takeaways include:
Select the appropriate file format. For screenshots, PNGs are my preferred format.
Reduce the file size to make the website load faster.
Make sure your picture matches your on-page SEO features (meta data, structured data, etc.).
Create an image sitemap or make sure your photos are included in your sitemap for better crawlability.
Image optimization is no laughing matter. With developments in voice search technology, media is becoming increasingly important, and following the methods above will help your whole site.