What is CSS Aural?

Asked

Viewed 429 times

18

The CSS we know formats the information delivered by HTML. This information can be anything for example: image, text, video, audio or any other element created, that is, the CSS formats the information.

I found the term AURAL CSS combining voice synthesis and sound effects, not information.

I would like to understand a little more about it, so I have doubts about the following aspects:

  1. I can say that it is a new Framework created by CSS?
  2. As the term is new (for me), it could explain where it is used and its purpose?
  3. Is there any audience (end user) in particular to which it is intended?

PS: If possible give examples of use:)

2 answers

14


The CSS that speaks.

Despite obsolete, Aural style sheets aim at a combination of speech synthesis and sound effects so that the user can hear the information rather than read it.

[...]where is it used and its purpose? Is there any audience (end user) in particular to which it is intended?

Help users with visual restrictions.

Example:

h1, h2 {
    voice-family: male;
    richness: 80;
    cue-before: url("som.wav")
}

The above example will cause the voice synthesizer to play the headers in a male bass voice using voice-family as male.

See more details in W3.

PS.: The Inclusive Accessibility website has a post that makes a list of some software for visually impaired, if you are interested, it is worth giving a read about. Note: I do not know which technologies are used by each one for development of these softwares. Quiz insert here only for complementation.

  • @Marconi didn’t understand it either, but you’ll know.

  • I don’t like negative responses without a comment on why it goes back to neutral!

  • Good afternoon, I marked with -1 because I was using as Documentation a W3schools. You switched to a font that calls itself obsolete.

  • @Marconi according to this W3 reference yes, the Aural CSS is obsolete. On their own page there is a note alerting people.

  • @Marconi I’m even looking for if there’s any substitute for this to help you, because honestly, in practice I’ve never seen anyone using.

  • @Marconi I think it’s very important that people care about this, because accessibility, not only in Brazil, but worldwide, is very bad. I was reading here that Facebook has created a tool for visually impaired people to "see" the images. I don’t know how, maybe some way to describe, of course, in audio format.

  • 1

    @Acklay Speaking of seeing the pictures, look at this question I recently did on the use of alt in tags imgs answered by bigown. This may be related to your comment!

  • 1

    @Legal Marconi, here’s the story. http://www.techtudo.com.br/noticias/noticia/2015/10/facebook-development-tool_para-helpr-blindes-ver-imagens.html I take accessibility very seriously.

Show 3 more comments

7

CSS Aural - Styles for Visual Accessibility

It is commonly used by blind people who have difficulty seeing or who do not have a screen for viewing. It is used, for example, by Screen Readers, which is all software that translates the content in a Sonara (and synthesized) way, instead of displaying it.

It is not a FRAMEWORK, but a CSS MODULE, designed for accessibility.

I believe that this already answers all aspects of the question and as for examples, follows:

h1, h2, h3, h4, h5, h6
{
  voice-family: paul;
  voice-stress: moderate;
  cue-before: url(../audio/ping.wav);
  voice-volume: medium 6dB;
}
p.heidi
{
  voice-family: female;
  voice-balance: left;
  voice-pitch: high;
  voice-volume: -6dB;
}
p.peter
{
  voice-family: male;
  voice-balance: right;
  voice-rate: fast;
}
span.special
{
  voice-volume: soft;
  pause-after: strong;
}

...

<h1>I am Paul, and I speak headings.</h1>
<p class="heidi">Hello, I am Heidi.</p>
<p class="peter">
  <span class="special">Can you hear me ?</span>
  I am Peter.
</p>

The navigation on a site, made without visual aid, is done through jumps from element to element, so the CSS Aural allows styling how the user will read the element in focus, changing between male/female, defining the volume and etc.

Just complementing the Aspect of Tests/Screen Readers the DOSVOX is a Brazilian and Open Source initiative.

W3 documentation about CSS Aural and Speech: SOURCE

Browser other questions tagged

You are not signed in. Login or sign up in order to post.