Resources & Knowledge
We are a team of passionate designer and developer that build impactful and visually stunning websites
SEO best practices for choosing and naming images in your website
SEO / Images / Quickfire
If attracting your target audience’s attention and keeping them engaged has become a struggle for you, chances are that you do not use enough images in your blog posts or articles. Images are not only important in the initial stages of web design, but they can also make your articles more appealing and greatly enhance your website’s visibility by making it more SEO-friendly.
These are the basic steps you need to follow to improve your web design, achieve better image SEO and bring your website back to life:
1. Choose the right image that is relevant to your text
Stock photos are great but to achieve a more authentic and memorable web design, you should try to use original images taken by yourself. Websites such as Flickr.com or Unsplash can also be great alternatives to stock photos.
2. Make your image file name and the caption as descriptive and relevant as possible
Treat your image file name as a key phrase that tells Google about everything there is in the image and your image captions (the text displayed below your image) as the most important piece of text for the reader. For example, instead of naming the image abc_1.jpg, name it london-eye-sunset.jpg.
3. Reduce file size and match the image dimensions to the image display size
To make page loading faster, resize the image dimensions to their intended display size. As for the image file size, Websites such as Kraken.io or jpeg.io can help you resize images without compromising their quality.
4. If possible, make use of the srcset attribute
The srcset attribute lets you display different images according to the screen width which is especially effective in case of mobile devices.
5. Always add image alt text and never a title text
The alt text is crucial as it provides information if the image cannot be seen by the reader for some reasons, while the title text is usually either not shown to the reader where intended or is not shown at all unless you move the mouse cursor on it.
6. Include image structured data
If you incorporate structured data into your web design, your images may be displayed as rich results by search engines and your article may get more exposure. In the case of Google, some guidelines need to be followed.
7. Add image tags to promote social sharing
To generate more interaction, you should make sure that the image is included in the case of social sharing (on Facebook, Pinterest etc.). To ensure that, you can add the image tag as displayed below to the <head> section of your page HTML:
<meta property=”og:image” content=”http://example.com/link-to-image.jpg” />
And finally,
8. Include images in website’s XML sitemaps
Why? Because image sitemap information helps Google discover images that we might not otherwise find (such as images your site reaches with JavaScript code), and allows you to indicate images on your site that you want Google to crawl and index.
Make sure to follow those steps to achieve better web design efficiency and image SEO.