W3C home > Mailing lists > Public > w3c-wai-gl@w3.org > January to March 2004

Re: [techs] New draft: CSS Techniques for WCAG 2.0 (A & R Units)

From: Wendy A Chisholm <wendy@w3.org>
Date: Wed, 07 Jan 2004 15:39:08 -0500
Message-Id: <5.2.0.9.2.20040107150111.02a14dc0@localhost>
To: gdeering@acslink.net.au, Jens Meiert <jens.meiert@erde3.com>
Cc: w3c-wai-gl@w3.org

Geoff,

You wrote:
>What is the Accessibility / Usability rule of thumb for using absolute and 
>relative units?  Can someone please point me to a very good explanation to 
>this (with examples), because it seems to me that something like the above 
>example is much better being addressed in relative units (maybe I'm wrong).
>I use relative as much as possible.  For what cases should absolute be 
>used in place of relative?

The two relevant sections of the CSS Techniques doc are:
1. 2.9 Using relative units of measure 
<http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-CSS-TECHS-20031219.html#units-that-change>
2. 2.10 Using absolute units of measure 
<http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-CSS-TECHS-20031219.html#units-for-static>

Section 2.9 quotes Charles Munat, " Think about what needs to change in 
size and what doesn't. Raster images, for example, have fixed width and 
heights. We specify them in the img tag in pixels...Similarly, if I just 
want to move the text away from the border of the page, setting the padding 
on the body to 5 px shouldn't be a problem. Text, on the other hand, should 
always be free to change size (a good reason not to use text in images). 
But when my text doubles in size, do I need the gutter next to it to double 
in size as well? Probably not. In fact, doubling the gutter might even 
decrease the usability of the page."

>   In the case of this CSS Tech doc, which encourages absolute for 
> margins, in pixels, does that only apply to media for screen only?  What 
> do you do for handhelds, etc.  Doesn't there need to be a distinction here?

Good questions.  CSS Techniques is primarily written from the point of view 
of HTML. We need to generalize it for other technologies and/or move some 
of the existing CSS Techniques into a CSS section of the HTML Techniques.

>  What is wrong with
>
>BODY { margin-left: 0.5em; margin-right: 0.5em}
>
>instead of
>BODY { margin-left: 15px; margin-right: 15px}
>
>Isn't the relative one more flexible for user and device?

Relative is more flexible, but as the font size increases so does the value 
of "em" and therefore the margin increases and you end up with a lot of 
white space.  This can squeeze the width of the text into a narrow column 
making it difficult to read.  In "CSS Design: Creating Custom Corners & 
Borders" by Søren Madsen [1] font-size *and* margins are in ems, width in 
percent, but it is padding that is defined in pixels.  This works well in 
Mozilla 1.5 when I increase the font size to 200%, except that the white 
border in the middle column ends about half-way down the page.  Therefore, 
we ought to test the following "rule of thumb:"
if you specify margin alone, use an absolute unit otherwise you can use 
relative units for margin, but use absolute for padding.

I'm looking for more articles and examples, please send related links to 
the list.

--wendy

[1] http://www.alistapart.com/articles/customcorners/

-- 
wendy a chisholm
world wide web consortium
web accessibility initiative
http://www.w3.org/WAI/
/-- 
Received on Wednesday, 7 January 2004 15:42:41 UTC

This archive was generated by hypermail 2.3.1 : Wednesday, 5 February 2014 07:17:54 UTC