WordPress Images: Naming and Alt Tags

Adding images to WordPress websites is easy through the Media library, but there are a couple of important steps to consider when adding images – proper image naming and alt tags.

In this article we discussed the importance of sizing and compressing images, but naming and alt tags can make a substantial difference to your site’s usability, search engine optimisation, and accessibility.

Why Image Naming Matters

Have you ever uploaded an image with a filename like ‘IMG_20250321_123456.jpg’ straight from your device? While it might seem inconsequential, the naming of your image files affects several aspects of your website:

1. Organisation and Management

Consider a scenario where you need to locate a specific product image from your media library containing hundreds of files. Which would be easier to find: ‘IMG_20250321_123456.jpg’ or ‘blue-leather-sofa-front-view.jpg’?

Descriptive filenames make managing your media library significantly more straightforward. When you need to update or replace an image, clear naming conventions save valuable time that would otherwise be spent scrolling through cryptically named files.

2. Search Engine Optimisation (SEO)

Search engines cannot ‘see’ images in the traditional sense. Instead, they rely on contextual clues to understand what an image depicts. The filename serves as one of these crucial clues.

A well-named image communicates essential information to search engines, potentially improving your rankings for relevant searches. For example, ‘handcrafted-oak-dining-table.jpg’ provides clear information about the image content, whereas ‘DSC1234.jpg’ offers no useful context.

3. User Experience

When visitors save images from your site, the filename is preserved. A descriptive filename enhances user experience even after the image leaves your website. Additionally, the filename often appears in the browser’s status bar when users hover over an image, providing another subtle opportunity to reinforce your content.

Best Practices for Image Naming

To maximise the benefits of proper image naming:

• Be descriptive but concise: ‘vintage-leather-armchair-brown.jpg’ is better than ‘chair.jpg’ or an excessively long filename.
• Use hyphens to separate words: Search engines recognise hyphens as word separators, making ‘wooden-dining-table.jpg’ preferable to ‘woodendiningtable.jpg’ or ‘wooden_dining_table.jpg’.
• Include relevant keywords: Incorporate terms that potential visitors might use to search for your content.
• Maintain consistency: Establish a naming convention and apply it across your site.
• Avoid special characters: Stick to letters, numbers, and hyphens to prevent potential technical issues.

The Role of Alternative Text (Alt Tags)

While proper naming is important, alt tags (alternative text) are arguably even more crucial. The alt attribute is HTML code that provides a text alternative for screen readers and displays when an image cannot load.

1. Accessibility for All Users

For visitors with visual impairments who use screen readers, alt text is not just helpful—it’s essential. Without it, these users miss out on potentially important content. The web is for everyone, so all users should be considered.

A screen reader will announce the alt text to describe an image, allowing visually impaired users to understand what sighted visitors can see. For example, alt=”Woman using laptop while sitting in garden” provides context that would otherwise be completely lost. Additionally, good accessibility scores are required for good SEO.

2. Enhanced SEO Performance

Alt text provides another opportunity to include relevant keywords, helping search engines understand your content more thoroughly. Google specifically mentions alt text in their image SEO guidelines, highlighting its importance in image search rankings.

Unlike stuffing keywords into visible text, which can create a poor user experience, appropriate keyword usage in alt text serves a dual purpose: improving accessibility while potentially boosting SEO.

3. Context When Images Fail to Load

Even in our high-speed internet era, images sometimes fail to load due to connection issues, browser compatibility problems, or users disabling images to save data. In these scenarios, alt text appears in place of the image, preserving context and ensuring your message still comes across.

Crafting Effective Alt Tags

Creating useful alt text is both an art and a science:

• Be concise yet descriptive: Aim for fewer than 125 characters while still conveying the image’s purpose and content.
• Context matters: The same image might need different alt text depending on its context. For instance, a logo might be described differently on the homepage versus a team page.
• Avoid redundancy: Don’t begin with phrases like “Image of…” or “Picture showing…”. Screen readers already announce that it’s an image.
• Include keywords naturally: Incorporate relevant keywords, but prioritise accurate description over keyword placement.
• Decorative images: For purely decorative images that add no informational content, using alt=”” (empty alt text) is appropriate, telling screen readers to skip the image.

Implementing in WordPress

WordPress makes it straightforward to implement both proper naming and alt tags:

1. Before uploading: Rename your image files on your computer following the best practices outlined above.
2. During upload: In the WordPress media uploader, you’ll find an “Alternative Text” field. Complete this for every image with meaningful content.
3. After upload: You can edit alt text for existing images by visiting the Media Library, selecting an image, and updating the Alternative Text field.
4. Within posts: When inserting an image into a post or page, you can also add or edit its alt text in the image settings panel.

Conclusion

Properly named images with thoughtful alt text benefit everyone—from search engines to users with disabilities to your own content management. It’s a small time investment, but it is very useful and worthwhile, and so much easier to do as you upload each image instead of in bulk after everything has been uploaded.