SEO Images: 11 Perfect Tips for Optimize your Site

SEO Images: 11 Perfect Tips for Optimize your Site

Images are the first thing we pay attention to when opening a website or application. Researchers at the MIT Department of Brain and Cognitive Sciences have proven that 13 milliseconds are enough for a human brain to recognize a picture– it’s 3 milliseconds faster than a bulb in your room lights up. It is no coincidence that illustrations are a powerful tool in Internet marketing. They help to set semantic accents and motivate visitors to action. The graphic component also affects the overall perception of the website and how well it will be perceived by the user.

Graphic content can be used as another tool for attracting organic traffic. Search engines value unique and optimized images. In the following article, we will tell you how to apply the best image SEO practices to your website.

Why Optimize Images?

First of all, correctly selected images influence behavioral factors. When a user gets to a site, he or she instantly scans it. Pictures and subtitles help to decide whether it is worth getting acquainted with the content in more detail. It is important that the illustrations are relevant, informative, and download quickly. The value of graphic content is hard to overestimate. Imagine coming across a website with a solid page of text. You would have to exert great effort in order to find important information. You would get bored quickly, close the site, and never visit it again.

Just uploading pictures to your site is not enough. In order for search engines to respond relevantly to the needs of your potential customers, images and SEO must work together. Your task is to help search robots to figure out what is depicted in a photo, illustration, or infographic. You can use keywords in meta tags and URLs. This will increase the chances of getting into the top of your niche’s SERP. It is also important to adapt images to different types of devices. They should keep their proportions and load as quickly as possible.

According to the MOZ, 25-27% of search queries in 2020 fall to Google Images. At the same time, it’s not the pictures themselves that are important but the context — how the product or service is applicable in real life. This is especially true for sites dedicated to shopping, fashion, interior or landscape design, and commercial photography. For example, resources with ideas for organizing events, hobbies, and DIY are very popular. Users come here for inspiration and tutorials– you can use the whole SEO Img gallery. In order to get viewers to your site, you need to interest them. The picture and its accompanying information work as a teaser of what awaits the visitor on your page. Properly added metadata plays a key role here.

What Are the Google Requirements for Images in 2020?

The increasing role of visual content can be judged by the changes that have occurred with Google Images over the past 5-6 years. Previously, the search results were displayed as a solid grid without any accompanying information. Today, under each image you will find a snippet, licensing information, parent domain, etc. Image description SEO comes to the fore. Images from the categories Recipes, Products, Videos, and Animated GIFs receive special badges. They simplify the search and help site owners get more targeted traffic. Specific attributes in the carousel also serve to display the most relevant images.

What Do SEO-friendly Images Look Like According to Google?

To properly respond to requests, search robots need to understand what is shown in the pictures. You can help them. The basic guidelines on how to optimize images for SEO are provided in Google’s Webmaster Guidelines and on the Google Image best practices page:

  1. Choose relevant images. They should be unique, high-quality, consistent with the subject of the page, and complement the text blocks within the meaning.
  2. Try to avoid text in pictures. Headings, menu items, and other important information should be placed in the text. If the image does not load, the page structure will look illogical. In addition, images with text interfere with the full translation of the page into other languages.
  3. Optimize images for mobile devices. Distorted proportions or a cropped piece of the image can spoil the impression of the page. For each type of device, use images of the appropriate format.
  4. Enter a detailed URL. Google experts advise indicating not only the name of the file but also the logical structure of its placement.
  5. Fill in the meta tags. Google Images automatically generates the page title and snippet. To make the result as informative and useful for the user as possible, pay attention to the title and description fields. What information should you put there? Find out here, in a separate guide.
  6. Define the Alt attribute. If the pictures do not load due to a slow connection or user settings, you should have a plan B. Alternative text conveys the meaning of the image and can be used as an anchor.
  7. Provide structured data for products, recipes, and videos. This will help earn you a special badge and better serve your target audience. Follow the rules carefully though– Google has penalties for violators.
  8. Speed ​​up website loading. It takes more time to display big images– 53% of users will not wait for the site to load for more than 3 seconds. You can check your site’s speed using the PageSpeed Insights tool. Add AMP markup to the image page. The site will receive the AMP logo and will load faster.
  9. Use sitemaps. They may contain additional information necessary for indexing.
  10. Optimize images for safe search. Many users want to exclude adult content from results, especially if the whole family uses the computer, including children. Google listens to their opinions and strongly recommends adding special markup to candid images.

