CSS: Aurale Gestaltung

CSS Level 2 definiert erstmals auch Eigenschaften die die aurale Wiedergabe eines Elements beschreiben. Diese Eigenschaften sollen z.B. von Sprach-Browsern verwendet werden um die Gestaltung von Texten durch akustische Effekte zu verbessern und somit dem Besucher vielleicht einen spannerenden oder interessanteren Inhalt zu bieten.

azimuth

Die azimuth-Eigenschaft beschreibt, aus welcher (horizontalen) Richtung der Klang kommen soll. Dazu stehen die folgenden Eigenschaften zur Verfügung:

Winkel - Beschreibt die Richtung als Winkel. Dabei ist 0 deg vorne, 90 deg rechts, 180 deg hinten und 270 deg links. Es sind auch negative Werte verwendbar, dann ist -90 deg links und -270 deg rechts ...
behind - Die Klangposition wird nach hinten gesetzt. Wird hinzu ein weiterer Wert notiert, so muss dieser von 180 deg abgezogen (oder dazuaddiert) werden um die Position zu erhalten (behind 30 deg entspricht 150 deg)
center - Der Klang kommt von vorn (0 deg)
center-left - Der Klang kommt von vorne-links (-45 deg)
center-right - Der Klang kommt von vorne-rechts (45 deg)
far-left - Der Klang kommt von weit links (-60 deg)
far-right - Der Klang kommt von weit rechts (60 deg)
left - Der Klang kommt von links (320 deg)
left-side - Der Klang kommt von der linken Seite (-90 deg)
leftwards - Die Klangposition wird um 20 deg verringert. D.h. kommt der Klang ursprünglich von 300 deg, so kommt er dann von 280 deg.
right - Der Klang kommt von rechts (40 deg)
right-side - Der Klang kommt von der rechten Seite (90 deg)
rightwards - Die Klangposition wird um 20 deg vergrößert. D.h. kommt der Klang ursprünglich von 300 deg, so kommt er dann von 320 deg.

Beispiel:

P { azimuth:center; }
DIV { azimuth: behind left-side; } /* = right-side*/

elevation

Die elevation-Eigenschaft beschreibt die (vertikale) Richtung des Klangs. Als Werte gelten die folgenden:

Winkel - Beschreibt die Richtung als Winkel zwischen -90 deg und 90 deg. Dabei ist 0 deg genau geradeaus, 90 deg über und -90 deg unter dem Zuhörer.
above - Über dem Zuhörer (90 deg)
below - Unter dem Zuhörer (-90 deg)
higher - Addiert 10 deg zur aktuellen Höhe hinzu.
level - Geradeaus (0 deg)
lower - Subtrahiert von der aktuellen Höhe 10 deg weg.

Beispiel:

P { elevation: 0deg; }
DIV { elevation: lower; }

cue-after, cue-before und cue

Die Eigenschaften cue-after und cue-before definieren einen Klang, der nach (cue-after) bzw. vor (cue-before) dem Vorlesen des Elements gespielt werden soll. Als Wert wird dazu die URL einer Klangdatei notiert. Ebenso kann der Wert none notiert werden. Dieser bedeutet, dass kein Klang gespielt werden soll. Die cue-Eigenschaft ist eine Zusammenfassung der beiden und dient als Vereinfachung. Es können ihr entweder ein oder zwei Werte übergeben werden. Wird ein Wert übergeben, so gilt dieser für cue-after und cue-before. Werden zwei Werte notiert, so gilt der erste für cue-before und der zweite für cue-after. Beispiel:

H1 { cue-after: url('tamtam.wav'); cue-before:none; }
H2 { cue:url('taratata.au'); }

pause-after, pause-before und pause

