原文：https://pauljadam.com/demos/altbgimg.html
※このページは動作確認用ページです。一部アクセシビリティに配慮していないコンテンツが含まれます。
DEMO一覧に戻るPaulJAdam.comでさらに詳しく（外部サイト）
背景画像や複雑な画像の代替テキスト
背景画像
CSSで視覚的に隠された説明文を持つdiv要素
Webブラウジングに影響を与える障害には、320万人の視覚障害者、390万人の聴覚障害者、790万人の認知・精神障害、および980万人の歩行障害者が含まれます。
div要素にrole="img"を付与し、aria-labelledby属性で「視覚的に隠された説明文をコンテンツに持つdiv[aria-hidden="true"]」を参照する
コンテンツに、CSSで文字色が透明なっている説明文を持ち、onClick属性とtabindex="0"が付与されたdiv要素
Webブラウジングに影響を与える障害には、320万人の視覚障害者、390万人の聴覚障害者、790万人の認知・精神障害、および980万人の歩行障害者が含まれます。
コンテンツに、CSSで画面外まで表示位置がずらされた説明文を持つa要素 (text-indent:-9999px;)
aria-label属性経由での代替テキストを持つa要素
複雑な画像（img要素)
1つの同じp要素（段落）にalt属性に代替テキストを持ったimg要素と、視覚的に非表示になった説明文を含む例
Webブラウジングに影響を与える障害には、320万人の視覚障害者、390万人の聴覚障害者、790万人の認知・精神障害、および980万人の歩行障害者が含まれます。
1つの同じp要素（段落）内でalt属性に代替テキストを持ったimg要素が、視覚的に非表示になった説明文をaria-labelledby属性で参照している例
Webブラウジングに影響を与える障害には、320万人の視覚障害者、390万人の聴覚障害者、790万人の認知・精神障害、および980万人の歩行障害者が含まれます。
alt属性に代替テキストを持ったimg要素が、視覚的に非表示になった説明文をlongdesc属性で参照している例
Webブラウジングに影響を与える障害には、320万人の視覚障害者、390万人の聴覚障害者、790万人の認知・精神障害、および980万人の歩行障害者が含まれます。