Reverse Image Search AI Algorithm

According to a study conducted by ViSenze, 62% of Generation Z and Millennials are interested in expanding visual search capabilities. They would like to quickly find the product of interest and be able to evaluate it in real conditions. Google meets users’ needs with new algorithms containing machine learning (ML) and artificial intelligence (AI). Similar technologies are used by Bing, Pinterest, and Amazon. “The future of search will be about pictures rather than keywords,” predicted Pinterest co-founder and CEO Ben Silbermann in an interview with Closing Bell.

Play.google.com

Google Lens is an image recognition system that is increasingly breaking down the distinction between the real and the digital world. The algorithm works on the principle of reverse search. At its core is a self-learning neural network. Google Lens handles many tasks: it can recognize real objects, scans, and translates text, help you choose dishes in a restaurant, or even replace a travel guide during a walk. Its application in Internet marketing is interesting. It allows a user to take a picture on their smartphone’s camera and the system will recognize what’s pictured, compare it with the assortment of nearby retailers, and give feedback from other customers.

Innovative algorithms require new promotion methods. The following steps will help improve your Google Lens results.

  1. The logo, QR code, and other branding elements should stand out as much as possible from the general background.
  2. Images should have as much supporting information as possible– Alt attribute, thematic surrounding text, key queries, and links to the main resource.
  3. The more Exif information you specify, the more likely it is to get into the SERP. The geolocation and date indicated in the metadata of your image deserve special attention.

Where to Get Images for Your Site

Ideally, the visual content on your site should be creator-owned. It should be unique and as adapted to the theme of a particular page and the overall style of the site as possible. In practice, attracting a photographer or illustrator to create branded content is not always possible. SEO stock images from online libraries will come to the rescue.

Unsplash.com

  1. Flickr is one of the most famous photo hosting sites.  Its archive contains over 10 million images. Here you can pick up a photo with a public license and legally use it for commercial purposes.
  2. Depositphotos has 150 million photos, videos, and vector illustrations on almost any topic. Depending on the tariff plan, one image will cost from $ 0.22 to $89.
  3. Unsplash offers over one million high-resolution photos for free.
  4. Shutterstock has over 320 million of royalty-free images. Tariff plans allow you to download 5 to 750 images at costs ranging from $49 to $249.
  5. Envato Elements is a large library of photos, graphics, video masks, fonts, presets, music, and sound effects. A free subscription opens access to 12 elements every month. For unlimited downloading, you need to pay for an individual subscription ($16.50) or for a team package (from $10.75) for each participant.
  6. New Old Stock is a gallery of vintage photos without copyright. Most of the images are intended for non-commercial use: blog posts, articles on Medium, or a hero image for a 404 page. For commercial purposes, there are Pro Photo Packs available starting at $5.

Before using the photo on your site, make sure that you have all of the relevant licenses and that you do not infringe on any copyrights of the photographer or artist. To better fit the image into the visual concept of your project, you can unify it. For example, add geometric elements, frames, and color schemes. You don’t have to be a Photoshop guru– online graphic platforms like Figma or Canva have all of the tools you need and it’s easy enough to learn using them from scratch.

What Image Format to Choose

Image files can have different extensions. For photos, RAW, TIFF, JPEG, JP2, and BMP are most often used. For graphics, these are PSD, PNG, and SVG. Each has its own characteristics and practical application. When you upload an image to a site, you should prioritize image quality, weight, and the number of colors. The unconditional leaders for the web are the following formats.

  1. JPG/JPEG. This format was invented for storing full-color photographs. It supports more than 16 million colors. To reduce weight, the image can be compressed with a slight loss of quality. It is ideal for photos, screenshots, illustrations with gradients, and shadows.
  2. PNG. This format transmits anywhere from 256 to 16 million colors. It can also be compressed without loss of quality. A big plus is the support of alpha transparency– each pixel can be set its level of visibility. PNG is perfect for high-definition images, graphs, and drawings. It is often used for logos, buttons, badges, and other design elements.
  3. GIF supports a total of 256 colors. It is not the best option for full-color photos and pictures with gradients. However, it does allow you to set its transparency though rather roughly (each pixel has only two modes, transparent and visible). A distinctive feature of GIF is animation support. It is mainly used for logos, dynamic advertising banners, and memes.
  4. WebP is a relatively new format coined by Google in 2010. It allows you to get a picture of good quality with minimal weight and it compresses really well. It also supports alpha transparency. In terms of cons, not all browsers support WebP (it displays well in Chrome, Opera, and Firefox).
  5. SVG is used for vector images. It weighs less than raster analogs and does not lose quality when scaling. Using JavaScript, you can animate an image or part of it, and thanks to CSS, you can set the desired color, transparency, and borders. SVG is good for low-color schemes, logos, and icons. It is not suitable for photo and detailed color drawings.

