What Is Image Alt Text? How It Helps, Plus How to Set It in WordPress

One of the most important things you can do to help ensure your website’s success is to optimize it for search engines. There are a lot of ways to achieve that, both on a large and small scale. One smaller, but still important, task is optimizing your image alt text.

“Alt text”, sometimes called an “alt tag”, is an important consideration for accessibility, but it can also have a positive impact on your site’s Search Engine Optimization (SEO). Even if most of your readers will never see this ‘hidden’ information, image alt text provides websites like Google with valuable data about your content, so it can be presented to the right searchers.

An introduction to image alt text

When you add an image to WordPress, or embed another piece of media such as a GIF, you are given the option to assign it ‘alt text’. This is simply a brief description of the media file, and usually takes the form of a short sentence.

You might assign it the image alt text: “The Themeisle blog homepage”. This is a short, clear description of what the picture contains.

Under normal circumstances, however, that sentence won’t actually show up on the web page. Image alt text is a type of metadata – which means that it’s behind-the-scenes information most visitors will never see. So why include it at all?

There are a few answers to that question. The first involves the original purpose of image alt text – improving website accessibility. This behind-the-scenes text was created so that visitors with a visual impairment (that is, those who cannot actually see the images in your content) still have some way of knowing what they are. Alt text also comes in handy if your web page ever has trouble fully loading, since the text will generally display as a placeholder when images fail to show up.

Given how easy it is to create image alt text, those reasons are enough to motivate most people to use them. If you need more encouragement, however, you might be interested to know that alt text is also beneficial for your website’s search engine visibility.

The effects of image alt text on Search Engine Optimization (SEO)

Search Engine Optimization (SEO) is the process of tweaking your online content so that it ranks higher on Search Engine Results Pages (SERPs). If lots of people who search Google for relevant keywords and phrases are shown your website on the first page of their results, you are doing a solid job with your SEO.

There are a lot of ways to improve your site’s SEO, and we’ve covered a variety of techniques in the past. Many SEO strategies involve spending a lot of time researching, or installing dedicated tools. However, there are smaller tasks that have an impact on your page rankings as well – such as whether you’ve added and optimized image alt text.

Google and other search engines have been taking advantage of the information presented by alt text for a long time. Their bots pay attention to the text of each alt tag, using it to gain a deeper understanding of your content ^[1]. This little bit of extra metadata can help a search engine grasp what the image itself is about. It also helps clarify the subject of the surrounding text.

If you want to get the most out of your image alt text, you’ll want to make sure to add it to each piece of embedded media in the first place. Then, you’ll want to optimize it to be as helpful to search engines as possible. Let’s discuss how to do both of those things now.

How to add and optimize image alt text in WordPress

Actually adding image alt text in WordPress couldn’t be simpler. In fact, the hardest part is simply remembering to do so. You’ll want to make it a part of your routine if possible. For instance, it can help to go through each page or post after you’ve finished writing it, and assign each image an alt text at once.

The way you do it will depend on if you’re using the block editor or if you’re still using the classic editor. Although most people are probably using the block editor nowadays, we will include instructions for both options for those of you classic editor holdouts that are still hanging on to it. Then we’ll wrap it up by going over some best practices to keep in mind when adding alt text.

• How to add image alt text in the block editor
• How to add image alt text in the classic editor
• Image alt text best practices

How to add image alt text in the block editor 🧱

Adding alt text in the block editor is extremely easy because you can do it right inside of any page or post. All you have to know is where to look for it, which is also very straightforward.

If you insert an image by directly uploading it to the image block from within your post or page, then all you need to do is click on the image. After you click on it, look over to the sidebar on the right and make sure that it’s toggled to “Block” and not “Post”.

You’ll see the ALT TEXT box, where – as it says – you can type your alt text.

Alternatively, if you upload your image directly to the Media Library, you can add the alt text there.

Pretty simple, right?

Now let’s take a look at what it looks like in the classic editor.

How to add image alt text in the classic editor 🏗️

To add alt text in the classic editor, click on an image in your page or post, and select the Edit icon:

Under the caption, you’ll see a field labeled Alternative Text. This is where you can enter your image alt text. Simply type it in, and click on Update!

Just like with the block editor, you can also do this immediately when uploading an image in your Media Library, using the same field:

As with most SEO-related tasks, however, it isn’t enough to simply add image alt text. You’ll also want to optimize it, to ensure that it will be effective. Below are some best practices to follow when creating alt text – whether in the block editor or classic editor.

Image alt text best practices 📝

Be descriptive ✏️

The primary goal is to convey the meaning or purpose of the image. If the image is a photograph of a sunset over a mountain range, “Sunset over mountain range” might be an appropriate alt text.

Keep it concise 🤏

While you want to be descriptive, it’s also important to be brief. Aim for a balance between brevity and clarity. In most cases, alt text should be under 125 characters.

Avoid redundancy 🚫

If the image’s content is already described by the surrounding text, then you may not need a detailed alt tag. Sometimes, alt="" (an empty alt attribute) is appropriate if the image is purely decorative and doesn’t add meaningful information.

Avoid starting with “Picture of” or “Image of” 🙅

Screen readers already announce an image, so it would be redundant. For example, instead of “Image of a golden retriever,” you can just use “Golden retriever.”

Use for functional images ⚙️

If an image has a function (like a button for submitting a form), describe the function rather than the image’s appearance. For instance, if there’s an image of a pencil that’s used to edit a post, the alt text might be “Edit post.”

Complex images 🤯

For diagrams, charts, or infographics, provide a brief alt text that summarizes the main point of the image. Then, elsewhere (like in the page content or a linked document), provide a more thorough explanation.

Image links 🔗

If an image acts as a link, ensure the alt text effectively communicates where the link goes or what it does.

Use keywords appropriately 👍

If you have a main keyword for your content, you’ll want to use it in alt text whenever it makes sense to do so. However, don’t get into the habit of keyword stuffing your alt text. Search engines might penalize you for over-optimized alt text – and it’s not beneficial for those with accessibility issues who genuinely rely on it as part of their user experience.

Multiple images conveying a single piece of information 🤝

If multiple images work together to convey a single point or piece of information, consider using one piece of alt text (on the primary image) and leaving the others blank.

Stay updated with W3C guidelines 📋

The World Wide Web Consortium (W3C) regularly updates its Web Content Accessibility Guidelines (WCAG). Stay updated with their recommendations to ensure your website remains accessible.

Test with screen readers (optional) 🔎

To truly understand the experience of visually impaired users, test your images with a screen reader. This will give you insight into how your alt text comes across and any potential issues that might arise.

If you keep these tips in mind, you’ll find yourself creating effective image alt text in no time!

Conclusion 🧐

Fortunately, adding and optimizing alt text couldn’t be simpler. In WordPress, you can do this directly within a post or page if using the block editor, or through the image edit screen if using the classic editor. Both editors also allow you to do it inside the WordPress Media Library if you upload your images there.

Do you have any other questions about how to use image alt text effectively? Let us know in the comments section below!