Optimize Images for Web and Improve Search Results

Optimize images for web and improve search results
Know the tips to optimize images for web and improve image search results

Every website admin should pay attention to optimize images for web because it reduces the time browsers take to download an image and that results in browsers rendering the page quickly while not compromising the user experience.

Moreover, it will help search engines to find and rank these images higher.

In this article, we will elaborate on followings tips to optimize images for web:

  1. Select an Appropriate Image
  2. Select Suitable File Format
  3. Resize and Compress the Image
  4. Use SEO-friendly Image File Name
  5. Alt Text should be SEO-friendly
  6. Describe Image in Caption
  7. Publish Image Sitemap

Tips to Optimize Images for Web

Select an Appropriate Image

You should select an image that represents the essence of the article you are writing. Such an image will arouse people’s interest to read the article. You can either create such image or find one at the famous photo websites, such as Flickr.com, StockSnap.io, Unsplash.com, Pexels.com, etc.

For the sake of an example, consider the below image:

Migration of a website from HTTP to HTTPS
Image representing an article on migration of a website from HTTP to HTTPS

This image represents moving from an insecure HTTP state to the secure https. Thus, it fully justifies the article-title Migrate from HTTP to HTTPS: Raise security and search engine ranking

Select Suitable File Format

In general, two types of images are available for the web —Vector images and raster images.

Vector graphics use geometrical shapes like points, lines, and polygons to create an image. These images are independent of resolution and zoom. It means quality of a vector image will remain intact even if you change the resolution and zoom parameters.

Vector formats are used where geometric shapes are required, like, in logos and icons. The main file types of a vector image are AI, EPS, and SVG.

Vector image of a business man
Vector image that retains its quality irrespective of resolution and zoom parameters.

Raster images are formed by encoding each pixel within a rectangular grid. Whenever complex scenes (like a photo) are to be captured, raster format is used. The popular file types of raster images are JPEG, PNG, and GIF.

The quality of a raster image depends upon the resolution and zoom parameters. If you scale up a raster image, you will see a blurry graphics.

Resize and Compress the Image

Now, it is time to resize and compress the selected image. This activity is essential to minimize file size of the image.

Think of the optimum image size required and then resize it using any of the offline or online photo editing tools. For a large image, 736×386 pixels size can suffice your requirement.

Examples of some free online image editors are online-image-editor.com, freeonlinephotoeditor.com, ipiccy.com, etc.

Once you have reduced your image size, now proceed to compress it. Although, there are plugins for WordPress websites, to compress images. But I prefer not to use any such plugin; instead, use a free online image compressor, like ShortPixel.com.

You can find similar tools at compressor.io/compress, compressjpeg.com, compressnow.com.

 

A raster image of roses
Resize and compress an image to reduce its file size while retaining the quality

This image’s original dimension was 640×371, and file size was 75.7 KB. After resizing to 400×232 dimension and compressing the image, file size has reduced to 20 KB. In all, 55.7 KB has been saved without losing noticeable quality.

Use SEO-friendly Image File Name

Do not use default name of an image created or downloaded from a website. To make it search engine friendly use keywords in the name. For example, if the keyword for your article is http to https then, you can name the image as http-to-https.jpg assuming your image file format is JPEG.

Alt Text should be SEO-friendly

For some reasons, if an image is not rendered on a device, the user can still see the alt text which describes the image. Moreover, search engines cannot read the image, but with the help of alt text, they can understand the image and rank accordingly. Therefore, alt text is an essential aspect of on-page-SEO strategy.

If possible, you should include keyword in the description of alt text. For example, if the keyword is http to https the alt text can be Guide to migrate your website from http to https.

Describe Image in Caption

Many readers look at the images and captions before they decide reading the article. Therefore, description in the image caption is also an important point.

While captioning images, remember the following points:

–    The information described in the caption must be accurate. Leave the information if you are not sure of its accuracy.

–    Describing the photo will not serve any purpose. Therefore, mention something which is not obvious from the image. For example, if you have a photo of your friends in a get-together, then you should not describe it as my friends. Instead, mention place, date and occasion or the event taking place.

–    You can avoid certain words like a, an, or the at the start of the caption as these are not necessary.

Publish Image Sitemap

An image sitemap has information about the images on your website as well as images loaded by a JavaScript code like product images. Site owners provide additional information related to images by referring the Google Sitemap extension page. All this information helps Google to understand these images better, thereby improving image search results. Therefore, Google encourages to publish an image sitemap.

The standard sitemap that you submit to Google is created by an SEO plugin (for example, Yoast SEO plugin). It also contains information about images under post sitemap. If you do not want to submit an image sitemap, you can add suitable details to images under post sitemap.

To create an image sitemap, you can refer the following example for a web page http://example.com/sample.html, which contains few images:

Example of image sitemap
Sample of an image sitemap to be submitted to Google

For detailed information on image sitemaps, you can visit Sitemap extension page on Google.

Wrapping it all

If you consider the SEO and user-experience benefits, then it is worth applying the above mentioned tips to optimize images for web.

Hari Mohan is the founder of hariforyou.com and blogs on WordPress, SEO, Social Media Marketing and Technology. He believes in “Keep the things Simple and Help others to Succeed.”

If you like the post, please share it.

39 Replies to “Optimize Images for Web and Improve Search Results”

  1. Great job, This content is very very great content, I got really good information from this content and it helps me a lot, I hope it can help many people like me. if you want more information about this content just click here

  2. Having a keyword-rich file name is a huge one which I overlooked for a long time. I was all about getting the title and alt tags correct but I was naming my image files whatever I felt like. Turns out the file name has a huge effect not just on the SEO of the page it’s on, but on the “image SEO” of the image itself. And you can actually get quite a lot of traffic from Google’s image search!

Leave a Reply

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