The Html Alt attribute is basically a definition of the image in text form. Here definition means text that tells us about the image.
<!DOCTYPE html>
<html>
<head>
<title>
What is Html Alt attribute and why we need it?
</title>
</head>
<body>
<h1>Alt Attribute</h1>
<h2>Alt Attribute in Image</h2>
<img src=
"https://www.samplesite.com/wp-content/uploads/apple-image.png"
alt="Apple Image">
</body>
</html> But why do we need a definition of the image if we can see it?
Alt attribute is required for those who can't see it. Yeah, they may be people or bots from search engines. It can be read by screen readers and other tools that help people who are blind or have other disabilities.
The goal of the alt attribute is to give a meaningful, descriptive text alternative to images so that people who can't see the image can still understand what it is and what it does. For example, if an image is used to show important information, the alt attribute should explain what that information is so that everyone, no matter what their abilities, can see it.
How we should write the alt attribute of an image?
I've shared below an example that shows how we should write image alt attributes.
The alt text should say as much as possible about the image.
- Alt Attribute for the Below image is "Four Books on Brown Table"
