Why you need to add alt tags to your website images and how to do it easily

First, let’s answer the question – what IS an alt tag (or “alternative text”)?

An “alt tag, also known as “alt attribute” and “alt description,” is an HTML attribute applied to image tags to provide a text alternative for search engines.”

Why should you use alt tags?

  1. One use for alt tags is for accessibility – they allow screen readers which are used by the visually impaired to read the alt attribute so users can better understand what the image is about.
  2. They also will show in place of an image if there’s an issue with an image loading properly.
  3. And alt tags provide better image context/descriptions to search engine crawlers which helps them index images properly.

What that means is alt tags are metadata that offer text descriptions of web images for search engines and screen readers for the visually impaired. Alt tags also help search engines understand what your website is about and they can help your site rank higher in search engine results.

What is the best format for alt tags?

You want your alt tags to be descriptive without being spammy attempts at keyword stuffing.

Let’s look at a few examples.

food styling, healthy eating, breakfast food

Basic: <img src=”pancakes.png” alt=”pancakes”> 

This is ok but basic because it’s not very descriptive. I mean, sure – it’s a stack of pancakes but there’s more to it than just “pancakes.”

Good: <img src=”pancakes.png” alt=”Stack of pancakes on a white plate with dusting of powdered sugar and blackberries”>

And that’s better. Because this just isn’t a stack of pancakes; it’s a stack of pancakes with dusting of powdered sugar and blackberries. This description tells us exactly what the image is about and allows to visualize it.

How to write good alt text

  1. Describe the image is descriptively as possible. Alt text is, first and foremost, designed to provide text explanations of images for users who are unable to see them.
  2. Keep it relatively short. Most screen readers cut alt text off at 125 characters so they shouldn’t be long.
  3. Use your keywords. Alt text gives you another opportunity to include your keywords on page.
  4. Avoid keyword stuffing. Google doesn’t dock you for poorly written alt text, but you’ll be in trouble if you use your alt text as an opportunity to stuff as many keywords into it as you can think of.
  5. Don’t use images as text. Search engines can’t read text ON your images and neither can screen readers.
  6. Don’t include “image of” or “picture of” in your alt text. It’s already assumed your alt text is image so it’s unnecessary.

So, now. . . how do you add alt tags?

First, open your post and click on the image. In the right sidebar, you’ll see a options for that block, under Image Settings. There will be a section labeled “alt text (alternate text)” and you simply add your description. Be brief. Ideally, you’ll want to use keywords.

Then, be sure to save and update your post. That’s it!

Photo on 6-23-18 at 1.53 PM

Annie Anderson

Hi, I'm Annie. . .

"Your instructor for How to Build a Course on WordPress as well as the one behind this website. I'm a graphic designer and web developer with over 25 years experience. I've been working with WordPress since 2005, have spoken at WordCamp Seattle and other local venues, and specialize in building course and membership sites for my clients.

nikiya-christie-l4BrIn6JWBY-unsplash
READY TO SCALE YOUR BIZ?

Build Your Course on WordPress

You've probably heard about course building platforms like Kajabi, Teachable, Thinkific, and others, but did you know you can also build your course on your WordPress website?

Yes, you sure can! There are a host of LMS (Learning Management System) plugins out there. And in this course, I'll share all my tips and tricks with you to find the right one for your needs and then walk you through building your course from beginning to end.

Scroll to Top