XHTML Fixed Layouts

Note

The section deals with fixed layout that are predominantly text-based, employing background images only for visual enhancement, not to carry significant information. See the image-based fixed layouts section for more information on how to making image pages more accessible.

It is possible to create fixed layout publications that retain a high level of accessibility using XHTML content, so long as the structural semantic tagging guidelines that apply to all publications are adhered to.

The following guidelines should also be respected when positioning content using CSS to create elecronic pages:

Ensure that the order in which you include content in your markup matches the order that the reader would logically be expected to encounter it on the page. Use CSS to arrange the position on screen over top of the image, however appropriate. The logical reading order for someone using an assistive technology matches the markup order.
Avoid using the CSS background-image property to set backgrounds if the background is not decorative. Use the CSS z-index property to layer text content on top of the image, which will allow a description to be provided to explain how the image is relevant.

Note

Ensuring the fallback accessibility of fixed layout publications should be a concern to all content creators, as there is no guarantee that positioned content will be rendered as desired. Reading systems that do not support fixed layouts will reflow the content regardless of author intention.

Example

Example 1 —

...

Compliance References and Standards

WCAG 2.0 — C27: Making the DOM order match the visual order
WCAG 2.0 — G57: Ordering the content in a meaningful sequence