ここにalt 動作確認ページ

各ケースで置き換え表示・クリック展開・後続要素の押し出しを確認するためのページです。

1. 通常のalt（短文）

前の段落です。

後ろの段落です。パネル展開時にこの段落が下に押し出されればOKです。

2. 通常のalt（長文・見切れ確認用）

後ろの段落です。クリックで全文が出て、この段落が押し出されればOKです。

3. 空alt（alt=""）

デフォルト設定では display: none になり、下の装飾画像が消えるのが正解です。

後ろの段落です。

4. alt属性なし

デフォルト設定では src のフルパスがテキスト表示されるのが正解です。

後ろの段落です。

alt属性なし画像の動作確認ページ（AIによる推測の確認用）

5. role="img" + aria-label

絵文字のかたまり全体が aria-label の内容に置き換わればOKです。

🎉👏🎊

6. role="img"（aria-labelなし）

こちらは何も起きないのが正解です。

🤔

7. スタイル継承の確認（継承スタイルモード用）

この段落は紫色・20px・斜体です。 継承スタイルモードでは、altテキストがこの文章と同じ見た目になればOKです。

8. 背景画像（roleなし）

デフォルト設定（背景画像：非表示にする）では、下の背景画像が消えるのが正解です。

後ろの段落です。

9. 背景画像 + role="img" + aria-label

こちらは背景が消えるのではなく、aria-labelの内容に置き換わるのが正解です。

後ろの段落です。

10. グラデーション背景（対象外）

グラデーションは画像ではないので、そのまま残るのが正解です。

グラデーション背景の要素

11. video要素（フォールバックコンテンツあり）

<video>内のテキスト「テスト用のサンプル動画（Big Buck Bunny）」が代替テキストとして表示されればOKです。パネルモードで不透明度を100%未満にしたとき、poster属性ありの方だけサムネイルが透けて見えるのが正解です。

後ろの段落です。

12. video要素（フォールバックコンテンツなし）

デフォルト設定では src のフルパスがテキスト表示されるのが正解です（AIによる推測は動画には適用されません）。こちらもposter属性ありの方だけサムネイルが透けて見えるのが正解です。

後ろの段落です。

13. 動的追加（MutationObserver確認用）

下のボタンを押すと3秒後に画像が追加されます。追加後に自動で置き換わればOKです。

3秒後に画像を追加

後ろの段落です。