CSS - Medios auditivos
Un documento web puede ser procesado por un sintetizador de voz. CSS2 le permite adjuntar características de estilo de sonido específicas a elementos específicos del documento.
La reproducción auditiva de documentos es utilizada principalmente por personas con discapacidad visual. Algunas de las situaciones en las que se puede acceder a un documento mediante la representación auditiva en lugar de la representación visual son las siguientes.
- Aprendiendo a leer
- Training
- Acceso web en vehículos
- Entretenimiento en el hogar
- Documentación industrial
- Documentación médica
Cuando se utilizan propiedades auditivas, el lienzo consta de un espacio físico tridimensional (sonido envolvente) y un espacio temporal (se pueden especificar sonidos antes, durante y después de otros sonidos).
Las propiedades de CSS también le permiten variar la calidad del habla sintetizada (tipo de voz, frecuencia, inflexión, etc.).
Aquí hay un ejemplo:
<html>
<head>
<style type = "text/css">
h1, h2, h3, h4, h5, h6 {
voice-family: paul;
stress: 20;
richness: 90;
cue-before: url("../audio/pop.au");
}
p {
azimuth:center-right;
}
</style>
</head>
<body>
<h1>Tutorialspoint.com</h1>
<h2>Tutorialspoint.com</h2>
<h3>Tutorialspoint.com</h3>
<h4>Tutorialspoint.com</h4>
<h5>Tutorialspoint.com</h5>
<h6>Tutorialspoint.com</h6>
<p>Tutorialspoint.com</p>
</body>
</html>
Producirá el siguiente resultado:
Dirigirá al sintetizador de voz para que diga los encabezados en una voz (una especie de fuente de audio) llamada "paul", en un tono plano, pero con una voz muy rica. Antes de pronunciar los encabezados, se reproducirá una muestra de sonido desde la URL proporcionada.
Los párrafos con la clase 'heidi' parecerán provenir del frente izquierdo (si el sistema de sonido es capaz de audio espacial), y los párrafos de la clase 'peter' del derecho.
Ahora veremos las diversas propiedades relacionadas con los medios auditivos.
los azimuth conjuntos de propiedades, de donde el sonido debe provenir horizontalmente.
los elevation conjuntos de propiedades, de donde el sonido debe provenir verticalmente.
los cue-after especifica un sonido que se reproducirá después de hablar el contenido de un elemento para delimitarlo de otro.
los cue-before especifica un sonido que se reproducirá antes de pronunciar el contenido de un elemento para delimitarlo de otro.
los cue es una forma abreviada de configurar cue-before y cue-after.
los pause-after especifica una pausa que se observará después de hablar el contenido de un elemento.
los pause-before especifica una pausa que se observará antes de pronunciar el contenido de un elemento.
los pause es una forma abreviada de configurar pausa-antes y pausa-después.
los pitch especifica el tono medio (una frecuencia) de la voz hablante.
los pitch-range especifica la variación en el tono medio.
los play-during especifica un sonido que se reproducirá como fondo mientras se habla el contenido de un elemento.
los richness especifica la riqueza o el brillo de la voz hablante.
los speak especifica si el texto se representará de forma auditiva y, de ser así, de qué manera.
los speak-numeral controla cómo se dicen los números.
los speak-punctuation especifica cómo se pronuncia la puntuación.
los speech-rate especifica la velocidad de habla.
los stress especifica la altura de los "picos locales" en el contorno de entonación de una voz.
los voice-family especifica la lista priorizada de nombres de familias de voces.
los volume se refiere al volumen medio de la voz.
La propiedad azimut
La propiedad azimut establece de dónde debe venir el sonido horizontalmente. Los valores posibles se enumeran a continuación:
angle- La posición se describe en términos de un ángulo dentro del rango -360deg a 360deg . El valor 0deg significa directamente adelante en el centro del escenario de sonido. 90deg está a la derecha, 180 grados atrás, y 270deg (o, equivalentemente, y más convenientemente, -90deg ) a la izquierda.
left-side- Igual que '270deg'. Con 'detrás', '270deg'.
far-left- Igual que '300deg'. Con 'detrás', '240deg'.
left- Igual que '320deg'. Con 'detrás', '220deg'.
center-left- Igual que '340deg'. Con 'detrás', '200deg'.
center- Igual que '0deg'. Con 'detrás', '180deg'.
center-right- Igual que '20deg'. Con 'detrás', '160deg'.
right- Igual que '40deg'. Con 'detrás', '140deg'.
far-right- Igual que '60deg'. Con 'detrás', '120deg'.
right-side- Igual que '90deg'. Con 'detrás', '90deg'.
leftwards- Mueve el sonido hacia la izquierda y en relación con el ángulo actual. Más precisamente, resta 20 grados.
rightwards- Mueve el sonido hacia la derecha, en relación con el ángulo actual. Más precisamente, agrega 20 grados.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
h1 { azimuth: 30deg }
td.a { azimuth: far-right } /* 60deg */
#12 { azimuth: behind far-right } /* 120deg */
p.comment { azimuth: behind } /* 180deg */
-->
</style>
La propiedad de elevación
La propiedad de elevación establece de dónde debe provenir el sonido verticalmente. Los valores posibles son los siguientes:
angle- Especifica la elevación como un ángulo, entre -90 grados y 90 grados . 0deg significa en el horizonte delantero, que vagamente significa nivel con el oyente. 90 grados significa directamente arriba y -90 grados significa directamente debajo.
below - Igual que '-90deg'.
level - Igual que '0deg'.
above - Igual que '90deg'.
higher - Agrega 10 grados a la elevación actual.
lower - Resta 10 grados de la elevación actual.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
h1 { elevation: above }
tr.a { elevation: 60deg }
tr.b { elevation: 30deg }
tr.c { elevation: level }
-->
</style>
La propiedad cue-after
La propiedad cue-after especifica un sonido que se reproducirá después de pronunciar el contenido de un elemento para delimitarlo de otro. Los valores posibles incluyen:
url - La URL de un archivo de sonido que se reproducirá.
none - No hay que jugar nada.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
a {cue-after: url("dong.wav");}
h1 {cue-after: url("pop.au"); }
-->
</style>
La propiedad cue-before
Esta propiedad especifica un sonido que se reproducirá antes de pronunciar el contenido de un elemento para delimitarlo de otro. Los valores posibles son:
url - La URL de un archivo de sonido que se reproducirá.
none - No hay que jugar nada.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
a {cue-before: url("bell.aiff");}
h1 {cue-before: url("pop.au"); }
-->
</style>
La propiedad cue
La propiedad cue es una forma abreviada de configurar cue-before y cue-after . Si se dan dos valores, el primer valor es cue-before y el segundo es cue-after . Si solo se proporciona un valor, se aplica a ambas propiedades.
Por ejemplo, las siguientes dos reglas son equivalentes:
<style type = "text/css">
<!--
h1 {cue-before: url("pop.au"); cue-after: url("pop.au") }
h1 {cue: url("pop.au") }
-->
</style>
La propiedad de pausa después
Esta propiedad especifica una pausa que se observará después de hablar el contenido de un elemento. Los valores posibles son:
time - Expresa la pausa en unidades de tiempo absolutas (segundos y milisegundos).
percentage- Se refiere a la inversa del valor de la propiedad de velocidad de voz . Por ejemplo, si la velocidad del habla es de 120 palabras por minuto (es decir, una palabra tarda medio segundo o 500 ms), una pausa posterior del 100% significa una pausa de 500 ms y una pausa posterior del 20% significa 100 ms. .
La propiedad de pausa antes
Esta propiedad especifica una pausa que se observará antes de pronunciar el contenido de un elemento. Los valores posibles son:
time - Expresa la pausa en unidades de tiempo absolutas (segundos y milisegundos).
percentage- Se refiere a la inversa del valor de la propiedad de velocidad de voz . Por ejemplo, si la velocidad del habla es de 120 palabras por minuto (es decir, una palabra tarda medio segundo o 500 ms), una pausa antes del 100% significa una pausa de 500 ms y una pausa antes del 20% significa 100 ms. .
La propiedad de pausa
Esta propiedad es una forma abreviada de configurar pause-before y pause-after . Si se dan dos valores, el primer valor es pausa antes y el segundo es pausa después.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
/* pause-before: 20ms; pause-after: 20ms */
h1 { pause : 20ms }
/* pause-before: 30ms; pause-after: 40ms */
h2{ pause : 30ms 40ms }
/* pause-before: ?; pause-after: 10ms */
h3 { pause-after : 10ms }
-->
</style>
La propiedad de la cancha
Esta propiedad especifica el tono medio (una frecuencia) de la voz hablante. El tono medio de una voz depende de la familia de voces. Por ejemplo, el tono promedio de una voz masculina estándar es de alrededor de 120 Hz, pero para una voz femenina, es de alrededor de 210 Hz. Los valores posibles son:
frequency - Especifica el tono medio de la voz hablada en hercios (Hz).
x-low, low, medium, high, x-high - Estos valores no se asignan a frecuencias absolutas ya que estos valores dependen de la familia de voces.
La propiedad de rango de tono
Esta propiedad especifica la variación en el tono medio. Los valores posibles son:
number- Un valor entre '0' y '100'. Un rango de tono de '0' produce una voz plana y monótona. Un rango de tono de 50 produce una inflexión normal. Los rangos de tono superiores a 50 producen voces animadas.
La propiedad de juego
Esta propiedad especifica un sonido que se reproducirá como fondo mientras se habla el contenido de un elemento. Los valores posibles podrían ser cualquiera de los siguientes:
URI - El sonido designado por este <uri> se reproduce como fondo mientras se habla el contenido del elemento.
mix- Cuando está presente, esta palabra clave significa que el sonido heredado de la propiedad play-during del elemento principal continúa reproduciéndose y el sonido designado por el uri se mezcla con él. Si no se especifica la mezcla , el sonido de fondo del elemento reemplaza al del padre.
repeat- Cuando está presente, esta palabra clave significa que el sonido se repetirá si es demasiado corto para llenar toda la duración del elemento. De lo contrario, el sonido se reproduce una vez y luego se detiene.
auto - El sonido del elemento principal continúa reproduciéndose.
none - Esta palabra clave significa que hay silencio.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
blockquote.sad { play-during: url("violins.aiff") }
blockquote q { play-during: url("harp.wav") mix }
span.quiet { play-during: none }
-->
</style>
La propiedad de la riqueza
Esta propiedad especifica la riqueza o el brillo de la voz hablada. Los valores posibles son:
number- Un valor entre '0' y '100'. Cuanto mayor sea el valor, más se transmitirá la voz. Un valor más bajo producirá una voz suave y meliflua.
La propiedad speak
Esta propiedad especifica si el texto se representará de forma auditiva y, de ser así, de qué manera. Los valores posibles son:
none - Suprime el renderizado auditivo para que el elemento no requiera tiempo para renderizarse.
normal - Utiliza reglas de pronunciación dependientes del idioma para representar un elemento y sus elementos secundarios.
spell-out - Deletrea el texto una letra a la vez.
Note la diferencia entre un elemento cuya propiedad 'volumen' tiene un valor de 'silencioso' y un elemento cuya propiedad 'hablar' tiene el valor 'ninguno'. El primero ocupa el mismo tiempo que si se hubiera hablado, incluida cualquier pausa antes y después del elemento, pero no se genera ningún sonido. Este último no requiere tiempo y no se procesa.
La propiedad speak-numeral
Esta propiedad controla cómo se pronuncian los números. Los valores posibles son:
digits- Diga el número como dígitos individuales. Así, "237" se dice "Dos Tres Siete".
continuous- Diga el número como un número completo. Así, "237" se dice "Doscientos treinta y siete". Las representaciones de palabras dependen del idioma.
La propiedad hablar-puntuación
Esta propiedad especifica cómo se pronuncia la puntuación. Los valores posibles son:
code - Los signos de puntuación, como punto y coma, llaves, etc., deben expresarse literalmente.
none - La puntuación no se debe pronunciar, sino que se presenta de forma natural como varias pausas.
La propiedad de velocidad de voz
Esta propiedad especifica la velocidad del habla. Tenga en cuenta que se permiten valores de palabras clave tanto absolutos como relativos. Los valores posibles son:
number - Especifica la velocidad de habla en palabras por minuto.
x-slow - Igual que 80 palabras por minuto.
slow - Igual que 120 palabras por minuto.
medium - Igual que 180 - 200 palabras por minuto.
fast - Igual que 300 palabras por minuto.
x-fast - Igual que 500 palabras por minuto.
faster - Agrega 40 palabras por minuto a la velocidad de habla actual.
slower - Resta 40 palabras por minuto de la velocidad de habla actual.
La propiedad del estrés
Esta propiedad especifica la altura de los "picos locales" en el contorno de entonación de una voz. El inglés es un idioma acentuado, y a las diferentes partes de una oración se les asigna estrés primario, secundario o terciario. Los valores posibles son:
number- Un valor entre '0' y '100'. El significado de los valores depende del idioma que se hable. Por ejemplo, un nivel de '50' para una voz masculina de habla inglesa estándar (tono promedio = 122Hz), hablar con entonación y énfasis normales tendría un significado diferente al de '50' para una voz italiana.
La propiedad de la familia de la voz
El valor es una lista priorizada y separada por comas de nombres de familias de voces. Puede tener los siguientes valores:
generic-voice- Los valores son familias de voces. Los valores posibles son 'masculino', 'femenino' y 'niño'.
specific-voice - Los valores son instancias específicas (por ejemplo, comediante, trinoides, carlos, lani).
Aquí hay un ejemplo:
<style type = "text/css">
<!--
h1 { voice-family: announcer, male }
p.part.romeo { voice-family: romeo, male }
p.part.juliet { voice-family: juliet, female }
-->
</style>
La propiedad del volumen
El volumen se refiere al volumen medio de la voz. Puede tener los siguientes valores:
numbers- Cualquier número entre '0' y '100'. '0' representa el nivel mínimo de volumen audible y 100 corresponde al nivel máximo cómodo.
percentage - Estos valores se calculan en relación con el valor heredado y luego se recortan en el rango '0' a '100'.
silent- Ningún sonido en absoluto. El valor '0' no significa lo mismo que 'silencioso'.
x-soft - Igual que '0'.
soft - Igual que '25'.
medium - Igual que '50'.
loud - Igual que '75'.
x-loud - Igual que '100'.
Aquí hay un ejemplo:
<style type = "text/css">
<!--
P.goat { volume: x-soft }
-->
</style>
Párrafos con clase goat será muy suave.