In questo articolo vi presenteremo una particolare sezione delle specifiche CSS2: i fogli di stile per l'audio ovvero gli Aural style sheets (fogli di stile uditivi o 'aurali'), strumenti utilissimi per la progettazione di pagine Web ad alta accessibilità.
Con l'avvento delle interfacce grafiche, l'incremento della facilità di utilizzo dei calcolatori ne ha permesso l'accesso alle funzionalità alla fascia di utenza non professionale. Il web è pienamente riconducibile nelle sue linee di sviluppo a questa modello che ha, però, ignorato il fatto che molti utenti del calcolatore hanno problemi di accesso alla rete derivanti da ipovedenza. Studi recenti stimano in 11 milioni gli statunitensi con problemi di vista di cui 1,5 milioni sono ciechi.
Per la fruizione dei contenuti ipertestuali sul Web si ricorre ad applicazioni che utilizzano una voce sintetizzata per la lettura del testo di una pagina web (screen reader): esempi di screen reader sono Simply Web 2000, pwWebSpeak e Jaws per Windows. Per coloro che utilizzano sistemi operativi Unix-based, segnalo Emacspeak. La categoria di software citata soffre dell'incapacità di fornire le inflessioni tipiche della lingua parlata inoltre sono di disturbo per gli udenti. La voce sintetizzata da loro utilizzata va a sommare la dizione dei contenuti ipertestuali a numerose informazioni aggiuntive e a segnali acustici.
A fine di tutela di questa numerosa fascia di utenza, lo standard CSS2 include il supporto ai fogli di stile auditivi, che forniscono numerose funzionalità per il supporto di oggetti audio nelle pagine web.
Quando inizieranno a diffondersi browser con supporto per i fogli di stile auditivi, si potrà immergere l'utente in una esperienza audio tridimensionale senza dover ricorrere a plug-in o applet java. A ciò si aggiunga il fatto che tali software (ad esempio Real Audio e Flash) sono spesso vietati nel download per precise politiche societarie. I fogli di stile utilizzano solo un brower e una comune connessione HTTP.
L'introduzione delle tecnologie multimediali nel CSS2 permette ai progettisti e agli sviluppatori di ottimizzare per varie piattaforme la conversione dei contenuti dei documenti. Alcune proprietà dei fogli di stile dipendono dalle piattaforme: per esempio font-family è inutile in un sintetizzatore vocale e pause-before non ha senso su un dispositivo Braille; diverse tipologie possono richiedere valori differenti per proprietà condivise. CSS2 fornisce due diverse modalità per realizzare quest'obiettivo: utilizzare la proprietà @media, o l'attributo media all'interno del tag <link>.
I nomi delle tipologie di media riconosciuti presenti nelle specifiche CSS2 sono stati stabiliti in base ai dispositivi destinatari:
|
Per approfondimenti maggiori rimandiamo alla Guida ai CSS
Passiamo ora allo studio delle proprietà e dei valori specifici dei CSS uditivi.
Proprietà Volume
La proprietà volume è utilizzata per controllare l'ampiezza dell'onda sonora. Non è scontato sottolineare come il controllo di questa sia possibile anche lato client da parte dell'utilizzatore agendo sugli strumenti per la regolazione dell'emissione sonora. La proprietà volume può assumere i seguenti valori:
number, percentage, silent, x-soft, soft, medium, loud, x-loud, inherit
number è un qualsiasi numero compreso tra 0 e 100: 0 imposta il livello al minimo udibile, 100 al valore massimo impostabile.
H2 { volume: 60 }
Percentage
è calcolato in relazione al modello audio ereditato. Il valore espresso nell'elemento figlio sarà da intendersi come percentuale dell'elemento padre.
Nell'esempio seguente il volume della pagina è stato impostato all' 80% dell'impostazione del volume dell'utente (questa istruzione può essere scritta anche nella forma volume:80) e il testo racchiuso tra <h1> e </h1> sarà ascoltato al 75% del volume della pagina, pari al 70% dell'impostazione del volume dell'utente (0.80x0.75=0.60, equivalente a volume:60).
Body { volume: 80% }
H1 { volume: 75% }
Silent significa "nessun suono" e non ha lo stesso valore di 0, il quale imposta il più piccolo sonoro udibile. L'utilizzo di silent non significa che l'audio non viene riprodotto ma solo che non viene reso disponibile in output. Si tratta di un comportamento analogo a quello del pulsante mute (disattiva) su un lettore CD: il brano avanza normalmente , ma non si sente alcun suono.
x-soft
equivale a number = 0. La proprietà speak determina se e come un elemento sonoro dovrà essere riprodotto, e può assumere i seguenti valori: normal, none, spell-out, inherit Normal fa in modo che un elemento e tutti i suoi figli utilizzino le regole di pronuncia del linguaggio fornito dall'agente di rendering (server o client, secondo l'applicazione). Si tratta del valore di default.
Soft
equivale a scrivere number = 25.
Medium
equivale a scrivere number = 50. È il valore di default che viene utilizzato quando il valore per la proprietà volume non viene specificato.
loud
equivale a scrivere number = 75.
x-loud
Proprietà Speak
None rende non udibile un elemento. Diversamente dall'istruzione volume: silent speak: none
Nell'esempio seguente, la lista ordinata appartenente alla classe "vecchioconvertini" (<ol class = "vecchioconvertini">) viene saltata, ma gli oggetti della classe appartenenti alla classe "nuovoconvertini" (<li class ="nuovoconvertini"> <ol class = "vecchioconvertini"></ol>
OL.vecchioconvertini { speak: none }
LI.nuovoconvertini { speak: normal }
Per essere sicuri della non lettura dell'elemento figlio bisognerà impostare su none la Tre proprietà speciali: display, float clear
Spell-out
Pause ha tre proprietà: pause-before, pause-after e pause, che è un metodo breve per impostare le prime due proprietà. Questa proprietà serve ad impostare il tempo dopo il quale il suono deve essere eseguito. Questa proprietà imposta il tempo che deve trascorrere dopo la lettura di un elemento. Sia per la proprietà pause-before che per pause-after possono essere impostati i valori: time, percentage, inherit Time rappresenta la lunghezza complessiva della pausa in secondi (s) o millisecondi (ms).Pause
Pause-before
Pause-after
H3 { pause-after: 70ms }
Percentage rappresenta la lunghezza della pausa, espressa come una percentuale dell'inverso della proprietà speech-rate in seguito affrontata. Di norma la proprietà pause viene impostata al valore del tempo medio per parola (60 parole al minuto pari a 1 parola per secondo). Con un esempio, se viene impostato un valore di speck-rate di 240, allora il tempo medio per parola sarà di 60/240 ppm= 250ms.
È possibile impostare una pausa sonora naturale basandosi su quanto tempo si impiega a pronunciare una parola. Se si imposta speech-rate : 120 pause-before : 80%
Pause
La proprietà pause è una scorciatoia per l'impostazione delle due proprietà precedenti. Richiede entrambi i valori per pause-before e per pause-after. Nel caso in cui venga passato un solo valore, la proprietà pause lo userà per impostarle entrambe. Di due valori impostati il primo sarà attribuito a pause-before il secondo a pause-after. Vediamo un esempio tratto direttamente dal w3c.
Cue
Come per la proprietà pause, anche cue ha tre proprietà: cue-before, cue-after e cue.
Le proprietà cue sono utilizzate per fornire agli utenti le cosiddette icone uditive che identificano in maniera sonora i segnali appena riprodotti e/o un particolare elemento, come per esempio i marcatori di un elenco puntato. Espressa correttamente, la proprietà cue marca gli elementi semantici.
Se le proprietà di pause sono specificate l'ordine di esecuzione della lettura di un elemento risulta essere il seguente:
cue-before, pause-before, <element>, pause-after, cue-after
Ciò significa che la lettura dell'icona uditiva precederà la pausa impostata precedentemente alla lettura dell'elemento. L'icona uditiva e l'elemento vengono trattati separatamente.
Cue-before
Questo elemento esegue uno specifico file sonoro prima che l'elemento è stato tradotto in forma sonora.
Cue-after
Questa proprietà esegue uno specifico file sonoro dopo che l'elemento è stato tradotto in forma sonora. Le proprietà cue possono assumere i seguenti valori:
uri none inherit
Il valore uri deve identificare un file audio, altrimenti sarà ignorato e considerato come impostato a none.
H3 { cue-after: url ("musica/sottofondo2.wav")}
none
Cue
Cue combina entrambe le impostazioni fornite da cue-before e cue-after. Richiede i valori di entrambe le proprietà cue-before e cue-after, uno dopo l'altro. Nel caso in cui venga passato un solo valore, la proprietà cue lo userà per impostarle entrambe. Il comportamento è del tutto simile, quindi, alla proprietà play.
Riprendendo gli esempi sopra:
equivale a:
Proprietà play-during
Play-during è una proprietà di mixing. Esse permettono di regolare con precisione l'interazione tra suoni diversi.
Play-during
Questa proprietà regola la riproduzione di un file sonoro durante la lettura di un elemento. il suo valore non viene ereditato dagli elementi padre, e può essere uno dei seguenti:
url mix repeat auto none
Il valore uri è obbligatorio e rappresenta la locazione del file sonoro da eseguire.
Il valore mix H1 è figlio dell'elemento BODY
body { play-during: url ("tantiauguriate.wav")}
h1 { play-during: url ("happybirthday.mp3") mix}
Nell'esempio i 2 brani verranno eseguiti in contemporanea.
Il valore repeat
h1 { play-during: url ("happybirthday.au") repeat}
Il comportamento, è del tutto simile alla proprietà background-repeat
Il valore auto
Il valore none, infine, non introduce nessun suono di sottofondo durante la rappresentazione sonora dell'elemento corrente. Il suono di ogni elemento padre viene fermato per l'intera durata della versione sonora dell'elemento figlio, per poi riprendere al suo termine.
Proprietà audio tridimensionali: azimuth ed elevation
La gestione dell'audio tridimensionale non è accessoria alle proprietà precedenti. Il costante incremento di impianti multicanale permette di raggiungere un'ampia fascia di utenza. Si aggiunga che l'audio tridimensionale fornisce una rappresentazione maggiormente naturale del suono, ivi compreso il parlato.
Le proprietà spaziali del suono sono descritte dalle proprietà azimuth e elevation.
Azimuth
La proprietà azimuth controlla la distribuzione dell'elemento da sinistra a destra. La collocazione spaziale del suono viene misurata in gradi (deg) su un intervallo che va da - 360° a + 360° tutti localizzati direttamente di fronte all'utilizzatore. La proprietà azimuth può assumere i seguenti valori:
angle, left-side, far-left, left, center-left, center, center-right, right, far-right, right-side, leftwards, rightwards, inherit
Il valore angle rappresenta il numero di gradi di spostamento di un elemento rispetto alla posizione 0 gradi, esattamente di fronte all'utente. Il movimento in senso orario rispetto all'utente viene considerato positivo, quello in senso contrario negativo: la destra dell'utente corrisponderà dunque ad uno spostamento di 90 gradi in senso orario (o -270 gradi in senso antiorario), la schiena a 180 gradi e il lato sinistro a 270 gradi in senso orario o -90 gradi in senso antiorario. I seguenti esempi sono equivalenti:
h2 { azimuth: -250deg }
Il modificatore behind può essere utilizzato per rappresentare il posizionamento delle casse audio rispetto alla schiena dell'utente ruotando la gradazione corrente di 180 gradi in senso orario.
Passando agli altri valori assumibili dalla proprietà azimuth, i gradi sono rappresentati dalla seguente tabella:
|
