Text resize widgets are redundant artifacts of the 20th century web, many being poorly designed an poorly implemented. While these widgets were intended to assist with accessibility, in reality, they not only fail to improve accessibility, but they also detract from site design and negatively affect site performance.
In 1997, the W3C launched the Web Accessibility Initiative. Designed to educate designers and developers on how to improve accessibility on the web for users with disabilities, the WAI encouraged many designers and developers to implement their own solutions to solve accessibility needs. As the initiative grew, browsers began implementing their own solutions for users with disabilities. Opera 2.1, released in Dec. 1996, was the first browser to implement a “Zoom” feature, but it took 10 years for Microsoft to implement browser zoom, which was included in IE7. Today, all modern browsers support some variation of page zoom – with some browsers offering additional options like “Zoom Text Only”.
The main problem with text resize widgets is their inherent inaccessibility. Let’s consider, for a moment, whom text resize widgets might benefit. The first group that comes to mind is users with poor eyesight. Now, let’s examine what happens when a user with this type of disability visits a page that utilizes a text resize widget. Where should they direct their attention if they are unable to read the content of the page? The answer obviously being the text resize widget. But where exactly is the text resize widget? This varies from site to site, occasionally even from page to page, and besides, the visitor has a disability – poor eyesight.
Depending on the size, contrast, prominence and clarity of purpose of the widget, it can be very difficult for someone with accessibility issues to identify. Because these widgets rely on the users ability to locate them on the page, they are themselves inaccessible.
Not only does the text resize widget make the site less accessible for users with poor vision, it also diminishes accessibility and usability for a number of other users. As noted by Jared Smith on Web Accessibility In Mind:
Users who are blind generally don’t care how big the text is, yet they must listen to and navigate through the widget controls on every page. Users with motor disabilities who use only the keyboard must also ‘tab’ through these controls while gaining no benefit from them. Users with auditory disabilities gain no benefit. Users with cognitive disabilities must handle the additional cognitive load of these controls (what does a stack of increasingly sized A’s mean anyway?). And most notably, users with adequate vision gain no utility from the widget (again, assuming your default font size is adequate), yet are still presented with the control on each and every page.
To minimize overhead and improve the quality of each visitor’s experience, the target audience should always be carefully considered during the design phase – text sizes should be selected accordingly. Smith argues that the addition of a text resize widget is an admission of error by the designer – “either they are forcing the user to account for a poor design or usability decision, or they are too indecisive to make the decision to begin with and thus place the burden to decide upon the user.”
By including a text resize widget on a site, a designer is making two assumptions:
- a significant number of site visitors may require larger font sizes
- visitors are not savvy enough to establish a larger default font setting
Under these conditions a designer could, hypothetically, create a text resize widget that takes prominence, is clearly identifiable and appropriately size, that when implemented correctly could improve accessibility for a very small percentage of users. However, the designer must weigh the sacrifices in design, accessibility, and usability for every other site visitor.
The Bottom Line
There are much better ways to improve accessibility than using text resize widgets, for example:
- size text with relative units (like
ems) instead of pixels to ensure that built-in zoom functions properly
- leverage appropriate foreground-background contrast to improve readability
- select a font size which suits the needs of the target audience to improve the quality of a visit
- educate less-savvy users on how to use built-in functionality to make the web more progressive