Images of Text
8. Avoid Using Images of Text
- Images of text are problematic for mobile users: they cannot reflow, so the browser must resize them down, often resulting in very small text.
- Images of text are problematic for users with low vision: JPG and PNG images of text cannot be scaled up by users with low vision without becoming blurry.
- Images of text are problematic for screen reader users: all text in the image must be placed in the alternative text, in which all formatting is lost and all the text is read as a single object. This is not a problem for a few words, but anything more than that and the screen reader users has lost the ability to navigate within the text by lines, list items, headings, etc.
Whenever possible you should use real text, formatted and styled to fit your design, rather than an image of text.
Best Practices
- Use “real” text as your page content whenever possible.
- Always provide alternative text.
- For “short” images of text (logos, graphics), upload plenty of extra resolution so they look good on high-resolution screens and can be enlarged by users with low vision: e.g., use [...]