Author: Mordy Oberstein
Updated: November 30, 2022
In addition to engaging users and compelling them to make a purchase, good image use can help improve your search visibility and branding. However, image optimization goes well beyond the content of the image itself. To really take advantage of what images can do for your site, you need to consider how they affect your site’s performance and how discoverable they are to search engines.
To that end, here is what you need to know about image optimization and what Wix does to optimize your images.
What image optimization means
In a nutshell, image optimization is the process of making your images discoverable and rankable by search engines, as well as aligning image use with optimal site performance.
To illustrate this, let’s take a look at the role that images play and what image optimization can do for your users and your business.
Why image optimization matters
Properly optimized images can help improve your site’s user experience by appealing to visual learners and making your content more digestible. Good image optimization can also help keep your load times down. Your image optimizations can even be the difference between a positive and negative experience for users that rely on screen readers (more on this below).
Images are also important from an SEO perspective. Believe it or not, images can be a great source of traffic to your website. This is all the more true as, over time, Google has introduced more features to the SERP that prominently include images.
As I touched on above, images are also a major part of how your site loads and performs—images that are too large can slow your site down, as can having multiple image galleries on a single page. That means they need to be formatted and rendered properly, and that best practices should be followed whenever you add images to your site.
What Wix does to optimize your images
Clearly, image optimization is an integral part of your site’s overall optimization process, and a key factor in how well it performs. With that in mind, here’s what Wix does to optimize your images as well as what it enables you, the site manager, to do.
Image compression
As mentioned, large image files can result in your page not loading as quickly as it could. To prevent this, Wix automatically resizes and compresses your images, in most cases. This is done without sacrificing the quality of the images.
Perhaps more importantly, this process takes place on the server side. Without getting into all of the technical details, this enables Wix to serve the number of pixels actually needed to produce a quality image and no more. That makes it easier for the images to load quicker than they would otherwise.
You should be aware, however, that Wix does not compress images that are over 25MB. If you’re working with image files this large, you should compress them on your own before uploading them to your site.
The optimal image format
In 2010, Google released WebP, a format that enables images to load faster without sacrificing image quality. Image files that are in the WebP format can be anywhere from 25%-35% smaller than they would have been as a PNG or JPEG. That can have a significant impact on how quickly a page loads.
Wix automatically converts the images you add to your site to WebP. Even so, there’s more to consider: Image compression is relative to the original size of an image. If, for example, Wix’s conversion of your images to WebP reduces the file size by 25%, that’s 25% of the original file size.
That’s why it’s important to upload images in JPEG form when possible. A JPEG image is significantly smaller than the equivalent PNG image and can therefore be compressed to an even smaller size (however, there are times when PNGs are the preferred format, such as when you need a transparent background, for example).
While there is some quality loss when using JPEGs instead of PNGs, in the overwhelming majority of cases, it is not significant nor impactful.
Optimized image loading
How images load, or more technically, how they are rendered can have a big impact on both the page’s overall performance and the user experience. To that end, Wix does the following to automatically support optimal image rendering:
01. Low-quality image placeholders (LQIP): If large image files slow down a page’s loading time, Wix uses low-quality image placeholders. These are versions of the images you uploaded that don’t use nearly as many pixels. As the page loads and becomes interactive, the full pixel load is displayed. Basically, it means a version of the image, using very few pixels, initially loads so that the page can be rendered very quickly. As the page is rendered, that low-quality placeholder is then replaced with the high-quality, compressed version of the image you originally uploaded.
02. Lazy loading: Lazy loading basically means that images will only load when they come into view on the browser. Think of it like this: You have 20 images on a page, but only two of them appear above the fold (the area of the page that is visible when the page first loads). Now, all 20 of those images could be rendered, but what for? No one is going to see the majority of them until they scroll down (if they scroll down). With lazy loading, the only content that loads is what the user needs to see. In this case, the two images that appear above the fold will load, while the other images will only load as the user reaches them upon scrolling. The result is a faster overall page load and improved user experience.
Using low-quality placeholders in conjunction with lazy loading is a powerful combination: As a user scrolls down the page and images load (as a result of lazy loading) a low-quality version of the image is immediately available.
This way, the user at least sees some version of the image as they scroll down and, before they even blink, the full version is loaded—all while limiting the number of initial items to be loaded, thereby improving page speed.
Does this mean you can do whatever you want with your images? While Wix does a lot to improve performance in this area, images are resources that need to be loaded and there’s no getting around that. So, while Wix automatically compresses images, converts them to WebP, leverages LQIPs, and lazy loading, nothing can change the fact that more resources to load are simply more resources to load.
This is why having multiple image galleries on one page, for example, can slow down how quickly that page loads. If gallery-heavy pages are a must for your site, consider implementing “load more” buttons so as to only show a few gallery images upon the initial load to help improve performance.
As another example, GIFs are also generally larger files. So, be strategic about using them (or too many of them) on a page, or a GIF and a gallery on the same page, etc. You can get the most out of Wix’s image optimization capabilities by being strategic in how you go about image placement on your site.
What you can do to optimize images on Wix
Half of the image optimization equation has to do with your site’s performance while the other half is all about your images being indexable and, ideally, highly visible on the SERP.
Of course, there’s also the need to make your site accessible, and how you optimize your images has a lot to do with that as well. Let’s dive into it.
Add image alt text
This is where SEO and accessibility converge. Alt tags, also known as alt text, are the written description of what is portrayed in the image. Think of it as the written version of the image or the title of the image, if you will. It tells visitors who can’t see the image (including search engine bots) what the image is about.
Think of visitors that may have visual impairments—they might use a screen reader to turn your written content into audio content. What happens when that reader reaches an image? If there is alt text, the reader will read the description of the image aloud. This enables a visually impaired user to understand what is on the page.
It also helps search engines in the same way. When a search engine reaches an image, it can read the alt text to understand what that image represents.
Does this mean you should write long-winded descriptions of all your images as part of your alt text? No.
To start, think about alt text from the perspective of someone who is visually impaired—not search engines. Would such a person want to hear an entire paragraph about the image? Probably not.
Be descriptive but succinct: If, for example, you have a picture of waffles on your site drenched in syrup, then alt text like waffles with syrup is far better than five waffles stacked on top of each other with a heap of Canadian maple syrup drizzled everywhere with a tad of powdered sugar on top.
This will help you with search engines and, more importantly, increase your site’s accessibility.
Use captions to provide context
If you want to write something more descriptive, save it for the caption. A well-worded caption not only helps your readers better understand and interpret the image, it can also help search engines.
Search engines can use the text surrounding the image to contextualize what that image is. Use captions whenever you can (so long as it is done in a natural way).
Image optimization is a joint effort
As you can see, there is a lot that Wix automatically does to help optimize your images. At the same time, the image optimization process depends on several factors, from the type of file you upload to how you name your images.
By keeping these factors in mind and being strategic in how you implement images, you can save time and reap the full benefits of what Wix does for you on the back end.
Mordy is the Head of SEO Branding at Wix. Concurrently he also serves as a communications advisor for Semrush. Dedicated to SEO education, Mordy is one of the organizers of SEOchat and a popular industry author and speaker. Twitter | Linkedin