As you add photos and graphic images to your blog posts, you may have noticed the image uploader includes a field for alternate or Alt Text. Here’s what it looks like in WordPress.
In some browsers, the text entered in that field will appear as a “tool tip” when you hover your mouse over the image for a second or two. In screen readers – applications that read the contents of a web page to your blind visitors – that text is read to them to describe the image they cannot see. If there’s nothing entered in the Alt Text attribute, the screen reader can’t give your blind reader any information about your image.
Unfortunately, several blog platforms do not offer the ability to include the alt attribute in the HTML for your images. This makes it a little more difficult, but not impossible, to do it yourself. You can view your content in HTML mode and add the alt attribute yourself.
All you need to do is add alt= and whatever short description you want to include inside quotation marks. Some blog editors may already have an empty alt attribute included in the image HTML (alt=” “) and all you need to add is your description.
Here’s what the HTML for the above image looks like:
<img src="http://moultriecreek.us/gazette/wp-content/files/2010/07/AltText01.jpg" alt="Alt text example in WordPress image editor" />
If helping the less fortunate isn’t enough to get you mucking around in the HTML goo, here’s something else that might. Search engines are also blind so including an alt attribute with a concise description makes that image visible to them too. You never know who might be searching for photos of Cousin Rob Dan and his bomb shelter and little steps like this make your blog and its contents more visible to the search engines and your research cousins using them.
Learn more about online accessibility and other Web style issues in The Yahoo! Style Guide – available at Amazon.