How to add image alt text in WordPress

Adding alternative text, more commonly known as “Alt text,” to your images in WordPress is a simple but essential step for making your website accessible and SEO-friendly. Alt text helps users with visual impairments by accurately describing visual elements, ensuring they receive important information that would otherwise be missed. Writing good alt text also helps search engines and AI algorithms understand your images, which can boost your site’s visibility.

In this guide, we’ll walk you through what makes good alt text, why it matters, and how to add it to your images in WordPress using three easy methods.

What is alt text, and why does it matter?

Alt text is a brief description of an image that appears in your site’s code. Screen readers use it to describe images to visually impaired users. Additionally, if an image fails to load, the alt text will display in the browser, ensuring that your content remains understandable. Providing clear, descriptive alt text for screenshots contributes to search engine optimization and visibility, as well.

An infographic with four benefits of using alt text in WordPress.

In terms of user experience, alt text also ensures that content remains meaningful and accessible across mobile phones and tablets, where images may not display correctly due to screen dimensions. By writing effective alt text, you not only make your site more inclusive but also create a more valuable and practical WordPress site.

Understanding the HTML alt attribute

The alt attribute is an integral part of the HTML code used to specify an image. It is included within the img tag and ideally provides a brief description of the image. For instance, if an image has an alt attribute that reads “A large orange cat eating lasagna,” a screen reader will announce “A large orange cat eating lasagna” to the user.

An illustration or photo of an orange cat with the HTML code example below it.

How to add alt text in WordPress

You can add or edit alt text in WordPress in three main ways: via the Media Library, the Gutenberg editor, or directly in the code. Let’s examine all three options, so you can choose the one that’s right for you and your website.

1. Using the WordPress Media library

This is the easiest way to add alt text to images you’ve already uploaded.

Log in to your WordPress dashboard.
Go to Media > Library.
Click on the image you want to edit.
In the Attachment Details pane on the right, find the Alt Text field.
Enter a descriptive alt text. Click away from the field or close the window. WordPress saves your changes automatically.

A web form with the fields available in the WordPress media library to add alt text.

2. Using the Gutenberg Editor

If you’re adding or editing images in a post or page, you can set the alt text right there.

Open the post or page in the Gutenberg editor.
Click on the image block you want to edit.
In the right sidebar, find the Image settings and the Alt text (alternative text) field.
Enter your alt text.
Save or update your post or page to keep the changes.

Form fields are highlighted to add alt text from right inside the Gutenberg editor

3. Editing the code directly

For those comfortable with HTML, you can use the code editor.

Switch to the Code Editor in the Gutenberg editor.
Locate the < img> tag for your image.
Add or edit the alt=”your descriptive text” attribute.
Save or update your post or page

A snippet of code in WordPress that contains alt text for an image.

Adding alt text in WordPress is pretty straightforward, whether you prefer the Media Library, the Gutenberg editor, or editing the code directly. By trying each of these methods on a test page or staging website, you can ensure your images are accessible, descriptive, and optimized for all users and search engines.

Tips for writing effect alt text

As we’ve seen, writing effective alt text is an essential skill for making your website accessible, improving user experience, and ensuring your content is inclusive for everyone. The following tips will help you craft alt text that is clear, concise, and meaningful for all users, including those relying on screen readers.

Be concise and descriptive

When writing alt text, focus on clearly and straightforwardly describing the essential elements of the image. You want to give users enough information to understand the image’s content without overwhelming them with unnecessary detail. Aim for a sentence or phrase that captures the main idea, ideally under 125 characters, so it’s quick to read and easy for screen readers to process.

Avoid keyword stuffing

While it’s tempting to add lots of keywords for SEO, stuffing alt text with irrelevant or repetitive keywords can make it confusing for users and may even harm your search rankings. Instead, use natural language and only include keywords if they genuinely fit the image description. Prioritize clarity and user experience over search engine optimization.

A woman looks at a long list of keywords next to an orange graphic on a website.

Skip “image of” unless necessary

Screen readers already announce when they encounter an image, so starting your alt text with phrases like “image of” or “picture of” is usually redundant. Go straight to the description, such as “sunset over the mountains” rather than “image of a sunset over the mountains.” The only exception is when the context requires clarification, such as distinguishing between a photo, illustration, or icon.

Make each alt text unique

When you have several similar images on a page, avoid using the same alt text for each one. Instead, tailor your descriptions to highlight what makes each image unique. This helps users understand the context and ensures your site remains accessible and informative, especially for photo galleries or product listings.

Describe the content and function

Think about why the image is on the page. If it’s purely decorative, you might leave the alt text blank (using an empty alt attribute, alt=””). However, if the image serves a purpose, such as a button, link, or infographic, describe both what’s shown and what it does. For example, “Download PDF button” or “Graph showing sales growth from 2022 to 2025.” This way, users get all the information they need, regardless of how they access your site.

Tools for alt text creation

Several tools can help you write effective alt text. The Yoast SEO plugin for WordPress, for example, offers features that help generate alt text for your images, ensuring they are optimized for search engines. Adobe Creative Cloud also provides tools to help users create alt text for their visuals.

Additionally, online tools like AltText.AI can be invaluable, especially for those unfamiliar with writing alt text or needing to generate alt text for a large number of images.

Screenshot from the alt text generator website showing how to use.

These tools simplify the process, making it easier to create descriptive and SEO-friendly alt text for all your website’s images.

Short-term work with long-term gains

Adding alt text to your images in WordPress is quick, easy, and pays off in accessibility and SEO. Whether you’re uploading new images or updating old ones, make alt text part of your routine. Your visitors (and search algorithms) will thank you.

If you want to learn more about making your WordPress project user-friendly for everyone, check out our guide to 7 essential elements for a more accessible site.