Ever wonder what alt text is? Or how at least one image can have a significant impact without looking at its description?
Many people, including those with cognitive or learning difficulties, find literature that includes images and visuals more enjoyable and easier to understand. They help those with visual impairment who can’t see the page’s content, context, or equivalent text to the image find their way around the page.
Words describe most images that users see on the web page. An appropriate alt text next to your image can make your visual content and home page convey information.
Images that relate to the relevant keywords seen on the content can also help with the image search results on search engines. If a user has the same image but has a missing alt text, you can use image links to look for the article or use the search term.
In this article, we will tackle what alt text is, its best practices, and some examples that make sense.
What is Alt text?
Alt text, also known as ‘alt attributes’ or ‘alt descriptions,’ is a textual representation in HTML or other formats that describes an image’s content or function, primarily for screen reading software used by visually impaired users. This text is crucial for accessibility, as it is read aloud by screen readers, and serves as a substitute for an image in cases of broken links or insufficient bandwidth to load images.
Beyond accessibility, alt text plays a vital role in Search Engine Optimization (SEO), helping search engines understand the content of images and thereby improving a website’s visibility and ranking. Therefore, writing clear and descriptive alt text is not just a practice for inclusivity but also a key factor in creating SEO-friendly web content.
Why is Image Alt text important?
Suppose you add an image or graphic to your content without a proper or empty alt attribute (alt tag). In that case, it might be challenging for persons with visual impairments to use your site with assistive technologies. Those screen reader users with low or no vision might benefit significantly from alt text on images.
Image alternatives can also improve a website’s search engine optimisation and are helpful for users with cognitive disabilities, slow connections, and intermittent connections to the internet.
A few of the strongest justifications for employing alt text are as follows:
1. Accessibility
Accessible web design includes alternative text. Its original and main goal is to tell visitors who can’t see what pictures look like. This includes people who can’t see images or can’t tell what they are just by looking at them.
It also includes screen readers and browsers that block images.
Adding alt text to your images ensures that all users, no matter how well they can see, can enjoy the content on your site.
2. Image SEO
If you want to enhance user experience and SEO, you should be adding alternative text to your images. As well as using proper image file names and titles, adding alt text to images may also improve their search engine optimisation.
While some search engines have gotten considerably better over the years at recognising images, they still can’t “see” the images on a site page the same way we do. Therefore, leaving the perspective up to them is not a good idea. If they misunderstand or misapply your instructions, you could end up ranking for terms you didn’t intend to target.
Search engines use good alt text to return search results because it gives semantic meaning and a description of an image. Good alt text provides search engines with more and better information to use when ranking your website, improving your website’s ranking.
3. User Experience (UX)
Users with impairments benefit from using alt text since it improves the UX for everyone. For example, a user may not see photos on your site because their connection is too slow.
In this way, the alt text for a broken link will be displayed with the icon. This will help them understand the message conveyed by the image.
Search engine robots will more easily understand your material if you take the time to describe it in detail for human readers.
4. Image Traffic
Using alternative text can make your images clickable in image packs or on Google Images. Image packs are a form of specialised search results that typically appear in any naturally occurring horizontal arrangement of image links.
Images featured in either Google Images or image packs increase the possibility of getting organic traffic to your site.
Alt Text Best Practices
If an image on the web does not load for some reason, the viewer will see some alternative text. Screen reader software uses this language to describe images to visually-impaired users, and some search engines use it to better index and rank your site.
The alt text for an image should be descriptive but relevant to the content of the page it’s on. One of the simplest methods to improve the accessibility of your website is to include descriptive alt text for all images.
However, doing it right can be challenging. If done incorrectly, it might reduce web accessibility. In many cases, not having any alt text is preferable to having unpleasant or irrelevant alt text.
To write alt text for images, below are some best practices :
1. Be specific in describing the image
Do not offer any judgments or opinions in your description of the image. Say what you perceive without making assumptions about people’s identities, context, or motivations.
Even though a complete sentence isn’t always required, we recommend using only a few. Note that screen readers may cut off alt text at roughly 125 characters, so it best stays within that limit.
Ensure the alt text you enter fits the image’s subject and context for a better SEO strategy.
2. Keep it short and simple
When it reads aloud to the visually impaired, screen reading software will often pause at this point to avoid making the service user listen to an unpleasant pause in the middle of a lengthy alt text.
If you want screen reader users to take their time reading and processing data, concise alt text to less than 125 characters.
3. Use keywords sparingly
It would be fantastic if you could reasonably use one or two high-quality keywords while describing an image. Optimising your site in this way is a good idea. That said, it should be done sparingly and honestly.
Only use the term you want people to find your post if it fits naturally within the alt text. You should focus on semantic keywords, the most relevant phrases within a longtail keyword. For example, since “how to” might not fit organically in the image alt text, you might use “lead generation” instead of the article’s head keyword “how to generate leads.”
Although search engines may not penalise you for keyword stuffing, they will ignore ‘poor’ alt text if it is irrelevant to the context. You must also provide detailed yet concise descriptions of any images that call for alternative text. That’s something Google is aware of.
4. Never include the phrases “An image of” or “A picture of”
Start reading the image’s description right away. From the article’s HTML source code, a screen reader tool and Google will be able to tell that it’s an image. It’s already thought your alt text is linked to an image, so there’s no need to indicate it.
5. No need to add Alt Text to “decorative images”
Photos of your venue or media outtakes from a show are examples of “illustrative” images. They aid in information transmission by providing background. ‘Decorative’ images include items like page separators or brand designs.
They make things appear pleasant or aesthetically break up content on a page. They don’t add anything to the page’s readability if provided alt text because they have no meaning outside the page’s context.
Ideally, purely decorative images should be placed within your code rather than inserted as ‘content’. If they need to be posted as photos, not adding alt text is OK — a screen reader user would skip them, and that’s what we’re aiming for in this circumstance.
How Alt Text Affects SEO
Here’s how incorporating effective alt text can significantly impact your website’s SEO performance:
Improved Image Search Ranking
Search engines, like Google, use web crawlers to understand and index the content on your website. As these crawlers cannot ‘see’ images, they rely on the alt attribute to ascertain what the image represents. Providing accurate and relevant alt text helps Google crawlers index the image correctly.
When a user performs an image search, the search engine uses the alt text as a reference to determine the relevancy of your image to the search query. When your alt text is accurate and matches a user’s search, your image is more likely to appear in the search results, thereby increasing your image search visibility.
Enhanced Organic Traffic
When a user searches for a specific image through Google, and you have an image on your website with the alt text of what the user is searching, your image is likely to surface in the search results. This drives organic traffic as users following that link will end up on your website.
If you didn’t provide alt text, your image fails to be indexed correctly, and it will not appear in the search results. This means that you potentially miss out on valuable traffic to your website from image searches.
Better Content Relevance
The use of alt text contributes significantly to the overall relevance of web content because alt text provides a textual context to non-textual elements, thereby enriching the overall content structure. When the alt text is accurately descriptive, it helps to improve the semantic richness of your content, further enhancing the relevance factor.
Accessibility and SEO Synergy
Improving website accessibility through alt text also indirectly has a positive impact on SEO. By catering to visually impaired users who use screen readers to navigate the web, you improve your website’s overall user experience. Higher engagement can lead to lower bounce rates and higher time spent on your site, metrics that search engines consider when ranking websites.
Examples of Good & Bad Image Alt Texts
According to Google, alt text is combined with computer vision algorithms and the data of the website — to interpret the subject matter of photographs.
Therefore, including alt text aids Google in understanding the images on a page and the website’s content as a whole. The likelihood of your photographs showing up in image search results may improve if you do this.
When generating material on a topic, consider how your audience might prefer to discover solutions to their inquiries on that issue. Google users aren’t always looking for the traditional blue, linked search result; sometimes, they want the image directly integrated into your page.
Here are a few instances of alt text examples in use:
Image 1: Mixed Chocolates
Not so good Alt Text:
<img src=”chocolates.jpg” alt=”chocolates”/>
“Chocolates” is rather vague and lacks specificity. It does not provide a clear description or context about the image.
Good Alt Text:
<img src=”chocolates.jpg” alt=”valentine’s day chocolates, roses, and a letter”/>
“Valentine’s Day chocolates, roses, and a letter” provides a specific and detailed description of what is in the image, offering context and relevance.
Image 2: A dog
Bad Example of not providing for an alt text:
<img src=”dachshund-dog.jpg” alt = “”/>
Leaving the alt text empty is a missed opportunity. It provides no description whatsoever, leaving visually impaired users and search engines in the dark.
Example of keyword stuffing:
<img src=”dachshund-dog.jpg” alt=”dachshund dog dog digging sand dog playtime”/>
It can be seen as spammy by search engines due repetitive use of the word “dog” in the alt attribute and does not offer a streamlined, understandable description for those using screen readers.
A better version:
<img src=”dachshund-dog.jpg” alt=”dachshund dog”/>
Example of an optimized alt text:
<img src=”dachshund-dog.jpg” alt=”brown dachshund dog digging in the sand”/>
“Dachshund dog” and “brown dachshund dog digging in the sand” offer a succinct, descriptive summary of the picture. It effectively communicates the contents of the image to both search engines for optimal indexing and screen readers for accessibility.
Tips for Writing Alt Text for Different Types of Images
Writing effective alt text for images requires understanding the context and purpose of different image types. Below are tailored tips to help you craft appropriate alt text for various kinds of images:
Product Images
When describing product images, describe the image and its context. Image alt text should include the product name, company name, and any relevant details about the image. For instance, “New Nike Air Max 90 Green Olive Bone Shoes Sneakers Men’s Size.”
Informative Graphics and Charts
For informational graphics and charts, provide a concise description of the content, focusing on the essential meaning or purpose of the image. Be concise and prioritize clarity in your image alt text. For example, “Global Internet Users Over Time January 2022”
Tools and Resources for Generating Alt Text
There are several tools and resources available that can assist in generating alt text for images. These include automated alt text generators, manual alt text guidelines, and accessibility testing tools.
- Automated Alt Text Generators: Tools such as Alt Text Wizard and Accessibility Checker use AI algorithms to generate alt text for your images.
- Manual Alt Text Guidelines: The Web Accessibility Initiative offers detailed guidelines on how to write effective alt text for images.
- Accessibility Testing Tools: Tools like AChecker and WAVE can help evaluate the accessibility of your website, including image alt text.
Conclusion
Alt text is by far the most crucial part of image SEO. Use alt text on all your images to help visually impaired users explore your page more easily.
Simultaneously, the alt text is the most vital part for ranking your images high on Google image search, and it can also improve your page to rank up in Google web search.
The most effective alt texts are both concise and informative, accurately describing the image in terms that users are likely to enter into a search engine. This approach ensures that your images are both accessible and SEO-friendly, thereby enhancing the overall user experience of your website.