An image of text refers to readable text that is presented inside an image, including text that is presented in a fixed image form in order to achieve a certain design style outside of pure text content.
The Web Content Accessibility Guidelines (WCAG) recommend avoiding using images of text if you intend the text to be read by the user, unless it’s essential or necessary such as in a logo or brand name, in which case the alt text should be the same as the text in the image.
Accessibility Issues that Images of Text Present
- When text that is intended to be read is presented as an image, visually disabled or impaired readers may be at a disadvantage for a few reasons, one of which is because screen readers and other assistive technologies cannot read text that's contained inside an image. They will try to read them, but require an accurate text alternative to do so.
- Images of text cannot be visually customized and appropriately resized by the user like text content that can be adjusted by most web browsers with dynamic font styling and sizing on multiple devices. While images of text can be enlarged, text size in images remains fixed.
- If someone has a slower or unreliable internet connection, their browser does not show or download graphics, or if there are any issues with the page loading properly, they’re at risk of missing out on important information that’s conveyed through the image.
- Images of text may hinder the search engine optimization (SEO) of a page. Search engines (like Google) rely on actual text to index content — they don't read images.
- Text can adapt to different screen sizes and orientations (think desktop vs mobile), and tends to wrap and display properly across them, remaining readable. Images of text are fixed in size and position, so they do not adapt as well.
- Text inside images cannot be copied.
- A page translator for multi-lingual users cannot translate image text.
Images of Text in Drupal Web Express
- In Drupal Web Express, images of text require alternate text that is 128 characters or less. Often users upload images of text that contain text that exceeds this limitation that cannot be provided adequately as alternate text.
- Web Express is designed to emphasize the WCAG guidelines around non-text content and images of text and not all forms of user supplied images of text can be accommodated for ADA compliance. For example, inserting thumbnails of text images into articles, images of text into backgrounds in blocks, etc.
- Web Express cannot distinguish between non-text content without text in images (photos and images or complex images) and images of text that are user-supplied.
- User access to graphic design software and expertise is not uniform and graphic design is subjective and variable in terms of color and contrast and other requirements for designing graphics that meet WCAG guidelines for acceptable use.
- Web Express webpages and all webpages provide no controls for site visitors to customize how images of text are displayed to them unless they are essential and provided in components outside of site managers' control to upload non-text content.
