アクセス可能な生成コンテンツ

• content を使用して意味のあるテキスト（ラベル、状態、指示）を伝えないでください。DOM に保持してください（WCAG F87）。代替テキスト引数は、装飾が誤って意味を伝える場合の害を軽減するためのものであり、ライセンスではありません。
• content の代替テキスト引数を使用して、スクリーン リーダー用の代替テキストを指定します。例: content: url(cloud.svg) / "Save";
• content: "text" / ""; を使用して、純粋に装飾的なテキストがスクリーン リーダーに読み上げられないようにします。
• 画像に空の代替テキスト引数を使用しないでください。画像はデフォルトでプレゼンテーション用になっています。たとえば、content: url(cloud.svg) / ""; は誤りです。
• 説明が公式の絵文字名と異なる場合を除き、絵文字の説明に代替テキスト引数を使用しないでください。たとえば、content: "🎉" / "celebration"; は使用せず、content: "🎉" / "Yay!"; を使用します。

代替テキスト引数は、テキストがプライマリ値と異なり、DOM にまだ存在しない場合にのみ使用します。たとえば、次のコードは誤りです。

HTML:

<button class="save">Save</button>

CSS:

button.save::before {
  content: url(cloud.svg) / "Save";
}

スクリーン リーダーでは「保存 保存」と読み上げられます。