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:
- Select an Appropriate Image
- Select Suitable File Format
- Resize and Compress the Image
- Use SEO-friendly Image File Name
- Alt Text should be SEO-friendly
- Describe Image in Caption
- Publish Image Sitemap
Tips to Optimize Images for Web
1. 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.
You should also ensure that the image is entertaining. Such images will attract the visitors and arouse enough interest to go through the article.
For the sake of an example, consider the below image:
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
2. 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 the 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.
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.
3. Resize and Compress to Optimize Images for Web
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 tool.
You can find similar tools at compressor.io/compress, compressjpeg.com, compressnow.com.
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.
The advice as mentioned above is the core of activities you perform to optimize images for web. So, pay more attention to it.
4. Use SEO-friendly Image File Name
Do not use the 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 – optimize images for web, then, you can name the picture as optimize-images-for-web.jpg assuming your image file format is JPEG.
5. 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 the keyword in the description of alt text. For example, if the keyword is – optimize images for web, then alt text can be Guide to optimize images for web.
6. Describe Image in Caption
Many readers look at the images and captions before they decide reading the article. Therefore, a description in the image caption is also an important point to optimize images for web.
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.
7. Publish 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:
For detailed information on image sitemaps, you can visit Sitemap extension page on Google.
It was the final yet essential tip to optimize images for web. You should consider to implement it.
Wrapping Up – Optimize Images For Web
The tips given in this article are not difficult to implement. Still, they provide benefits regarding higher search engine rankings and better user experience. The benefits do not stop here, and you get increased web traffic to your site.
If you consider the benefits as mentioned above, then you will decide to implement all the tips to optimize images for web.