Die Eigenschaften pause-after und pause-before beschreiben die Länge der Pause vor (pause-before) bzw. nach (pause-after) einem Element. Als Wert wird dazu entweder eine Zeit oder eine Prozentangabe notiert. Die Zeitangabe sagt aus, wie lang die Pause exakt sein soll. Eine Prozentangabe richtet sich nach der durchschnittlichen (Lese-)Geschwindigkeit für ein Wort. 100% bedeutet dabei, dass eine Pause gelassen wird, die genau so lang ist wie das Lesen eines Wortes in dieser Geschwindigkeit durchschnittlich benötigen würde. Wäre z.B. die Geschwindigkeit mit 60 Worten pro Minute definiert (durchschnittlich wäre ein Wort dann 1 Sekunde lang) dann würde eine Pause von 100% genau einer Sekunde entsprechen. 50% wären dann eine Pause von einer halben Sekunde (oder 500 Millisekunden). Die pause-Eigenschaft ist die Zusammenfassung der beiden vorher genannten Eigenschaften. Als Wert kann sie einen oder beide Werte dieser beiden Eigenschaften erhalten. Wird ein Wert notiert so gilt dieser für beide Eigenschaften. Werden zwei Werte notiert, so gilt der erste für die pause-before-Eigenschaft und der zweite für pause-after. Beispiel:

H1 { pause-before:500ms; pause-after:50%; speech-rate:60; }
H2 { pause: 500ms; }

pitch

Die pitch-Eigenschaft beschreibt die Frequenz der Stimme (Stimmenlage). Die folgenden Werte sind möglich:

Frequenz - Beschreibt die exakte Frequenz der Stimme
high* - Beschreibt die Frequenz als hoch
low* - Beschreibt die Frequenz als tief
medium* - Beschreibt die Frequenz als normal
x-high* - Beschreibt die Frequenz als sehr hoch
x-low* - Beschreibt die Frequenz als sehr tief

(* Die resultierende Frequenz dieser Werte ist abhängig von der Ausgangsfrequenz.)

Beispiel:

P { pitch: high; }

pitch-range

Die pitch-range-Eigenschaft beschreibt den Klangumfang. Dazu wird eine Zahl von 0 bis 100 notiert, die aussagt, um vieviel die Normalfrequenz verändert werden kann/darf. Ein Wert von 0 bedeutet dabei, dass die Frequenz immer gleichbleibend sein soll. Dies ruft einen sehr monotonen Lesestil hervor. Ein Wert von 50 bedeutet normale Veränderungen der Frequenz und ein Wert von über 50 bedeutet, dass die Frequenz sehr weit verändert werden kann/darf. Beispiel:

P { pitch-range: 50; }

play-during

Die play-during-Eigenschaft definiert einen Klang, der während des Lesens des Elements gespielt werden soll (sozusagen als Hintergrundmusik). Als Wert wird dazu entweder die URL einer Sounddatei, der Wert auto oder der Wert none notiert. auto bedeutet, dass der Klang des Elternelements nicht unterbrochen sondern weiter gespielt wird. none bedeutet, dass beim Lesen des Elements kein Klang ertönen soll. Die Notation einerURLdefinierten den Klang der gespielt werden soll. Zusätzlich zu einerURLkönnen noch die Werte mix und/oder repeat notiert werden. repeat besagt, dass der Klang solange wiederholt werden soll, bis der Lesevorgang des Elements beendet ist. mix bedeutet, dass der Klang zusammen mit dem Klang des Elternelements gespielt werden soll. Dabei überlagern sich die beiden Klänge. Beispiel:

P { play-during: url('musik1.wav') repeat; }
EM { play-during: url('musik2.wav') mix repeat; }

richness

Die richness-Eigenschaft beschreibt die Helligkeit oder auch Reichhaltigkeit der Stimme. Als Wert kann dazu eine Zahl zwischen 0 und 100 notiert werden. Ein tiefer Wert wird eine weiche, liebliche Stimme hervorrufen; ein hoher Wert eine harte Stimme. Beispiel:

P { richness:50; }

speak

Die speak-Eigenschaft beschreibt, wie das Element gelesen werden soll. Dazu stehen drei Werte zur Auswahl: normal, none und spell-out. normal bedeutet, dass das Element wie normaler Text vorgelesen werden soll. none bedeutet, dass der Text des Elementes nicht vorgelesen werden soll. spell-out besagt, dass der Text Buchstabenweise gelesen werden soll. Dies ist besonders für Akronyme (z.B. HTML, W3C oder UNO) geeignet. Beispiel:

