This is a picture of a desktop snd an overlay text saying, "SEO Image Metadata"

SEO Tips – The Alt Tag and Other Media Library Labels

This post explains the various components of image metadata in WordPress. Use this information for SEO and Pinterest optimization.

What is SEO? Search Engine Optimization – manipulating elements of your website in order to appear higher in Google searches. Think of the last time you searched for something – did you click on the first result? Did you click beyond the first page of results? Result position matters!

One of the things you can work with is your image metadata (data about data, ha!). In this instance, it is information about the images added to your website.

Look behind the curtain

When inserting an image into a post, we often see the image itself.

Behind the scenes (in the media library), each image comes with several meta options.

For each image, you will see input fields for URL, Title, Caption, Alt Text, and Description.

Picture of the backend of wordpress with attachment details.
Shows the backend of the image below.

After inserting an image into a post, this meta-information can be pulled directly into the post.

You can view what information is pulled in by clicking edit as text (classic editor) or view as html (new block Guttenberg editor).

View as html in Guttenberg.
View as html by clicking text in classic editor.

Code for this image:

<figure>
<img src="https://pitchclipsgraphics.com/wp-content/uploads/2019/04/I-am-an-image.jpeg" alt="hands typing on the computer with the text I am an image. But there is so much more to me!."/>
<figcaption>
This is my caption.
</figcaption>
</figure>
hands typing on the computer with the text I am an image. But there is so much more to me!
This is my caption.

Let’s take a look at each part of the meta data code above.

URL Meta

This is the web address for your picture. It is usually in the form of yourwebsite.com/image-file-name.

SEO experts advise to name the file something relevant like “ukulele featured post” as opposed to what mine were named in the beginning. I have countless files on my site named “screenshot-123.jpg” or “13847365093473.jpg.” :/

URL in code would look like this (Color coding only to show different parts and not necessary for the code to work):

<img src=”yourwebsite.com/image-file-name”/>

TITLE Meta

WordPress automatically adds the filename here. However, when inserting a picture, the title is not added to the meta code. The title is used for database searching. When you have hundreds of posts and want to reuse a picture, it is easier to search for “logo” than “124859503403.”

It is not currently advised to add the title to the image meta on your posts itself. Just make sure each of your images has a title in the library (usually the filename).

ALT Meta

The alt tag is supposed to describe what is actually in the picture. Pinterest used to use the alt meta as the pin description so many, many bloggers (myself included) used the alt tag for a keyword-heavy description. For example, instead of saying the image to the right is a “cover image with blue graphics”, I would have said “Check out how I can save you time and money by maintaining your website!” which does not describe the image at all.

Click to learn about maintenance plans!

The main purpose of alt tags are to improve accessibility by enabling screen readers to read out the alt text for visually impaired users. The alt text would also appear in place of the image if the image went missing from your server for some reason.

Alt text is also crucial for image SEO. It helps search engines understand the context of the image.

URL in code would look like this (Color coding only to show different parts and not necessary for the code to work):

<img src=”yourwebsite.com/image-file-name” alt=”This text describes what the picture actually is.”/>

DESCRIPTION Meta

The description meta is used to put in additional information about the images. It would appear IF the image was allowed to have its own page on your website but this is discouraged because it can damage SEO (Google sees it as a page with little to no text as low quality).

Use the plugin YOAST SEO to disable this.

Picture of Yoast plugin settings.
Picture of Yoast plugin settings.

CAPTION Meta

The caption tag is only useful for providing additional information for website visitors about the image. It is not necessary for most photos. The WordPress Maintenance picture to the right has a caption.

URL in code would look like this (note: this one is a little more complicated to manually add – you have to add all the purple sections). (Color coding only to show different parts and not necessary for the code to work):

<figure>
<
img src=”yourwebsite.com/image-file-name” alt=”This text describes what the picture actually is.”/>
<figcaption>
Here is the caption of the picture.
</figcaption>
</figure>