Alt Text

Alt text (short for alternative text) is a written description of an image added to the HTML code of a webpage. It helps screen readers describe visuals to users with visual impairments and also gives search engines context about an image’s content.

When images fail to load, alt text is displayed in place of them, ensuring the meaning of the content is not lost.

Why alt text matters

Accessibility: Ensures that visually impaired users can understand images through screen readers, making websites inclusive.
SEO benefits: Provides search engines with context, improving image search rankings and overall SEO.
User experience: Acts as a fallback when images don’t load, keeping content understandable.

How to add alt text

Alt text is included as an attribute in the HTML image tag:

The alt attribute should briefly describe the image and its purpose.

Best practices for writing alt text

Be descriptive: Explain the image clearly (e.g., “Golden retriever sitting on the grass”)
Keep it short: Aim for under 125 characters for readability in screen readers.
Avoid redundancy: Don’t use phrases like “image of” or “picture of.”
Include keywords naturally: Helpful for SEO but should not override clarity.
Skip decorative images: Use empty alt tags (alt=””) for visuals that don’t add information.

Examples

Incorrect: dog
Correct: Golden retriever sitting on the grass

The second example is specific and informative, improving accessibility and SEO value.

Key takeaway

Alt text is essential for both accessibility and search visibility. By writing concise, meaningful descriptions, you make your site more inclusive, improve technical SEO, and create a better experience for all users.