Text in images

It is possible for an image to contain text.  This could be incidental, as in the name stencilled on the window of a storefront pictured in the image.  It could be intentional, as in an illustration with labels.  Or it could be as a replacement for text, i.e. the image contains only text (usually done to ensure that the text font will appear exactly as shown in the image).

Truth

Some people with slow connections or a shortage of patience normally browse with image loading disabled.  Audio user agents, used by the blind, cannot, unaided by alt text, speak the text that appears in an image.  Unlike plain text, the foreground and background colors cannot be altered by the user to improve visibility.

Text in images is not resized along with normal text.  Few browsers allow images to be resized by the user.

Text in images is not seen by search engines.

Consequences

If you rely on text in images to communicate your message, some of your visitors won't receive it, or may have to struggle (if the text is smaller than their preference).

Text in images will not contribute to search results.  Example: If the words 'hand crafted' appear only in an image on a page, search engines will not be able to direct people searching for those words to that page. 

Recommendations

Avoid using text in images.  If you must, ensure that the same information is conveyed somewhere other than within the image.

Tips

  1. Always specify alt= text within the <img> tag.
  2. If you are using an image in place of text, consider setting its width in ems, so that it gets larger as the text size is increased.  Note that this has consequences for image quality.  See Image size.

Last revised 14 Mar 2006