Add Alternate Image Titles for Better Blog Design - dummies

Add Alternate Image Titles for Better Blog Design

By Melissa Culbertson

An alternate image title (alternate attribute or what HTML calls alt) provides browsers with a way to handle a blog image when it can’t be displayed for some reason. In place of your blog image, the browser displays the alternate image text. An image might not display in a visitor’s browser for various reasons, such as a slow Internet connection, or a slow PC.

When you’re designing your blog, you want every component of your blog, including your images, to describe the purpose and content of your blog with text. Because the alternate image title is the most descriptive element in HTML for explaining the content of an image using text, it has even more importance from an SEO and navigation design perspective.

Include appropriate alt text in your blog’s design


Here you see the WordPress panel for editing the appearance of an image in a page. The sample shows its layout with respect to some adjacent text — not the real text of the page, but some Latin that WordPress uses as a placeholder. In the middle of the panel is the Alternative Text field. Notice it’s separate from the Caption field and the Title field.

When you enter a value for the alt attribute, in the HTML tag for the image, it looks like this:

   alt="Costa Rica butterfly"

Whether images are part of your blog’s main design or a single blog post, include relevant keywords in your alt attributes so that search engines can find them easier. A search engine user may navigate to your blog by finding an image first — for example, a crocheted blanket — and clicking on the image to read the post associated with it, where she may find instructions for crocheting it.

Alt attributes also improve usability, by enabling people with blindness or impaired vision to identify the images appearing on your site. Assistive devices can read aloud the text for each alt attribute.

Include other image attributes in your blog’s design

Notice the example WordPress image also shows a Title field. When the user hovers over an image, and it has a Title field, the browser shows that text at the mouse pointer location.

Although a title description can provide additional information about a photo, it’s more useful to people than to search engines. However, you can be more explicit with a Title field than with an alt attribute, which is more appropriately a summary.

If the theme of the blog includes a space for a caption, then its contents may be typed into the Caption field. This is for text you want your reader to see without having to hover over it first.

A title description is quite important if your blog readers use Pinterest. When someone pins a post of yours using a PinIt mobile bookmarklet, that bookmarklet pulls up the title description from the image accompanying that post. Pinterest then uses your image’s title as the pin description. Without the description, Pinterest pulls the image’s filename, which may be less descriptive.

Bottom line: When you use all the tools available to you for describing the topics of your blog, the more likely that a search engine will accept your blog as authoritative about those topics.