Collected by
Elizabeth Janson

Home Page

Media to provide access for special users

 

Media Types

Media types aren't restricted to screen and print. In the future, we might also be able to use:

  • handheld — for handheld devices like PalmPilots
  • projection — for projectors or printing to transparencies
  • tv — for television
  • tty — for teletypes or terminals that use fixed-pitch character grids
  • aural — for speech synthesizers
  • braille — for braille tactile feedback devices
  • embossed — for paged braille printers
  • all — for all devices

Print it

Remember the first time you printed out a Web page? It was disappointing. What's optimized for the screen can look odd on paper. With CSS2, you can actually have a different set of stylesheet rules depending on the media. That is, you could have one style for your page on-screen and a different style for your page when printed. This is done with @media.

@media screen {
  BODY { background: black; color: white }
  P { font-family: verdana, sans-serif }
  }
 
@media print {
  BODY { background: white; color: black }
  P { font-family: times, serif }
  }

The above code tells the browser to display white Verdana text on a black background on-screen. But if the page is printed, it will be in black Times text on a white background. Each page is easily optimized for its output method.

The sample style sheet provided by W3C concentrates on page margin,
and { page-break-after: avoid; page-break-inside: avoid } for selected elements.

Colour wisely

Two web sites -
Visibone have clear charts showing 3 common forms of colour blindness
'Can Color-blind Users see your site' gives very clear descriptions of the problems, especially for people who loose colour vision due to age.

From Andrew Oakley's now lost site - movemove
One in twenty white men are colour blind. mo
We don't buy things we can't use.movemoven
We don't hit web pages we can't read.moven

DO use blue, yellow, white and black if you really must use colours to distinguish items. These combinations are less likely to be confused than others.
DON'T use [red, green, brown, grey, purple] [next to, on top of, or changing to] [red, green, brown, grey, purple].

DO have a strong, bright contrast between foreground and background colours- not only for your page text but also in your images. Even totally colour blind readers can differentiate similar colours which contrast bright with dark.
DON'T use colours in images to denote special areas, such as bar charts, maps and navigation bars. Consider using textures or line shading instead (try the "paper" or "pattern" function in your graph or painting program). Alternatively, provide additional written labels.

DO provide labels next to any coloured indicators. For instance, if you have a red warning light and a green OK light, write "WARNING" and "OK" next to each one, or use numbers or symbols (avoid crosses and ticks as their interpretation varies internationally). Consider some kind of sonic, flashing or animated indication.
DON'T use single light bulbs that change colour from red to green, red to yellow or green to yellow under any circumstances. They are the work of Satan and you will burn in hell for all eternity. Blue-changing lights are marginally more acceptable.

Good programers remember to provide access for special users

7.3 Recognized media types

A CSS media type names a set of CSS properties. A user agent that claims to support a media type by name must implement all of the properties that apply to that media type.

The names chosen for CSS media types reflect target devices for which the relevant properties make sense. In the following list of CSS media types, the parenthetical descriptions are not normative. They only give a sense of what device the media type is meant to refer to.

all
Suitable for all devices.
aural
Intended for speech synthesizers. See the W3C section on aural style sheets for details.
braille
Intended for braille tactile feedback devices.
embossed
Intended for paged braille printers.
handheld
Intended for handheld devices (typically small screen, monochrome, limited bandwidth).
print
Intended for paged, opaque material and for documents viewed on screen in print preview mode. Please consult the W3C section on paged media for information about formatting issues that are specific to paged media.
projection
Intended for projected presentations, for example projectors or print to transparencies. Please consult the W3C section on paged media for information about formatting issues that are specific to paged media.
screen
Intended primarily for color computer screens.
tty
Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.
tv
Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).

Media type names are case-insensitive.

Due to rapidly changing technologies, CSS2 does not specify a definitive list of media types that may be values for @media.

Note. Future versions of CSS may extend this list. Authors should not rely on media type names that are not yet defined by a CSS specification.

Email
CSS begins here
Back to Error mamagement, or on to Selectors

This page is part of Elizabeth Janson's web site

http://www.oocities.org/elizatk/index.html

My other sites are the Anglican Parish of Northern Mallee,
Tetbury residents in the Eighteenth Century
my Australian Family History and Barrie, our Family Poet.