Skip to content
Home » Development » Aurally Delivering Sizes

Aurally Delivering Sizes

Abstract

Do text to speech browsers use the title attributes in a abbr element when reading out? Only with some careful manipulation.

Example

The size of the box was 15 in × 12 in across the top.

Code

(X)HTML

<p>The size of the box was 15 <abbr title="inches">in</abbr>
<abbr title="by">×</abbr> 12 <abbr title="inches">in</abbr>
across the top.</p>

CSS

@media aural,speech,screen {
    abbr:before { content:attr(title); }
}
@media aural,speech {
    abbr { speak: none; }
    abbr:before { speak: normal; }
}
@media screen {
    abbr:before { display: none; }
}

Conclusion

With careful tweaking of the CSS using the @media attribute, Opera and other text-to-speech browsers can be made to display one thing and use another for aural delivery. This solution was taken from Alan J. Flavell’s site.
Sadly Alan passed away in December 2006. My little contact with him showed he was a good man with sound knowledge and advice. A project is under way to put his pages back together.

Post a Comment

Your email is never published nor shared. Required fields are marked *