Alan P.
Alan P.

Reputation: 3123

Understanding WCAG resize text 1.4.4

To meet WCAG AA, the resize text requirement (1.4.4) states that:

1.4.4 Resize text: Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality. (Level AA)

I have a web-app that I am trying to make pass AA but find this requirement un-clear. If in Chrome I zoom in at 200% on a monitor that is 2560x1440, the app looks perfect. But if I use a 1024x800 monitor, the app does not look perfect.

What is the minimum resolution I need to support zooming at 200%, or am I missing the point?

Thanks.

Upvotes: 1

Views: 1396

Answers (2)

Adam
Adam

Reputation: 18875

What is the minimum resolution I need to support zooming at 200%, or am I missing the point?

You have to read Understanding Success Criterion 1.4.10: Reflow

Success Criterion 1.4.10 Reflow (Level AA): Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for:

  • Vertical scrolling content at a width equivalent to 320 CSS pixels;
  • Horizontal scrolling content at a height equivalent to 256 CSS pixels.

This states that you should be able to zoom up to 400% on 1280 CSS pixels wide resolution. There's also a paragraph which concerns "The relation of Reflow to the Success Criterion 1.4.4 Resize Text" and a note when "text does not consistently increase its size as people zoom" which refers to 1.4.4.

Upvotes: 2

Johannes
Johannes

Reputation: 67814

A typical situation where this should apply is, that text should wrap to the next line when the font-size gets too large to fit it into one line. So a one-line header's text will be wrapped, multi-line paragraphs and other elements will just wrap the text differently, so that all text remains visible on the screen.

Upvotes: 0

Related Questions