5 Tips On Optimizing Images for Web Performance and SEO
When it comes to the art of web development – there are some irrefutable truths. Among these truths is the fact that an engaging website uses imagery to enrich and diversify the user experience. Of course, as with most things in life – incorporating images into your website is not as simple as it sounds. Much like written content, the images used in the development and design of a website need to be optimized.
Don’t act so surprised. You didn’t just wander onto the blog of a digital marketing agency expecting to avoid the world’s greatest acronym (SEO, of course).
Every image used on your website needs to be optimized in 3 ways – more on these later.
- Images load quickly for every site visitor
- Images are good quality
- Search engines can easily crawl and index images
Images require as much care and thought as written content – maybe even more, given their technical nature. Regardless of the nature of your site, from blogs to online stores and standard websites – image optimization will help take your brand and content to the next level.
Why Are Images Important For SEO?
Images play an important role in website user experience and can make or break a brand’s sales funnel. HubSpot research revealed that people are 80% more likely to stay on a website that includes images as opposed to text with whitespace, and are 64% more likely to remember the content of the site. Images, when used correctly, are engaging and have a substantial impact on things like bounce rates, the time spent on each webpage, and buyer behavior.
Correctly optimizing an image can also have a direct impact on SEO. Users will read the page on a surface level, while search engine crawlers will read things like metadata, file names, and alt tags. This data is transmitted to the crawlers and has an effect on webpage ranking and search results.
#1 – Image Size Matters
Humans are an impatient bunch, which means if your website doesn’t load properly within seconds, you will more than likely lose a sale. Nearly 50% of consumers report that they will not wait 3 seconds for an eCommerce site to load. That gives your webpage a generous 2.9 seconds to load completely – or your leads are toast. This means that the assets on your site need to be optimized to load quickly…especially images, which tend to eat up a large amount of space. Image and file sizes should be compressed as small as possible without drastically diminishing the integrity of the image.
Image size reduction is best accomplished via Adobe Photoshop or comparable photo editing software. In Photoshop, you can select a “Save for Web” setting that will adjust the size to the lowest appropriate file size. If Photoshop isn’t an option, a good size for standardization is below 70 kb. It will be difficult to shrink larger images down to this size – but you can always refer to file types to find a balance between file type and file size if all else fails.
#2 – Image and File Types Also Matter
The images that you choose for your web pages need to be relevant to the content within. If you’re a pastry chef trying to raise awareness on your culinary prowess, don’t fill your pages with pictures of footwear, alligators, and Yetis. This should go without saying – but relevance and quality go hand in hand. Once you storyboard the images you want to use – you can focus on functionally optimizing them for load speeds and visual quality.
The 3-4 character file types associated with image files (JPG, JPEG, PNG,GIF) aren’t just alphabet soup. Each file type has an optimal function and purpose within the context of your website. A good general rule of thumb for guidance on file type is to use JPEG and JPG for photographs, while logos and “flat” graphics should be saved as PNGs. When dealing with GIFs, it’s important to remember that they are lower quality than JPEG images but are great for supporting animation.
eCommerce businesses should use JPEGs because they provide the best quality for the smallest file size. GIFs can be used as thumbnails or decorative images, but are not practical for large product shots.
#3 – Name Your Images Correctly
Search engines do a lot of crawling. More crawling than the spider you saw in your bedroom last night and couldn’t track down again. They crawl the text on web pages and – you guessed it – image file names and metadata. Instead of defaulting to the names assigned to images by your camera or computer – you need to create descriptive, keyword-rich file names for image optimization.
For example: If you upload a photo of a horse, don’t keep the general file name NIKON01294.jpg, instead pick something more descriptive like Clydesdale-Horse.jpg.
Think like a user when naming your images. What would a consumer or lead search for? Do some research on common related search terms and name accordingly.
#4 – Use Alt Tags
Once again catering to search engine crawlers, it’s advised that you provide alt tags for the images you use on your website. These tags are essentially succinct descriptions of your images that will appear in lieu of the image itself when a browser has loading problems.
Alt text also tells crawlers what your page is about, so it’s important to use keywords. Many content management systems (CMS) like WordPress offer an alt text field, which makes it easy for those who don’t like to use HTML.
If you are a fan of HTML, adding basic alt text is easy. Simply add alt=”your alt text here” to the image tag.
#5 – Add Images to Your Sitemap
Blacklab said it best when they sang, “We’ve only just begun to learn to crawl”. They probably weren’t talking about search engine crawling, but the sentiment is there. It’s probably easy to tell that search engine crawlers are kind of a big deal for all types of SEO, whether it be for text or images. That’s why the fifth and final tip of this primer to optimizing images for web and SEO involves yet another crawler booster.
Google encourages website owners to submit a sitemap to assist in crawling your webpages, which ultimately gets them added to the index. This allows for the inclusion of images in a sitemap or allows ones to create a separate image sitemap to submit to the search engine giant. Providing Google with as much clear information as possible on your page content and images will increase your page’s visibility, by allowing your images to appear in Google Image Search as well as the standard results page.
This is a lot of information. If you’re still struggling to get your website fully optimized for Cyber Monday or every day functionality, Roger West can get the job done. Let’s talk.