WCAG: Relative and Absolute Units

WCAG Accessibility Checkpoints

The WCAG (Web Content Accessibility Guidelines) 1.0, Priority 2 Checkpoint 3.4, states that you should:

Use relative rather than absolute units in markup language attribute values and style sheet property values

View the checkpoint

Originally I thought this meant that anywhere a font size, width or height was mentioned I only had the option of use ems or percentages. Then this seemed to be saying to me to design all sites using a liquid layout, which was strange as people were always saying that the guidelines do not dictate design.

I have since found out I wasn’t understanding what ‘relative unit’ meant.

Relative length units specify a length relative to another length property

Source: w3.org definition

So here are the relative units you may use:

Absolute units are as follows and should only be used when the sizes of the output are known – i.e. on a business card:

Applying this to WCAG 2.0

This point doesn’t specifically appear in the new WCAG 2.0 guidelines but only “… maps to an advisory technique (Using readable fonts) for Guideline 1.4.”. This guideline contains both Level 2 and 3 Success Criteria which are explained more thoroughly in the Advisory Techniques for Guideline 1.4.

This advisory says you must make it easy to distinguish foreground information from its background. It appears that there will eventually be an advisory section called “Using readable fonts”, at present it shows as link pending.

I find it odd that this isn’t a ‘proper’ guideline, surely ensuring that a user can easily read the text on a page is something that a standards developer would do as soon as breathe!

Information Generalisation

Side Note: WCAG 1.0 was written 7 years ago in a time when the majority of users were surfing in HTML only and so quickly became out of date, they desperately needed to be re-written.

Today the web is used by so many more and different technologies that the new guidelines have been written to ensure that they are technology independent and to be as future-proof as possible.

Application of the (new) Guideline

When you apply the WCAG 2.0 advisory to your development work you need to think about the areas that this guideline could apply to. The basic ones here are:

  1. Ensure that text and background colours have been set and are of high enough contrast
  2. Ensure that non-decorative images have a suitably high contrast
  3. It can also apply to sounds on a page, for instance can the content of the clip be heard well enough over it’s background noise?

Hopefully these points will help to clarify how to apply the existing and future guideline.

Update 2006-06-26: Font sizes should still not be defined in pixels due to IE’s inability to resize text using these units.

Update 2006-07-12: I’m adding this in the interest of showing all sides of the story: The original author of this checkpoint has said that he wants an erratum added to it saying that pixels should be considered an absolute unit. Compared to the others it is relative to the user’s screen – instead of changing font size you have to change your display settings, which is too complicated for most users.

I propose that we also make an erratum to clarify that the units considered
“relative” in this checkpoint are those relative to the user’s font settings
– %, em, ex, but not px, pt, pc, in, mm, cm.