11 Tips for Image Optimization

1. How to Choose the Right Resolution and Size

60% of the total page weight falls on the image. If you use them in their original form, the website loads more slowly. There is a risk that the user will not wait for all the elements to be displayed and will leave the resource. Pages with a high bounce rate drop lower in the SERP. To prevent this from happening, you should compress the image before loading it. You can reduce weight without any visible loss of quality.

You can compress the image manually using Adobe Photoshop, FastStone, or another graphics editor. However, it is much more convenient to use online compressors such as ImageOptim, ShortPixel, Optimizilla, Kraken.io, and Compressor.io. For example, TinyPNG allows you to reduce the image’s size by up to 70%. In the free version, you can process up to 20 files at a time.

Pay attention to geometry. All images in Google Image Search are more or less similar. You rarely stumble upon extremely tall or horizontally elongated images. The most successful options have a ratio of 16×9, 3×4, or a square shape.

Size also matters. Small pictures rarely get into the SERP. You can find them only by the auxiliary request icon in the search settings. A similar situation is with images that are too large. The only exception is with requests marked Wallpaper.

2. Make Preview Thumbnails

Mobile search is increasingly focused on the visual component. Thumbnails in the SERP can significantly increase organic traffic. The user sees the product of interest and is more likely to make the transition to your site.

For classic searches, Google crops your images as a square. This point should be taken into account so as not to lose some of your important visual information. Since the images are very tiny, compression can neglect quality in favor of weight reduction. For the same reason, do not abuse small details. It is advisable to use a plain background. Thumbnails should be as informative as possible, telling about your product or service through one visual object.

Analyze the pictures of competitors. The main task of these thumbnails is to attract as much attention as possible. Adapt visual trends or seasonal elements to your content. This will help you to stand out against the general background. Use corporate colors, a logo, or other recognizable brand elements.

It’s important that Google selects the file you want as a thumbnail and not a random image. There are two ways to achieve this. The easiest way is to write the appropriate tag in the <head> section of the selected page:

<meta name = “thumbnail” content = “http://example/white_rabbit.jpg” />.

The second way is to add a block of code in the PageMap:

<!–

  <PageMap>

    <DataObject type=”thumbnail”>

      <Attribute name=”src” value=”http://www.example.com/tricks/hat/white_rabbit.jpg”/>

      <Attribute name=”width” value=”150″/>

      <Attribute name=”height” value=”150″/>

    </DataObject>

  </PageMap>

3. How to Name and Optimize Images for SEO

Pay attention to the captions for the photo in your camera or phone. A set of numbers or letters says little about the picture taken. The file “IMG_0cPFMf” should clearly be renamed. The name “white_rabbit” looks more informative, and “white_rabbit_magician_trick” is even more immersing in context. Naming image for seo should reflect its essence, be concise, and be understandable. To increase your position in the SERP, you can use the keywords or register the name of your product.

The title attribute should be filled in the same way. Search robots will build on it when classifying images. It is worth helping them with this.

To better understand the contents of the images, Google uses artificial intelligence in the form of Cloud  Vision AI. The system is smart enough to recognize and classify objects, highlight logos, recognize faces and locations, decrypt text, and suppress inappropriate content. It would seem that meticulously adding the file names is no longer needed. However, AI does not always understand what images are about, especially when there are several objects in the image or they are similar to each other. In order for the system to place your image in the desired thematic output, it needs tips in the form of correct file names and titles.

4. How to Write SEO-friendly ALT-text for Your Images

