WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: WCAG 1.4.8: horizontal scrolling

for

From: Terrill Bennett
Date: Jan 20, 2011 9:54AM

In my humble opinion, there's a difference between "zooming the
window" vs "resizing the text." The prior zooms everything including
images, the latter changes only the text.

There's a tool called "NoSquint" for Firefox that allows you to
resize text-only, among other things:
https://urandom.ca/nosquint/

If you go the following site, and click the various text sizes, and
note the menu on the left: the text changes size, but not the
division containing the menu:
http://www.visionaustralia.org.au/info.aspx?page=617

Yeah, you may have to cheat in some places and use pixels. Use your
web developer toolbar to see the properties of the division
(id="nav") containing the menu - most everything is specified as em's
or percents. But as you drill down the elements, you'll find that,
when using Firefox for example, the UL is defined for Mozilla as 40
px for -moz-padding-start.

-- Terrill --


At 10:52 AM 1/20/2011, you wrote:
>I'm in the process of redoing my center's website, which means that it's
>time for me to fully go through the WCAG 2.0 guidelines (the last big
>redesign we did was when 2.0 was still in the discussion stages). I'm
>confused by 1.4.8: part two states that lines be no more than 80
>characters long. Okay, that makes sense.
>
>But then part five says 'Text can be resized without assistive
>technology up to 200 percent in a way that does not require the user to
>scroll horizontally to read a line of text on a full-screen window.'
>
>This, to me, says that my container div should not be measured in ems,
>as a 200% increase in font size will definitely cause the window to
>expand to the point requiring scrolling. My next instinct was to use
>percentages for the container (as suggested in C24,
><http://bit.ly/fYe9Kl>;), but on a large monitor that would potentially
>very easily cause long line lengths (violating part two above). Also, on
>a smaller monitor (or on a window that isn't fullscreen), that causes
>unnecessary whitespace around the content.
>
>I could set it up with a min- and max-width, but they would probably be
>fairly restrictive, and again: I think it's silly to have whitespace on
>the side of a narrower window when a ~750px container would work fine.
>
>So then, I'm left with the option of a fixed width pixel based layout,
>which is pretty much the opposite of what I've always read to do. When
>you increase the font size you don't have to scroll, and if I code it
>properly the percentage-based widths inside for the content/sidebar
>should still play nicely.
>
>Have I totally misunderstood things? It seems like some of the W3C's
>suggestions of how to meet the guidelines contradict each other.
>
>--
>Dan Conley
>Information Manager
>Center for International Rehabilitation Research Information and
>Exchange (CIRRIE)
>University at Buffalo, Health Sciences Library B7
>Phone: (716) 829-5728
> <EMAIL REMOVED>
>http://cirrie.buffalo.edu
>
>
>