READMEやドキュメントに載るアニメーションGIFや短い動画の代替テキストの書き方を解説する。アニメーションが示す結果を書き、画面上に表示される文字を含める。装飾的な動きには空の代替テキストを付ける。
シェアックリップ
シェアされたアックリップです。
そのほかの #代替テキスト・alt ピックアップ
note
W3Cの資料をもとに、画像の役割を決めてから代替テキストを考える方法を解説している。絵本の紹介に添える画像を例に、AIに画像と前後の文章を渡して代替テキストの案を作ってもらう相談文も示している。
DEV Community
問い合わせフォームのアクセシビリティ監査で見つかった問題を、セマンティックHTMLの書き方で直した過程を記した記事である。label と input の結び付け、fieldset と legend によるグループ分け、画像の alt の付け方を扱っている。
DEV Community
Webサイトのアクセシビリティを検証する7つの観点を示した記事である。キーボード操作、セマンティックなHTML、コントラストとズーム、フォーム、代替テキスト、動的なコンポーネント、自動チェックと手動QAの併用を扱う。
DEV Community
ソフトウェアのドキュメントに載せるスクリーンショットの代替テキストの書き方を解説する記事である。画像の目的から書き始め、画面の状態を書くこと、手順の情報を画像の中だけに置かないこと、装飾的な画像には空の代替テキストを使うことを扱う。
note
AIで作ったLPを公開する前に確かめる7項目を紹介する記事。W3C WAIのEasy Checksを基に、ページのタイトル・代替テキスト・見出し・コントラスト・文字の拡大・キーボード操作・フォームを点検する。
note
画像を見ることが難しい人に内容を伝える代替テキストを、AIに文案として頼む前に、そのページで伝えたい意味を一行で決めておく方法を紹介する。装飾画像に空のalt属性を使う判断にも触れている。