要約

CSS Speechプロパティにより、音声によるレンダリングを改善できます。

例

<abbr class="spell">IBM</abbr>
<span class="spell">IOU</span>

/* css */

.spell {
   speak-as: spell-out
}

<span class="digits">911</span>
<span class="digits">416 555-0123</span>
<span class="digits">90210</span>

/* css */

.digits {
   speak-as: digits
}

<p>
   Example one is correctly punctuated as follows:
   <span class="punctuate answer">The Franks, 
   a warlike people of Germany, gave their 
   name to France.</span>
</p>

/* css */

.punctuate {
   speak-as: literal-punctuation
}

<p>The telegram from Dr. King to President Kennedy
   read as follows:</p>
<blockquote>
   <pre class="silent">
   HOWEVER I AM CONVINCED THAT UNLESS SOME STEPS ARE TAKEN BY
   THE FEDERAL GOVERMENT TO RESTORE A SENSE OF CONFIDENCE IN
   THE PROTECTION OF LIFE, LIMB AND PROPERTY MY PLEAS SHALL FALL
   ON DEAF EARS AND WE SHALL SEE THE WORST RACIAL HOLOCAUST THIS
   NATION HAS EVER SEEN AFTER TODAYS TRAGEDY, INVESTIGATION WILL
   NOT SUFFICE.
   </pre>
   <cite><a 
	  href="http://www.jfklibrary.org/Asset-Viewer/-crU2bLgN0CcGkys8dkuHg.aspx"
	  >September 15, 1963 Telegram</a></cite>
</blockquote>

/* css */

.silent {
   speak-as: no-punctuation
}

h1 {
   pause: 50ms 25ms;
   cue: url('audio/ping.mp3') none;
   rest: 10ms 0ms
}

.male {
   voice-family: male
}

.female {
   voice-family: female
}

/* html */

<p class="female">
   Alice: But I don't want to go among mad people.
</p>

<p class="male">
   The Cat: Oh, you can't help that.
   We're all mad here. I'm mad. You're mad.
</p>

.huck {
   voice-family: child male 1
}

.tom {
   voice-family: child male 2
}

/* html */

<p class="tom">
   "Well—I—I—well, that ought to settle it, of course; 
   but I can't somehow seem to understand it no way.  
   Looky here, warn't you ever murdered AT ALL?"
</p>

<p class="huck">
   "No. I warn't ever murdered at all—I played it on 
   them. You come in here and feel of me if you don't 
   believe me."
</p>

解説

CSS Speechモジュールにより、テキスト読み上げ (TTS) の拡張機能を追加できます。PLS辞書やSSMLマークアップとは異なり、Speechモジュールのプロパティが重点をおいているのは単語の正しい発音の定義ではありません。

CSS SpeechモジュールでTTS再生を強化するために使われる主要なプロパティは、 speak-asです。このプロパティで、TTSエンジンが文字列内を一文字ずつ読み上げるようにできます。各文字の読み上げはspell-outに設定し、数字はdigitに設定します（例１および例２を参照）。また、このプロパティを使って、TTSエンジンによる信頼性の低い頭字語の読み上げをオーバーライドできます。

speak-asプロパティでは、補完的な値であるliteral-punctuationとno-punctuationも使用できます。TTSエンジンが句読点を音声化するかどうかを制御できます。

このモジュールには、speakプロパティも含まれており、要素が表示されているかどうかに関係なく、コンテンツのTTSレンダリングを制御できます。none値を設定すると要素のレンダリングが無効になり、 normal値を設定すると有効になります。

次のプロパティは、TTS読み上げにおける非韻律的な側面に重点を置いています。

pause

pauseプロパティは、適用先の要素の前後に付け加える一時停止の長さを制御します。一時停止は通常、段落間や新しいセクションの開始時など、主要な構造間の遷移を識別するために使用されます。また、TTSエンジンは句読点があると、ナレーションの流れの中で一時停止をします。

