Search code examples
htmlcssaccessibilitysection508wcag2.0

Is it important to have relative units to ensure Section 508 / WCAG 2.0 Level AA compatibility?

I have all my font sizes defined in pixels, e.g. 

body {
  font-size: 14px;
}
h1 {
  font-size: 42px;
}

One of the online Section 508 / WCAG 2.0 Level AA compatibility checkers advised me to replace it with relative units to make it accessible to people who increased their font size via browser. Is that a real requirement to follow? I doubt because none of the other online checkers advised me so (although I do understand that it's not always possible to test it automatically).

Solution

  • As far as I know, 508 does not specifically require that font size be adjustable, but experts expressly recommend allowing font resize. Nielson says:

    Let Users Control Font Size: Tiny text tyrannizes users by dramatically reducing task throughput. IE4 had a great UI that let users easily change font sizes; let's get this design back in the next generation of browsers.

    On this line, Section 508 § 1194.21(g) does state:

    Applications shall not override user selected contrast and color selections and other individual display attributes

    which includes font size and is compatible with the WCAG text resize success criterion that:

    The author's responsibility is to create Web content that does not prevent the user agent from scaling the content effectively

    So long as you're not forbidding text resizing (like using images of text or using the text-resize-adjust CSS), you're good. But, at the end of the day, the use of relative font size provides for a better experience resizing text, which includes not just size of the font but attributes like line wrapping.

    For these reasons, I'd consider relative font sizes important for aesthetics but not important for accessibility.