The alternative text will appear on the screen if your picture for some reason does not load. Search robots use it to better understand the image and correlate it with a specific search query. In addition, the text is used by screen readers for visually impaired Internet users. Hence the golden rule: write for people, not for robots.

Try to keep within 150 characters with spaces. The text should be useful and informative. It’s appropriate to use keywords but to a reasonable extent. Too many of them can be regarded by Google as spam. In addition, the image can be used as a link to another page. In this case, the alternative text will be displayed as an anchor.

Some images on the page do not carry a semantic load but are simply decorative. The Alt attribute, in this case, is better written as alt=”” (null)– otherwise, it will only complicate navigation.

5. How to Add Image URL

The image address should display its name and storage logic. It should be simple and straightforward for both users and search robots. And, of course, the URL is another place where it’s logical to enter keywords.

6. Where to Store Images

The importance of logical image placement for ranking follows from the previous paragraph. Google Image Guidelines focus on the fact that the path specified in the URL is taken into account when generating SERP.

Do not upload all of the images in one folder. Distribute them according to the categories of the site. In the end, a hierarchical storage system is simply more convenient. Large numbers of graphic objects can easily get confused.

7. Add Images to the Site Map

Sitemaps provide crawlers with additional information about your images. For example, images loaded using JavaScript from slider galleries often go unnoticed by search engines.

To save server space, some site owners use third-party hosting services such as Google Cloud CDN, Amazon CloudFront, CloudFlare, Imgur, Postimage, etc. If you use images from a third-party domain, you can specify the appropriate URL in SiteMap and take full advantage of CDN.

Information about images can be entered into an existing single sitemap for the entire site or you can create a separate file exclusively for images. In the Google manual, you will find an example of how to enter all of the elements correctly.

8. Set Up Image Export to Social Networks

By increasing the visibility of your site on social networks, you build more trusting relationships with current customers and attract new ones. The best way to achieve this is to upload images that people will want to share with friends online. As part of the SEO strategy, it is important not only to provide quality content but also to make reposting on social networks easier and more convenient.

Add export items to the page. Image Sharer is a convenient tool for receiving viral traffic. It allows users to share images on Facebook, Twitter, Pinterest, and Yummly with a single click.

Halfbakedharvest.com

9. Think Over the Text Environment

The textual information around an image is an important ranking factor. This is one of the reasons why you rarely see images from photo stocks in search results. Short descriptions are not enough for search robots to correlate objects from galleries with a specific context.

The overall content quality on the page affects the rating of the image in search results. The text and the picture should be related in meaning. Google can use a piece of text to form a snippet. The text itself must be unique, beneficial for the reader, and be different from the Alt attribute – webmasters.googleblog.com.

10. Make Pictures Mobile-friendly

To make the site look equally good on different types of devices, use adaptive images. Using the <img srcset> attribute or the <picture> element, you can download different versions of the image depending on where your site is displayed– on a large computer monitor, tablet, or mobile screen. You can learn how to use markup for responsive images from the developers.google.com.

11. Use Lazy Loading

Delayed loading is a convenient way to prioritize website loading. Content that the user sees first loads faster. The rest of the images, graphic elements, and videos appear as you scroll further. If the user does not reach the end, the content at the bottom of the page will remain unloaded. As a result, you save time on the initial loading of the site and improve its performance. To see which images this mechanism works with and how much traffic you can save, check out the Lighthouse extension for Google Chrome – https://developers.google.com/web/tools/lighthouse/.

Google is constantly improving search algorithms and machine learning capabilities. However, Image SEO remains the most effective tool for promoting visual content. Remember, the main task is to make images as informative as possible, stylish, and memorable for users.

Author

Anna Henderson Anna Henderson

Anna has been working in Digital Marketing for 9 years and has extensive experience in SEO, content marketing, customer-oriented product branding. Previously, a commissioning editor in Nighparty Project and a creative member of the Marketing Unilever team in Europe.

1 Comment

  • Hey Anna Henderson,
    This is the best article I read today. Images and videos are the best way to communicate content visually and optimizing them is a necessary thing to be considered. Many people are running towards digital marketing and social media optimization companies to optimize their site/business on search engines. You explained everything about optimizing images for search engines to recognize them in a detailed way with images and videos as well. Thank you for sharing the great information.


Leave a Reply

Your email address will not be published. Required fields are marked *