Basics of Aural CSS3 Style Sheets - dummies

Basics of Aural CSS3 Style Sheets

By John Paul Mueller

Aural CSS3 style sheets make it possible for users who rely on screen readers and other voice-driven technology to make better use of your site. You won’t actually hear anything when your site is using an aural style sheet unless you have a screen reader enabled.

In fact, without a screen reader, the aural style sheet won’t seem to be in place at all. The aural style sheet offers cues to the screen reader that specify how to read the text on your site — and also provides hints about how to convert information to textual form.

Creating an aural style sheet is precisely the same as creating any other CSS style sheet. You define aural styles for various objects by using exactly the same selectors as you use for creating visual effects. Aural style sheets do have their own set of properties, however, as described in the following list:

  • Azimuth: Defines the horizontal source of the sound. The acceptable values are:

    • angle: A value between 0 and 360 that determines the actual angle.

    • Keyword: left-side, far-left, left, center-left, center, center-right, right, far-right, right-side, behind, leftwards, or rightwards.

  • Cue-after: Specifies a sound to make after the content is read. You can use a value of none or provide a specific URL for a sound source.

  • Cue-before: Specifies a sound to make before the content is read. You can use a value of none or provide a specific URL for a sound source.

  • Elevation: Defines the vertical source of the sound. The acceptable values are

    • Angle: A value between 0 and 360 that determines the actual angle.

    • Keyword: below, level, above, higher, or lower.

  • Pause-after: Specifies how long to pause after reading the content. You can provide a numeric value in seconds or a percentage based on the length of the content.

  • Pause-before: Specifies how long to pause before reading the content. You can provide a numeric value in seconds or a percentage based on the length of the content.

  • Pitch: Determines the frequency of the speaking voice. The acceptable values are

    • Frequency: The frequency of the speaking voice in hertz.

    • Keyword: x-low, low, medium, high, or x-high.

  • Pitch-range: Determines the amount of modulation in the spoken voice where a value of 0 is monotone. Higher values produce more animation in the voice.

  • Play-during: Specifies a sound to make while the content is read (possibly background music or some other accompaniment. The acceptable values are

    • none: Suppresses sound while reading the content.

    • url: The location of the sound source to play.

    • Keyword: auto, mix, or repeat.

  • Richness: Determines the depth of the spoken voice where a value of 0 is a thin voice and higher values make the voice deeper, more resonant.

  • Speak: Specifies how to speak the content. The acceptable values are

    • Normal: The content is spoken as words.

    • None: The content isn’t spoken at all.

    • Spell-out: The individual characters of the content are spoken, such as when handling abbreviations (where individual letters are spoken). For example, you’d use this setting for W3C (World Wide web Consortium).

  • Speak-header: Indicates whether the readers should speak the heading for each cell as the individual cells are read. The acceptable values are:

    • Always: The headers are read for each cell, whether or not the heading has changed.

    • Once: The headers are only read once for each cell.

  • Speak-numeral: Determines how the reader handles numeric values. The acceptable values are

    • Digits: The individual numbers are read, such as one, two, three for 123.

    • Continuous: The number is read as a unit, such as one hundred twenty three for 123.

  • Speak-punctuation: Determines how the reader handles punctuation. The acceptable values are:

    • None: The reader doesn’t do anything special with punctuation. Some higher end readers will add pauses automatically to match the differences in punctuation, such as using a longer pause for an em dash or semicolon.

    • Code: The reader tells the viewer what punctuation appears in the content. This would be especially important when reading content such as source code, where punctuation is especially important or takes on atypical meanings.

  • Speech-rate: Indicates how fast the reader should read the content. The main reason to use this value is for emphasis or to make especially difficult passages clearer. The acceptable values are

    • Number: A number indicating the speed in Syllables Per Minute (SPM). Some sources use Words Per Minute (WPM), but the rate is more along the lines of syllables per minute, with longer words taking longer to say.

    • Keyword: x-slow (80 SPM), slow (120 SPM), medium (180 SPM), fast (300 SPM), x-fast (500 SPM), faster (add 40 SPM to current rate), or slower (subtract 40 SPM from current rate).

  • Stress: Indicates how much emphasis the reader should place on certain syllables of a word — the higher the numeric value, the greater the amount of emphasis. Most readers pay no attention to this value.

  • Voice-family: Defines which voice to use when reading the content. As with fonts, the voice-family can be specific or generic. The most generic voice-family values are male, female, and child. Specific voice-family values require voice files that are supported by the reader.

  • Volume: Indicates how loud the reader should read the content. The acceptable values are:

    • Number: A value between 0 and 100 to indicate absolute volume.

    • %: A percentage between 0 and 100 to indicate a relative increase in volume (with a maximum value of 100).

    • Keyword: silent (a value of 0), x-soft (a value of 0), soft (a value of 25), medium (a value of 50), loud (a value of 75), or x-loud (a value of 100).