WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: WCAG 1.4.8: horizontal scrolling

for

Number of posts in this thread: 5 (In chronological order)

From: Dan Conley
Date: Thu, Jan 20 2011 8:51AM
Subject: WCAG 1.4.8: horizontal scrolling
No previous message | Next message →

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 ADDRESS REMOVED =
http://cirrie.buffalo.edu

From: Jared Smith
Date: Thu, Jan 20 2011 9:12AM
Subject: Re: WCAG 1.4.8: horizontal scrolling
← Previous message | Next message →

On Thu, Jan 20, 2011 at 8:52 AM, Dan Conley < = EMAIL ADDRESS REMOVED = > wrote:

> 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.

Pixel based widths aren't entirely bad (as opposed to pixel heights,
which very often problematic). As you note, it may be a good option
here. I think min- and max- width based on a percentage base generally
works better, though this is much more complex to code. Using ems for
widths rarely works well.

> Have I totally misunderstood things? It seems like some of the W3C's
> suggestions of how to meet the guidelines contradict each other.

This is why this is a Level AAA success criteria, and a bit of an odd
one in that - like they threw everything left over into one place. I
wouldn't at all stress about meeting every letter of all the
recommendations or you'll likely go crazy. You clearly understand the
issues, so implement those that you know to be most important. If you
can find a good balance between line length and limited horizontal
scrolling, do that.

Jared

From: Simius Puer
Date: Thu, Jan 20 2011 9:18AM
Subject: Re: WCAG 1.4.8: horizontal scrolling
← Previous message | Next message →

"Text can be resized without assistive..." ...not the containing element
that is where I think you are getting confused. If a user chooses to blow
up the entire screen so it is wider than a regular view-port then they will
be used to scrolling horizontally.

It's a combination of many things but basically if your text is allowed to
re-flow naturally (e.g. you have no containers with a "height" on them) then
you should be okay. Obviously there are a lot of other factors but just
apply a good helping of common sense ;]

From: G.Sørtun
Date: Thu, Jan 20 2011 9:45AM
Subject: Re: WCAG 1.4.8: horizontal scrolling
← Previous message | Next message →

> 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.

I have found a width in percentage combined with max-width in 'em' and
min-width in 'px' to work well both for font resizing and page zooming
at the user-end.

From: Terrill Bennett
Date: Thu, Jan 20 2011 9:54AM
Subject: Re: WCAG 1.4.8: horizontal scrolling
← Previous message | No next message

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 ADDRESS REMOVED =
>http://cirrie.buffalo.edu
>
>
>