Webサイトの背景音は、雰囲気を伝える一方で、読み上げ音声や本文への集中を妨げることがあります。
本文では、主な情報とは別に流れる音楽、環境音、効果音を背景音と呼びます。音が情報伝達に欠かせない場合を除き、最初から流さない設計が取り組みやすい選択です。使用する場合は、利用者が再生の開始、停止、音量を選べるようにします。
背景音が利用を妨げる場面
背景音の影響は、聞こえ方だけで決まりません。利用する支援技術、周囲の環境、作業の内容によっても変わります。
- スクリーンリーダーを利用している場合：スクリーンリーダーの読み上げとページの音が同時に流れると、操作に必要な音声を聞き取りにくくなることがあります。
- 発話と背景音を聞き分けにくい場合：ナレーションに音楽や環境音が重なると、伝えるべき言葉が埋もれることがあります。
- 継続する音を負担に感じる場合：小さな音でも、利用者が止められない状態で流れ続けると、閲覧や作業の継続を妨げることがあります。
- 静かな場所や公共の場所で利用する場合：予期しない音の再生は、本人だけでなく周囲にも影響します。
背景音を小さくするだけでは、これらの場面を一律に解決できません。音を再生しない選択肢と、すぐに停止できる操作の両方を用意する必要があります。
WCAG 1.4.2と1.4.7の違い
背景音を扱うときは、WCAG 2.2の二つの達成基準を混同しないようにします。ページで自動再生する音を扱う達成基準1.4.2「音声の制御」と、収録済みの音声コンテンツ内の背景音を扱う達成基準1.4.7「小さな背景音、又は背景音なし」では、対象も適合レベルも異なります。
| 達成基準 | 主な対象 | 求められる対応 | レベル |
|---|---|---|---|
| 1.4.2 音声の制御 | ページ上で3秒を超えて自動再生する音 | 一時停止または停止する仕組み、もしくはシステム全体とは独立した音量調整を提供する | A |
| 1.4.7 小さな背景音、又は背景音なし | 主に発話を含む収録済みの音声のみのコンテンツ | 背景音を入れない、背景音を消せるようにする、または発話より20dB以上小さくする | AAA |
ページ上で音が自動再生される場合
達成基準1.4.2は、ページを開いたときなどに、利用者の意図した操作なしで3秒を超えて流れる音を対象にします。停止または一時停止の仕組みを用意するか、システム全体の音量とは別に調整できるようにします。
利用者が内容のわかる再生ボタンを押して音を開始する設計なら、停止ボタンを探しながら読み上げ音声と背景音を聞き分ける状況を避けられます。実装時の確認点は、音声の自動再生を避けるWebアクセシビリティ設計でも確認できます。
発話に背景音を重ねた収録済み音声の場合
達成基準1.4.7は、主に発話を含む収録済みの音声のみのコンテンツを対象とするレベルAAAの基準です。音声CAPTCHA、音声ロゴ、歌唱など、主に音楽表現を意図した発声は対象に含まれません。
対象となるコンテンツでは、背景音を入れない、背景音だけを消せるようにする、または背景音を前景の発話より20dB以上小さくする、という三つの方法から選びます。ただし、1秒か2秒だけ続く一時的な音は、20dB差の例外です。
したがって、「Webサイトの背景音はすべて発話より20dB小さくすればよい」という意味ではありません。20dB差は適用対象が限定された選択肢の一つです。基準の対象と判定方法は、WCAG 2.2の達成基準1.4.7を扱う解説も参照してください。
背景音を使う前に決めること
- 音の役割を特定する：その音が情報を伝えるのか、操作結果を知らせるのか、雰囲気を添えるだけなのかを分けます。役割を説明できない背景音は、使わない判断ができます。
- 利用者の操作で再生を始める：再生前のボタンには、「音声を再生」「背景音を再生」など、何が始まるかわかるラベルを付けます。
- 停止操作を見つけやすくする：音が流れている間は、停止または一時停止の操作を表示します。「背景音を停止」のように対象を明示すると、別の音声コンテンツと区別できます。
- 発話と背景音を別々に検討する：ナレーションを伝える必要がある場合は、背景音を入れない案を先に検討します。背景音を残す場合は、対象となる達成基準に沿って停止方法や音量差を決めます。
- 実際の利用条件で確認する：読み上げ音声とページの音を同時に再生し、操作の案内が聞き取れるか、停止操作まで迷わず移動できるかを確認します。
実装とレビューのチェックリスト
- ページを開いただけで背景音が始まらないか。
- 3秒を超えて自動再生する音に、停止、一時停止、または独立した音量調整があるか。
- 再生、停止、音量の操作が見つけやすく、何を制御するのかラベルからわかるか。
- 停止後に別ページへ移動したとき、意図せず再び音が始まらないか。
- 発話を含む収録済みの音声のみのコンテンツでレベルAAAを目指す場合、達成基準1.4.7の対象と例外を確認したか。
- 背景音を残す場合、発話なし、背景音の停止、20dB以上の差のいずれで適合させるかを記録したか。
背景音への配慮で改善できること
背景音を使わないか利用者が制御できるようにすると、読み上げ音声やナレーションが別の音に隠れる状況を減らせます。静かな環境や公共の場所でも、利用者が周囲を気にしてすぐページを閉じる必要がありません。
一方、背景音の改善だけで滞在時間やページビューが増えるとは断定できません。まず評価するのは、利用者が必要な情報を聞き取り、自分で音を制御しながら操作を続けられるかです。
設計の要点
背景音がなくても目的を達成できるページでは、音を流さない設計が最も簡潔です。音を使う必要がある場合は、利用者の操作で開始し、対象が明確な停止操作を用意します。
WCAGを確認するときは、ページ上の自動再生音を扱う達成基準1.4.2と、収録済み音声内の背景音を扱う達成基準1.4.7を分けて判断します。この区別により、必要な操作と音量条件を過不足なく設計できます。