WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: complex form questions


From: Guy Hickling
Date: Jun 16, 2016 5:50PM


For your second question, normally, setting both height and width of a
text container in px units is a definite no-no for accessibility.
Text-only zoom, in any browser that allows it, for instance Firefox,
is a very useful tool for people with poor sight because they can
increase the text size but still keep the whole page within the window
without having to scroll horizontally to read long lines of text, or
other content. (IE11 no longer allows text-only zoom, IE10 did.) The
WCAG specifies allowing upto 200% without corrupting content, but some
users will go as high as their browser will allow.

Unfortunately what happens is that, as the user increases the text
size, the container can only remain the same size if it's dimensions
are in pixels. This means text overflows outside it's container,
overwriting whatever's to the right or below it. This is seen
regularly on all too many sites, where one lot of text overwriting
another lot makes both texts unreadable. (The problem also occurs with
responsive media queries if the media breakpoints are in px units.)

You can set one dimension, usually the width, in px units, but the
other should not be restricted so the box can expand along with the
text, and other items on the screen must also be able to move down to
make way for the expansion, so they mustn't be positioned with px
units either.

If you can zoom to 200% on a particular screen and get away with it
without overwriting anything, perhaps because there is enough empty
space in your containers for the text to expand into, you're lucky,
but this isn't normally the case.

Guy Hickling