CSSのvoice-rangeプロパティとは？音声メディアでのピッチ範囲の指定方法

CSSのvoice-rangeプロパティとは

CSSのvoice-rangeプロパティは、音声読み上げ時における「声の幅（ピッチレンジ）」を指定するためのプロパティです。これは、合成音声がテキストを読み上げる際の抑揚の大きさを制御するもので、CSS Speech（音声）モジュールに含まれる音声メディア向けの機能です。

voice-rangeプロパティの構文

voice-rangeプロパティの基本的な書式は以下のとおりです。

voice-range: [[x-low | low | medium | high | x-high]];

上記のように、ピッチ範囲の広さを表すキーワードを指定します。指定できるキーワードは低い順に以下の5種類です。

• x-low：非常に狭い（低い）ピッチ範囲
• low：狭い（低い）ピッチ範囲
• medium：標準のピッチ範囲（初期値）
• high：広い（高い）ピッチ範囲
• x-high：非常に広い（高い）ピッチ範囲

なお、キーワードの代わりに周波数（Hz）、セミトーン（st）、パーセンテージ（%）といった数値で細かく指定することも可能です。

voice-rangeプロパティの使用例

次の例では、p要素に対してピッチ範囲を90Hzに設定しています。

p {
    voice-range: 90Hz;
}

このように指定すると、該当するテキストが音声で読み上げられる際に、声のピッチの変化幅が90Hzに調整されます。数値が小さいほど単調な読み上げになり、大きいほど抑揚のある話し方になります。

まとめ

voice-rangeは、スクリーンリーダーや音声ブラウザなどによる読み上げの抑揚を調整できる便利なプロパティですが、対応しているブラウザや音声エンジンが限られている点には注意が必要です。アクセシビリティ向上のための音声出力をカスタマイズしたい場合に活用しましょう。