Text can be resized without assistive technology up to 200 percent without loss of content or functionality. (Level AA)
If text can be scaled until its default size is doubled, more users are able to read the information. This increase in size can be achieved either by zooming all content OR by increasing just the text size. In both cases, this resizing is normally achieved by the user agent (i.e., web browser or view controller). The author's responsibility is to create content that does not prevent the user agent from scaling the content effectively.
To meet this requirement, confirm that scaling works and ensure there are no visual or functional issues as a result of the increase, such as:
- a lack of appropriate line wrapping
- truncated, overlapped or obscured text
- missing scrollbars when content is zoomed
In cases where content fails to respond to the platform’s scaling features authors must provide a way of resizing text.
Note: For some interactive content, such as editable cells in a table, truncation is acceptable if the component's full content is available on focus or after user activation, and an indication that this information can be accessed is provided to the user in some way besides the fact that it is truncated.
Exception: Media captions and images of text are excluded from this checkpoint's requirements. Caption resizing is normally a feature of the player or platform, not the author's responsibility. Images of text (which are covered under SC 1.4.5) do not normally scale well.
Refer to Understanding SC 1.4.4 for more information (external link to WCAG).
This paragraph appears generically in all checkpoints. Review the General techniques as well as other tabs applicable to your technology. Prioritize the use of technology-specific techniques, and implement the General techniques as needed. You are always required to find, understand and implement accessible code techniques to meet the checkpoint. The documented techniques and supplements are not exhaustive; they illustrate acceptable ways to achieve the spirit of the checkpoint. If numbered, techniques are in order of preference, with recommended techniques listed first. Where used, IBM information that complements the WCAG techniques is indicated as supplemental.
Instructions: Any item in situation A represents a technique that is deemed sufficient to scale text. Techniques in situation B may be used to ensure content responds to scaling. Ensure you review WCAG Common Failures to avoid development mistakes.
Situation A: Scale text
- G142: Using a technology that has commonly-available user agents that support zoom
- G178: Providing controls on the Web page that allow users to incrementally change the size of all text on the page up to 200 percent
Situation B: Ensure no loss of content or functionality
Instructions: In addition to the General techniques, any of these Web techniques are deemed sufficient in the following situations when used as instructed.
Situation B: Ensure no loss of content or functionality
Items in this section represent techniques which can be used to ensure no loss of content or functionality when just text resizes.
- C28: Specifying the size of text containers using em units
- C12: Using percent for font sizes
- C13: Using named font sizes
- C14: Using em units for font sizes
- C17: Scaling form elements which contain text
- C20: Using relative measurements to set column widths so that lines can average 80 characters or less when the browser is resized
- C22: Using CSS to control visual presentation of text
- SCR34: Calculating size and position in a way that scales with text size
Instructions: In addition to the General techniques, the following technique is deemed sufficient for Mobile Native (iOS) applications to meet this checkpoint.
Applications that support Dynamic Type will automatically adjust to preferred text size. Apple has predefined fonts that will respond accordingly when the user changes their text size preference.
font-family: Arial, sans-serif;
Note: No specialized code is required on iOS to meet the following requirements:
- User agent zoom: The Zoom mode provided in iOS meets the requirement of a user agent for zoom because it is provided on all devices and integrates with all applications.
- Resizable content: Ensure that text containers resize when the text resizes and use measurements that are relative to other measurements in the content.
- Preserve all content: Ensure that there is no loss of content or functionality when the text resizes and text containers do not resize.
Instructions: Eclipse applications must meet the following required development techniques. Meeting these techniques is sufficient for meeting the requirements of this checkpoint.
Applications must provide support for system font sizes as outlined in Checkpoint 503.2 User Preferences
If the application provides an embedded browsing experience, the embedded browser must meet the requirements outlined in the General techniques and Web (HTML, ARIA, CSS) techniques of this checkpoint.
Instructions: Windows-based (MSAA+IA2) applications must meet the following required development techniques. Meeting these techniques is sufficient for meeting the requirements of this checkpoint (1.4.4).
Applications must provide support for system font sizes as outlined in Checkpoint 503.2 User Preferences.
If the application provides an embedded browsing experience, the embedded browser must meet the requirements outlined in the General techniques and Web (HTML, ARIA, CSS) techniques of this checkpoint (1.4.4).
Many links in this checklist reside outside ibm.com at the Web Content Accessibility Guidelines (WCAG) 2.1. W3C Recommendation 05 June 2018: http://www.w3.org/TR/WCAG21/
Copyright © 1994-2019 World Wide Web Consortium, (Massachusetts Institute of Technology, European Research Consortium for Informatics and Mathematics, Keio University, Beihang University). All Rights Reserved.
Copyright © 2001, 2019 IBM Corporation