epubjs
Version:
Render ePub documents in the browser, across many devices
56 lines (53 loc) • 4.07 kB
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tell It Like It Is: Text-to-Speech (TTS)</title>
<link rel="stylesheet" type="text/css" href="css/epub.css" />
<link rel="stylesheet" media="speech" href="css/synth.css" />
<link rel="pronunciation" href="lexicon/en.pls" type="application/pls+xml" hreflang="en" />
<link rel="pronunciation" href="lexicon/fr.pls" type="application/pls+xml" hreflang="fr" />
<meta name="dat-origPath" value="/html/body/section/section[3]" /><link rel="prev" href="./ch03s03_8.html" /><link rel="next" href="./ch03s03_10.html" /></head><body>
<p data-origPath="/html/body/section/section[3]/p[11]">The <code class="literal">speak-as</code> property isn’t a complex control
mechanism, but definitely serves a useful role. Even if you are fluent with
phonetic alphabets, there’s a point where it doesn’t make sense to have to
define or write out every letter or number to ensure the engine doesn’t do the
wrong thing, and this is where the Speech module helps.</p>
<p data-origPath="/html/body/section/section[3]/p[12]">Where the module excels, however, is in providing playback control. But this is
also an area where you may want to think twice before adding your own custom
style sheet rules. Most reading systems typically have their own internal rules
for playback so that the synthetic speech rendering doesn’t come out as one long
uninterrupted stream of monotone narration. When you add your own rules, you
have the potential to interfere with the reader’s default settings. But in the
interests of thoroughness, we’ll take a quick tour.</p>
<p data-origPath="/html/body/section/section[3]/p[13]">The first stop is the ability to insert pauses. Pauses are an integral part of
the synthetic speech reading process, as they provide a non-verbal indication of
change. Without them, it wouldn’t always be clear if a new sentence were
beginning or a new paragraph, or when one section ends and another begins.</p>
<p data-origPath="/html/body/section/section[3]/p[14]">The CSS3 Speech module includes a <code class="literal">pause</code> property
that allows you to control the duration to pause before and after any element.
For example, we could define a half-second pause before headings followed by a
quarter-second pause after by including the following rule:</p>
<pre class="screen" data-origPath="/html/body/section/section[3]/pre[6]">h1 {
-epub-pause: 50ms 25ms
}</pre>
<p data-origPath="/html/body/section/section[3]/p[15]">Aural cues are equally helpful when it comes to identifying new headings, as the
pause alone may not be interpreted by the listener as you expect. The Speech
module includes a <code class="literal">cue</code> property for exactly this
purpose:</p>
<pre class="screen" data-origPath="/html/body/section/section[3]/pre[7]">h1 {
-epub-pause: 50ms 25ms;
-epub-cue: url('audio/ping.mp3') none
}</pre>
<p data-origPath="/html/body/section/section[3]/p[16]">(Note that the addition of the <code class="literal">none</code> value after the
audio file location. If omitted, the cue would also sound after the heading was
finished.)</p>
<p data-origPath="/html/body/section/section[3]/p[17]">And finally, the <code class="literal">rest</code> property provides fine-grained
control when using cues. Cues occur after any initial pause before the element
(as defined by the <code class="literal">pause</code> property), and before any
pause after. But you may still want to control the pause that occurs between the
cue sounding and the text being read and between the end of the text being read
and the trailing cue sounding (i.e., so that the sound and the text aren’t run
together). The <code class="literal">rest</code> property is how you control the
duration of these pauses.</p>
</body>
</html>