Quality, engaging content is a prerequisite for search engine optimization. If your website relies on publishing a lot of text content, that means you need to include images. Images, such as photos, illustrations, infographics and others, are key to making your content look more attractive and consumable - greeting visitors with a long, unbroken wall of text will result in low time on site and high bounce rates. The problem with images, from an SEO perspective, is that while computers can maybe pick out general shapes and colors in an image, they can’t really tell what’s going on in the image. That means when a search engine crawls your page, it won’t "see" the image, and that’s a problem.
If search engines don’t know what’s in an image, there’s no way for them to tell how it relates to the page content, or if it does at all. They also won’t be able to figure out if it’s relevant to an image search query. Fortunately, there’s a relatively simple way to solve this problem to improve your SEO and user experience: image alternative text.
Alternative text, often just called "alt text," is an HTML attribute added to image tags to provide a description of the image:
<img src="https://www.example.com/example-image.jpg” alt=”This is the alt text”/>
When the browser can’t load a graphic, it displays the alt text in the image container instead. Here's an example of a browser displaying the alt text in an image container when it is unable to load the actual image:
Alt text is also used by screen readers and other assistive technologies for visually impaired web users.
From an SEO perspective, alternative text is considered one of the most important factors for image optimization, and possibly the most important after image file name. It’s your opportunity to, in a sense, add keywords to your images to help them rank in search results. When writing alt text, be descriptive and detailed - you’re writing a description for someone (or something) that can’t see.
When writing your alt text, be sure to include the page’s target keyword, which shouldn’t be too hard since, ideally, your image is topically related to what you’re talking about on the page. It’s best to stick with just one keyword unless you have two that are extremely closely related. Keyword stuffing, as always, should be avoided.
Try to be as specific and detailed as possible when creating alt text, and use natural language that a person would understand. This is for two reasons:
Alt text is used by humans, so good alt text is good user experience, and good user experience is good SEO.
When your alt text more closely matches the way people type searches into Google, the higher it will likely rank.
Don’t go overboard on detail, though. There’s no hard and fast character limit (like with title tags or descriptions), but Google advises that you keep it on the short side. Here’s are some examples of alt text for an image on a page targeting the keyword "celebrating panda":
Here’s the HTML for that image tag:
<img src="https://s3.amazonaws.com/woocms.woorank.com/2016/Nov/celebrating_panda-1480416313590.jpg" alt=”Celebrating panda in orange party hat sitting at computer”/>
This represents the ideal alt text: it describes what’s happening in the image, uses the target keyword at the beginning and mentions a semantically related keyword, "party hat". Using just the keyword, “celebrating panda”, as the alt text isn’t ideal because it doesn’t fully describe the image, but it’s better than leaving it blank. Stuffing the alt text with keywords, like the image tag below, is the worst case scenario as Google views this practice as evidence of web spam:
<img src="https://s3.amazonaws.com/woocms.woorank.com/2016/Nov/celebrating_panda-1480416313590.jpg" alt=”Celebrating panda, panda, happy panda, panda party, party panda, panda celebrating, panda bear, celebrating panda bear”/>