Title: Alt Text
Author: Kriko
Published: Jan 21, 2021
Last modified: Jul 15, 2026

---

 1.  [Home](https://kriko.io/) /
 2.  [Glossary](https://kriko.io/glossary) /
 3.  A Letter

# Alt Text

**Alt text**, also known as alternative text or the alt attribute, is the descriptive
text written inside the `alt` attribute of an image in HTML. If an image on a web
page cannot be loaded for any reason, the browser may show the alt text instead 
of the image. People who use screen readers can also understand what an image represents
through alt text. For this reason, alt text is important not only for SEO, but also
for accessibility and user experience.

The main purpose of alt text is to describe the meaning and function of an image
in a short, clear and contextually relevant way. If an image is not purely decorative
and carries information within the content, the alt text should communicate that
information in text form. For example, if a product image, chart, icon, infographic
or explanatory photo provides meaning to the user, that meaning should be accurately
reflected in the alt text. This ensures that users who cannot see the image do not
miss important information on the page.

From an SEO perspective, alt text can help search engines better understand the 
image and the context of the page it appears on. Search engines may evaluate not
only the file name or surrounding text, but also the alt attribute when interpreting
images. For this reason, alt text is especially important for e-commerce, publishing,
blogs, product listing pages, portfolios and visually rich websites that want to
gain image search traffic. However, alt text should not be used as a place for keyword
stuffing.

The most important rule when writing alt text is that it should genuinely describe
the image. What appears in the image, why it matters to the user and how it relates
to the page context should all be considered. For example, writing only “shoe” for
an image of a sports shoe is often too vague. A more descriptive alt text such as“
black lace-up men’s sports shoe” makes the image more meaningful for both users 
and search engines.

In HTML, alt text is usually used inside the `<img>` tag. For example, in `<img 
src="shoe.png" alt="Black lace-up sports shoe">`, the phrase “Black lace-up sports
shoe” is the alt text of the image. The `src` attribute defines the source of the
image file, while the `alt` attribute defines the image description. These two fields
have different functions. The image file name, title attribute and alt text are 
not the same thing.

Alt text should also not be confused with the image title. The `title` attribute
may show additional information in some cases when a user hovers over the image,
but it does not replace alt text for accessibility or SEO. Alt text plays a more
critical role when the image fails to load or when a screen reader needs to describe
the image. For this reason, adding only a title is not enough; meaningful images
should have appropriate alt text.

Good alt text should be short, descriptive and natural. Depending on the context
of the image, a few words or a short sentence may be enough. Unnecessary details,
repeated phrases and keyword lists should be avoided. For example, “shoe, sports
shoe, black shoe, men’s shoe, affordable shoe” is not a natural alt text. A clear
description such as “Black lace-up men’s sports shoe” is a healthier option.

When writing alt text, phrases such as “image,” “picture” or “photo” are often unnecessary.
Screen readers can already indicate that the element is an image. Therefore, “Photo
of a black lace-up sports shoe” can usually be simplified to “Black lace-up sports
shoe.” However, if the type of visual is important for understanding the content,
words such as “infographic,” “screenshot,” “map” or “chart” can be used.

On e-commerce websites, alt text should be consistent with the product description.
If the product’s colour, model, type, use case or distinctive feature is clearly
visible in the image, it can be included in the alt text. For example, descriptions
such as “White leather women’s sneaker side view” or “Grey three-seat sofa with 
wooden legs” provide more context. However, irrelevant campaign phrases, unnecessary
price expressions or repeated category keywords should not be inserted into alt 
text.

Decorative images should be handled differently. If an image does not carry information,
is used only for design purposes or does not provide meaningful content for the 
user, an empty alt attribute can be used. For example, `alt=""` helps screen readers
skip decorative images. This reduces unnecessary information and improves the accessibility
experience.

The context of the page where the image appears should also be considered when writing
alt text. The same image may carry different meanings on different pages. For example,
a shoe image may describe the product itself on a product page, while it may support
a “graduation outfit ideas” context in a blog article. Therefore, alt text should
reflect not only the object visible in the image, but also the function of the image
on the page.

For image SEO, alt text alone is not enough. File name, image size, compression,
suitable format, responsive image usage, lazy loading settings, page speed, surrounding
text and the position of the image on the page also matter. For example, using a
descriptive file name instead of “IMG_1234.png,” optimizing the image and ensuring
that the page loads quickly all contribute to a stronger image SEO structure.

One of the most common mistakes in alt text usage is writing the same or very similar
description for every image. If a page contains many product images, each image 
should describe its distinguishing feature whenever possible. Instead of repeating“
sports shoe” for every image, descriptions such as “Black lace-up sports shoe front
view,” “Black lace-up sports shoe side view” or “Sole detail of black sports shoe”
can be more meaningful.

In summary, **alt text** is the descriptive text of an image in HTML, and it is 
important for accessibility, user experience and SEO. It provides information when
an image fails to load, helps screen readers interpret the image and gives search
engines contextual signals about the image. Good alt text should be concise, descriptive,
natural, contextually relevant and user-focused. It should not be used for keyword
stuffing, but to communicate the real meaning of the image.

## Discover it in the dictionary

###  URL (Uniform Resource Locator)

URL stands for Uniform Resource Locator and refers to the address of a resource 
on the internet. It can be understood as a standard…

###  Cookie

A cookie is a small piece of data that a web server sends to a user’s browser and
that the browser can store. On…

###  Unique Visitor

A unique visitor is a web analytics metric that refers to different users who visit
a website within a specific time period. The purpose…

###  Data Analyst

A data analyst is a professional who collects, organises and analyses organisational
data and presents the results through clear reports. The main purpose of…

###  Scrum

Scrum is a framework used in agile project management and product development to
break complex work into smaller and more manageable parts. Although it…

###  Conversion Rate

Conversion Rate, commonly abbreviated as CR, is a performance metric that shows 
the percentage of users who complete a target action on a website,…

###  No-code

No-code development is a software development approach that enables users to create
applications and digital solutions without requiring traditional coding or programming
skills. It…

###  Vlogger

A vlogger is a person who creates regular video content based on the concept of 
a vlog, which means video blog. A vlog can…

###  Content Strategy

Content strategy is a strategic process that covers the planning, creation, publication,
management and continuous improvement of content across print or digital channels.
It…

## Track the digital heartbeat  with Kriko

Subscribe to receive curated insights, news, and ideas shaping the digital landscape.

  By checking this box, you acknowledge and accept our [privacy policy](https://kriko.io/privacy-policy).