Knowledge Base

Alt and Title Attributes for Images

Атрибуты картинок Alt и Title

When adding an image to the HTML code of a website, there is an option to specify additional attributes for it, namely Alt and Title. In many CMS platforms, the function for filling in the attributes for images is implemented in the image editor interface. In HTML code, it looks like this:

<img src="Path-to-image" alt="Text-1" title="Text-2" />

Alt Attribute

Alt is an alternative source of information about the image, which is shown to users if the browser cannot load the image (due to poor internet or disabled images in the browser).

The Alt attribute of an image has a direct impact on SEO — it helps search engines understand what is depicted in the photo. That is, properly filling out Alt attributes for images will help them rank better in image searches.

Rules for Filling Out Alt:

  1. The Alt text should briefly and accurately describe the content of the image.
  2. It should consist of 3–5 words but no more than 250 characters.
  3. It may contain a keyword if it corresponds to the image.
  4. It should not be spammy (listing keywords in Alt won’t provide any SEO benefit).

Title Attribute

Title — this attribute provides additional information to the user about the image when hovering the cursor over it.

The Title attribute does not have a direct impact on SEO, but it can be useful for users, as it improves the usability of the site (affects the behavioral factor).

Rules for Filling Out Title:

  1. It contains explanatory information about the image.
  2. There are no length restrictions, but overly long text may be inconvenient for users to perceive.
  3. The inclusion of a keyword will not have a direct impact on SEO, but it will be helpful for better user orientation on the site.
  4. It is important to remember that Titles for images are displayed only in the desktop version of the site and when the cursor hovers over the image. Therefore, important information should not be placed in the Title; it should be included in the image description that is constantly visible to the user.

Description (Caption) for Images

Description or Caption — the description of the image. It is not an HTML attribute for the image, as it is a text field implemented in the image editor interface in many CMS platforms, and its content is displayed alongside the image on the site pages.

The content of the description field for the image is shown to visitors constantly, most often below or next to the image. The placement and style depend on the template used.

This field may have different names; for example, in the WordPress CMS, there are 2 fields for entering image descriptions: Caption and Description. The difference is that the Caption is displayed on the page where the image is located, while the Description is displayed as the content of the image attachment page.

SEO Specialist Tip: Properly filling out all attributes for images is useful, as each can enhance user interaction with the site. Combining the information above, the following advice can be given:

  • Alt — an attribute that is mostly invisible to the user but affects SEO;
  • Title — an attribute that is visible to the user in some cases and indirectly affects SEO;
  • Description — a field whose content is always visible to the user and directly affects SEO, as it is part of the content.

Info