CSS Aural
Properties
Aural properties defines the aural rendering of a document.
Aural Style Sheets
Aural style sheets are the part of CSS that uses a combination of speech synthesis and sound effects to make a web document more accessible to visually impaired and screen readers.
Aural presentation can be used:
- by blind people
- in the automobiles
- in devices like home entertainment
- industrial and medical documentation systems
- to help users learning to read or who have difficulty reading
When using aural properties, the canvas consists of a three-dimensional physical space (sound surrounds) and a temporal space (one may specify sounds before, during, and after other sounds). The CSS properties also allow you to vary the quality of synthesized speech (voice type, frequency, inflection, etc.).
An example of an aural style sheet:
Example
Try this code »h1, h2, h3, h4, h5, h6 {
voice-family: male;
stress: 20;
richness: 90;
cue-before: url("pop.au");
}
p {
azimuth: center-left;
}
quotes {
volume: x-soft;
}
This will direct the speech synthesizer to speak headers in a very rich male voice (a kind of "audio font").Before speaking the headers; a sound sample will be played from the given URL.
Paragraphs will appear to come from front left (if the sound system is capable of spatial audio). And quotes will be very soft.
Property | Values |
Description |
---|---|---|
azimuth |
angleleft-side far-left left center-left center center-right right far-right right-side behind leftwards rightwards inherit |
Sets where the sound should come from horizontally. |
cue |
cue-before cue-after inherit |
Shorthand for setting the cue properties (i.e. cue-before and cue-after) in one declaration. |
cue-after |
none url inherit |
Specifies a sound to be played after speaking an element's content to delimit it from other. |
cue-before | none url inherit |
Specifies a sound to be played before speaking an element's content to delimit it from other. |
elevation | anglebelow level above higher lower inherit |
Sets where the sound should come from vertically. |
pause |
pause-before pause-after inherit |
Shorthand for setting the pause properties (i.e. pause-before and pause-after) in one declaration. |
pause-after |
time % inherit |
Specify a pause to be observed after speaking an element's content. |
pause-before |
time % inherit |
Specify a pause to be observed before speaking an element's content. |
pitch |
frequencyx-low low medium high x-high inherit |
Specifies the average pitch (a frequency) of the speaking voice. The average pitch of a voice depends on the voice family. |
pitch-range |
numberinherit |
Specifies variation in average pitch. |
play-during |
auto none url mix repeat inherit |
Specifies a sound to be played as a background while an element's content is spoken. |
richness |
numberinherit |
Specifies the richness of the speaking voice. |
speak |
normal none spell-out inherit |
Specifies whether text will be rendered aurally and if so, in what manner. |
speak-header |
always once inherit |
Specifies whether table headers are spoken before every cell, or only before a cell when that cell is associated with a different header than the previous cell. |
speak-numeral |
digits continuous inherit |
Specifies how numerals are spoken. |
speak-punctuation |
none code inherit |
Specifies how punctuation characters are spoken. |
speech-rate |
numberx-slow slow medium fast x-fast faster slower inherit |
Specifies the speaking rate i.e. number of words spoken per minute. |
Stress |
numberinherit |
Specifies the "stress" in the speaking voice. |
voice-family |
specific-voice generic-voice inherit |
Specifies a comma-separated, prioritized list of voice family names. |
volume |
number % silent x-soft soft medium loud x-loud inherit |
Specifies the volume of the speaking voice. |