pauseプロパティの値は、一時停止の長さを示す時間値です。単一の値のみが指定されている場合：

pause: 50ms

この時間は、関連付けられている要素の前と後の両方に適用されます。

時間値を２つ指定すると、前後の一時停止時間を個別に制御できます。

pause: 50ms 0ms

指定された長さの一時停止は、音声cueとrestの関連する要素の開始前と、restとcueの要素の終了後に入ります。

cue

cueプロパティは、音声によって要素を識別するために使用できます。たとえば、新しい見出しのある個所は、一時停止だけでは分かりにくいですが、キューを使って音声を鳴らすことで分かりやすくできます。

cueプロパティでは、値が１つだけ指定されている場合、関連付けられているオーディオクリップが見出しの前と後の両方でレンダリングされるので注意してください。

cue: url('audio/ping.mp3');

通常のユーザーが期待するように開始を知らせるキューのみにするには、関連付けられた要素がレンダリングされた後のキューを無効にするためにnull値を使用します。

cue: url('audio/ping.mp3') null;

音声キューは、関連する要素の開始時にpauseとrestの間に入り、要素の終了時にrestとcueの間に入ります。

rest

restプロパティは、音声キューと関連要素のレンダリングの間とその前後に発生する一時停止を制御します。

restプロパティの値は、一時停止の長さを示す時間値です。単一の値のみが指定されている場合:

rest: 25ms

一時停止の時間は、関連付けられている要素の前と後の両方に適用されます。

時間値を２つ指定すると、前後の一時停止時間を個別に制御できます。

rest: 25ms 0ms

指定された休止時間は、関連する要素の開始時にpauseとcueの後に入り、要素の終了時にcueとpauseの前に入ります。

voice-family

voice-familyプロパティは、TTS再生に使用される音声の性別と種類を制御し、コンテンツ製作者がよりリアルなTTS再生（登場人物に合わせて性別を切り替えるなど）を作成できるようにします。

使用する音声の名前も指定できます。

voice-family: 'Dave';

実際には、EPUBはさまざまなデバイスで再生できるため、すべてのデバイスで利用可能な音声の名前を知っている場合にのみ活用できます。

代わりに、パターン「年齢？、性別、整数？」を使用して音声をリクエストする方が適切です（？のフィールドはオプションです）。

.king-lear {
   voice-family: old male 1;
}

年齢の値は、child、young、oldのいずれかで、性別はmale、 female、neutral。また、整数で音声の順序位置が指定できます。（一致する音声が複数ある場合）。

よくある質問

プロパティに-epub-プレフィックスを使用する必要はありますか?

いいえ。はじめは、仕様が安定する前にプロパティが導入されたため、プレフィックスを使用する必要がありました。現在は、プレフィックスのないバージョンも使用できます。

TTSエンジンに頭字語を一文字ずつ読み上げずに発音するように強制できますか?

Speechモジュールには、大文字の用語を単語として発音するようにTTSエンジンに伝える方法はありません。EPUBのような頭字語の場合は、辞書を使用するか、SSML発音属性を使って、TTSエンジンが一文字ずつ読み上げないようにする必要があります。

なぜ句読点の発音を制御する必要があるのですか?

ほとんどのTTSエンジンはコロンなどの重要な停止位置は音声で読み上げますが、通常は読みやすさを損なうため、文書内の全ての句読点を読み上げることはありません。しかし、文法の教科書やプログラミングガイドなどのように、ユーザーが文中のすべての句読点の聞き取りが必須な場合もあります（例3を参照）。

アクセシブルな技術では、preやcodeなどの要素内は、デフォルトですべての句読点も読み上げます。コンピューターコードではすべての句読点を読み上げるのが良いですが、フォーマット済みのテキストでは詳細なレンダリングは必要ありません。preのテキストブロックにno-punctuationを適用すると、句読点を読み上げないようにできます。

関連リンク

• EPUB 3 TTS 拡張機能 — CSS Speech
• CSS —Speechモジュール