To consider the importance of visual search in 2021, let’s start with an example.<\/p>\n
The other day, I Googled “how to conduct a vlookup in Excel”. I skimmed a few articles but still felt dissatisfied \u2014 I didn’t want to read about vlookups, I wanted to see <\/em>it.<\/p>\n Enter: The power of images.<\/p>\n Once I clicked on “Images”, I found what I needed quickly:<\/p>\n<\/p>\n I know I’m not alone. In fact, nowadays, half of all Google searches end on the search results<\/a>\u00a0page, without the user clicking through to any results.<\/p>\n In 2021 and beyond, it’s critical marketers begin paying attention to the importance of visual images as a powerful opportunity to reach new audiences on the SERPs.<\/p>\n Plus, as HubSpot’s Marketing Manager Kristen Baker told me, “After running an image experiment on the HubSpot Blog, I discovered that ranking in Google’s image packs increases impressions and clicks to our content.”<\/p>\n But … easier said than done, right?<\/p>\n Here, let’s explore what image SEO is, and the best practices you’ll want to follow to make your webpages more discoverable in image search results.<\/p>\n <\/a><\/p>\n As a quick refresher: Alt text is written copy that describes an image. For instance, if you click on Pipcorn’s popcorn product<\/a> and inspect the page, you’ll see the alt text describes the product image accurately as “Popcorn Family Pack Popcorn Pipsnacks LLC”:<\/p>\n<\/p>\n Alt-text plays two critical roles in SEO.<\/p>\n First, alt text \u2014 also known as alt tags, or alt descriptions \u2014 helps search engine crawlers index your website more effectively, which has a positive effect on search results.<\/p>\n In fact, Google states on its Developers page<\/a>, “You can aid in the discovery process by making sure that your images and your site are optimized for Google Images \u2026 [and] increase the likelihood that your content will appear in Google Images search results.”<\/p>\n Second, alt text improves the user experience. Alt text can describe an image to a visually impaired reader, and also helps if a reader can’t load or see the image correctly on their device.<\/p>\n To get a full run-down of how to write high-quality alt text, take a look at Image Alt Text: What It Is, How to Write It, and Why It Matters to SEO<\/a>.<\/p>\n Captions aren’t typically necessary if the context of the page can help readers understand what the image is depicting \u2014 for instance, in this blog post I haven’t used any captions because I’ve used text to introduce each image I’ve shown.<\/p>\n However, if you have a visual-heavy website, consider using captions to help readers understand an image in context. For instance, on Tom Hull’s photography portfolio<\/a>, he captions his images so viewers can contextualize where, or what, the image represents:<\/p>\n<\/p>\n Use good judgment when it comes to adding captions, but if you feel it can help readers (and bots) better discern an image, then it might be a worthwhile addition to a page.<\/p>\n Compressing images is a vital component of any good website optimization strategy.<\/p>\n Why?<\/p>\n Because, simply put, it helps your web pages load faster<\/a>, which provides a better user experience and also helps boost your website’s search engine rankings.<\/p>\n To compress your images effectively, try a tool like Attrock\u2019s Free Image Compression Tool<\/span><\/strong><\/a>, Compress JPEG<\/a>,\u00a0or Squoosh<\/a>.<\/p>\n Typically, less than 100 KB is ideal in terms of good file size.<\/p>\n However, it’s important to note \u2014 Google doesn’t look at each individual image size. Instead, it looks at total<\/em>\u00a0page size.<\/p>\n So, if you have a small image where quality differences are less substantial, then you might try compressing that image to 30-50 KB \u2026 which gives you extra room to keep another image 30 KB bigger, particularly if that image loses quality after compression.<\/p>\n If you’re still worried about image quality after compression, take a look at How to Ensure Your Images are High Resolution<\/a>.<\/p>\n Ultimately, Google (and readers) prioritize original content \u2014 which means, if you’re hoping your images will rank on image results pages, it’s vital you use original, unique images.\u00a0<\/span><\/p>\n This is particularly important if you work for an ecommerce website and you’re posting visuals of your product. Many shoppers use images to shop for consumer goods. In fact, 50% of online shoppers say images<\/span><\/a> helped them decide what to buy.<\/span><\/p>\n If your image doesn’t accurately demonstrate your product, it will get buried under better, higher-quality images from competitors.\u00a0<\/p>\n Consider using products like Canva<\/span><\/a> to design in-house infographics, graphs, or animated images to help your brand stand out on search results pages and make your images more shareable.<\/span><\/p>\n Your file name can impact how easy it is for search engine crawlers to interpret your image, so it’s helpful to rename your file before <\/em>uploading it onto your webpage.<\/p>\n Rather than keeping the name a generic “IMG_0883”, try using relevant keywords to describe what’s in the image, similar to your alt text. This can also help ensure your image appears on the image search results page, which will increase traffic to your site.<\/p>\n Responsive images are critical for ensuring your readers can see your images on any type of device. Nowadays, it’s vital your pages are optimized for mobile<\/a>\u00a0to impact search engine rankings, as well as user experience.<\/p>\n If your images aren’t responsive, the page won’t appear as clean on mobile as it does on desktop \u2014 which negatively affects SEO, as well as your reader’s perception of your brand.<\/p>\n Fortunately, some website hosting services, including HubSpot, automatically ensure your images are responsive.<\/p>\n However, if need be, you can make your images responsive by using quick code. For instance, you can add this code to your HTML:<\/p>\n <img src=”nature.jpg” alt=”Nature” class=”responsive”><\/p>\n Or this code to your CSS:<\/p>\n .responsive {<\/p>\n \u00a0 width: 100%;<\/p>\n \u00a0 height: auto;<\/p>\n }<\/p>\n Creating high-quality, unique, original images isn’t just great for your own website \u2014 it’s also a fantastic opportunity to earn backlinks when other<\/em>\u00a0websites use your image for their own pages.<\/p>\n For instance, consider the following graph created by Broadband Search:<\/p>\n<\/p>\n The image currently ranks in the first spot on the image search results page for the keywords, “how many people use mobile to search”.<\/p>\n Additionally, according to Ahrefs, this blog post has over 3,000 backlinks<\/a>. I’m willing to bet that those backlinks are, in part, due to other companies wanting to use Broadband Search’s unique graphs for their own content.<\/p>\n If you create high-quality images, other companies may want to showcase those images on their own sites \u2014 with links back to your business. This means, ultimately, images can have a direct impact on the amount of traffic, leads, and customers you get for your business through your marketing efforts.<\/span><\/p>\n Google suggests adding images to an existing sitemap<\/a>\u00a0\u2014 or creating a separate sitemap just for images \u2014 to help search engines discover your images. In particular, this is helpful for images Google can’t find through crawling, such as those accessed via JavaScript forms.<\/p>\n Here’s a sample sitemap<\/a>, with two images included:<\/p>\n<\/p>\n Fortunately, if you don’t want to add images to a sitemap manually, you’re in luck \u2014 there are tools, such as Angeldigital.Marketing<\/a>\u00a0(one of the only free ones available!), that will automatically generate an image sitemap once you input a URL.<\/p>\nImage SEO Best Practices<\/h2>\n
1. Use relevant, accurate alt text for user accessibility and SEO.<\/span><\/h3>\n
2. Consider using captions to describe an image.<\/span><\/h3>\n
3. Compress images for faster load time.<\/span><\/h3>\n
4. Post original images \u2014 not just stock photos.<\/span><\/h3>\n
5. Name your file images before uploading them.<\/span><\/h3>\n
6. Use responsive images.<\/span><\/h3>\n
7. Leverage images as a backlinking opportunity.<\/span><\/h3>\n
8. Add images to an existing sitemap.<\/h3>\n