DES 4.3 Avoid using images to display text
Text within images can be difficult to read, especially for some people because:
- Images don't scale when text size is increased by the user;
- Magnified images can appear highly pixilated
(or fuzzy):- particularly for small (and anti-aliased) text.
Using text properly reduces file size, permits scaling and easy updates, and reduces potential for accessibility errors ( such as missed alt text).
- If possible, always use text rather than images of text. Exceptions:
- logos
- Important special text effects;
- Important brand communications;
- Illustrations (such as in this document).
- Avoid putting essential text within an image.
- Avoid putting large paragraphs of text within an image.
- Avoid using images of text for important navigation (menus, etc.).
Tip: Often the same visual effects can be produced using CSS to style text and background images.
Tip: Where text as images is used, check the clarity by magnifying the image. Sometimes minor adjustments to size or position can improve the fuzziness caused by anti-aliasing.
