speak
speakはCSS Speechモジュールのプロパティで、要素のテキストコンテンツが音声合成で読み上げられるべきかどうかを制御します。normal（読み上げる）、none（読み上げない）、spell-out（スペルアウト）などの値を指定できます。スクリーンリーダーやテキスト読み上げブラウザ向けの音声プレゼンテーションを制御する目的で設計されていますが、実際のブラウザサポートは限定的です。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
speak | ≤80 | ≤80 | | | ≤80 | |
注釈 2件
制限事項
- このブラウザでは部分的にしか実装されていません
実装メモ
- 実装は仕様に準拠していません。バグ 40813740 を参照してください。
注釈 2件
制限事項
- このブラウザでは部分的にしか実装されていません
実装メモ
- 実装は仕様に準拠していません。バグ 40813740 を参照してください。
注釈 2件
制限事項
- このブラウザでは部分的にしか実装されていません
実装メモ
- 実装は仕様に準拠していません。バグ 40813740 を参照してください。
基本構文
CSS
.decorative {
speak: none;
}
.acronym {
speak: spell-out;
}ライブデモ
実務での使いどころ
-
装飾テキストの読み上げ抑制
装飾目的のテキストや繰り返しの区切り文字など、音声で読み上げる必要のないコンテンツを読み上げ対象から除外します。
注意点
- 現在どの主要ブラウザでもサポートされておらず、実際の読み上げ制御にはaria-hiddenの使用が推奨されます。
アクセシビリティ
- speakプロパティの代わりに、aria-hidden="true"やrole="presentation"を使用して読み上げを制御してください。