P { speak:normal; } /* 'Text' */
IMG { speak:none; } /* ' ' */
ACRONYM { speak:spell-out; } /* 'T - E - X - T' */

speak-numeral

Die speak-numeral-Eigenschaft besagt, wie Zahlen gesprochen werden sollen. Als Wert kann entweder digits oder continuous notiert werden. digits bedeutet, das jede auftauchende Zahl einzelnd gesprochen werden soll. 123 würde dann 'eins zwei drei' gesprochen werden. continuous bedeutet, dass eine Auftauchende Zahl als (Zahl-)Wort gesprochen werden soll. 123 würde dann 'Einhundert-drei-und-zwanzig' gesprochen werden. Beispiel:

P { speak-numeral:continuous; }

speak-punctuation

Die speak-punctuation-Eigenschaft beschreibt, wie Satzzeichen gesprochen werden sollen. Als Werte können dabei entweder code oder none notiert werden. code besagt, dass Satzzeichen als Name ausgesprochen werden sollen. Der Satz "Er sagte: Ich bin's." würde dann "Er sagte Doppelpunkt Ich bin Anführungszeichen s Punkt" gesprochen werden. none bedeutet, dass die Satzzeichen nicht mitgelesen werden sollen, stattdessen werden sie in die Intonation des Satzes eingepasst (z.B. als Pause). Der Satz "Er sagte: Ich bin's." würde dann "Er sagte [kurze Pause] Ich bin's." gesprochen werden. Beispiel:

P { speak-punctuation:none; }

speech-rate

Die speech-rate-Eigenschaft beschreibt die Sprech-Geschwindigkeit. Folgende Werte sind verwendbar:

Zahl - Beschreibt die durchschnittliche Anzahl der Wörter pro Minute
fast - 300 Wörter pro Minute
faster - Verschnellert die Geschwindigkeit um 40 Wörter pro Minute
medium - 180 bis 200 Wörter pro Minute
slow - 120 Wörter pro Minute
slower - Verlangsamt die Geschwindigkeit um 40 Wörter pro Minute
x-slow - 80 Wörter pro Minute
x-fast - 500 Wörter pro Minute

Beispiel:

P { speech-rate:medium; }

stress

Die stress-Eigenschaft beschreibt die Betonung der Worte. Als Wert wird dazu eine Zahl zwischen 0 und 100 notiert. Ein niedriger Wert bedeutet, wenig Betonung; ein hoher Wert bedeutet viel Betonung. Beispiel:

P { stress:50; }

voice-family

Die voice-family-Eigenschaft beschreibt den Stimmenklang. Ähnlich einer Schriftart kann hier die Stimmenart bestimmt werden. Dazu kann eine, durch Kommas getrennte, Liste von möglichen Stimmen-Klassen notiert werden. Mögliche Stimmen sind:

male - männliche Stimme
female - weibliche Stimme
child - Kinderstimme

Des weiteren sind vorfedinierte Stimmen denkbar. Diese sind allerdings abhängig von den Einstellungen des Browsers und werden nicht fest als Wert definiert. Beispiel:

P.a { voice-family:male, robert; }
P.b { voice-family:female, betty; }

volume

Die volume-Eigenschaft definiert die Lautstärke mit der der Inhalt des Elements gelesen werden soll. Folgende Werte sind einsetzbar:

Zahl - Eine Zahl von 0 bis 100 wobei 0 die kleinste wiedergabefähige Lautsträke und 100 die größte wiedergabefähige Lautstärke darstellt.
Prozentangabe - Lautstärke in Prozent der normalen bzw. Elternlautsärke. 50% entsprechen der Hälte der Lautsärke des Elternelements.
loud - Laut
medium - Normal
silent - Kein Klang
soft - Leise
x-loud - Sehr laut
x-soft - Sehr leise

Beispiel:

P { volume: 50; }
/* = medium */

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Weiterlesen: ⯈ Inhaltserzeugung

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project

CSS: Aurale Gestaltung

Über uns

Cookie-Einstellungen