Using images on your website or blog makes sense for several reasons. It creates a richer, more engaging experience for your readers, makes your content more ‘shareable’ on increasingly visual social media platforms, adds context to your text quickly, and when properly optimized, can improve your search engine rankings.
Great images can also be a valuable source of high quality traffic through platforms like Google Image Search – especially useful, for example, if you run an online store and have lots of product images which could entice someone in the market to buy what you're selling to click through to your website.
The problem, of course, is that using too many large images on a page can decrease load times substantially, which is definitely not good for SEO. Here we take a look at how to optimize your images for the web and search engines without this happening.
Optimizing images for SEO and user experience:
Make use of appropriate image file names, alt text and captions
While Google’s machine learning image identification tools are becoming pretty impressive indeed, they're not perfect yet – which means you should still be making use of good alt tags – even if only to help visually impaired users get more value from your website. Simply put, your image file name and alt text should give a brief description of what an image contains, making use of your focus keyword if its relevant but without trying to stuff in a whole lot of keywords, as this can get your site penalized for being ‘spammy’.
Include additional information if it’s helpful – ‘yellow marigold flower’ rather than just ‘flower’ in your alt text, for example. If you're dealing with product photos, including a serial number is also a good idea. Captions allow you to add more context and explain why the image is relevant to the broader subject matter or what you're discussing at that particular point on the page. These three combined – file name, alt text and caption – helps search engines get a better understanding of all the content on your page and therefore rank for related searches.
If you have an older website and suspect you’ve missed this part, there are free tools like the Screaming Frog SEO Spider tool which will crawl your site and identify missing alt text and attributes for you so you can go back and fix them. If you’d rather not have to deal with all the technical aspects yourself, it’s well worth hiring an experienced SEO company like Ruby Digital to get it done right.
Use original images and screenshots when possible
An original photo taken yourself will always provide more value than a generic stock photo. They also allow visitors to get a peek behind the curtain and make your brand seem more approachable and relatable – especially if you're discussing your team members or how your products are produced.
If you don’t offer the kind of service that it’s easy to take original photos for – let’s say an accounting firm – screenshots are a great way to provide visual information, especially if you're explaining a technical or complex process. Infographics are another excellent way to summarize what you're talking about in a visual format and tend to get a lot of shares on social media compared with other forms of content. There are also plenty of great tools for making infographics out there, many of them entirely free.
Optimizing images for quality and load time:
File types:
Generally, you’ll encounter three main preferred formats for image files – jpeg, png, and gif. Generally, jpegs are best for photographs, and png format for graphics or images which are mostly text. GIFs or animated images are great for injecting a little humor and fun to a page but should be used sparingly as they can be distracting!
Using the ‘save for web’ function in most design programs like Photoshop (or its free equivalents) is the simplest way to end up with an image that’s small in size but still decent quality. If you're using a platform like WordPress or a dedicated eCommerce platform, there are usually built-in features to help you, but check with your provider to make sure.
File size:
As a general rule of thumb, small images on your website should be no larger than 300kb in size, and very large images (like your background) no more than 1MB. If you're using your own photos taken with a digital camera, your original files are almost certainly going to be a lot larger than this. If you don’t have the option to “save for web” or download in a ‘web-friendly’ format, you can use an online image compression tool to do so.
And finally, use a tool like Google PageSpeed Insights or Lighthouse to test your site speed and get suggestions.