CodeGrid 12th Event Site

しっかり学ぶ、代替テキスト

全7回

代替テキストは普段は見えにくいものですが、画像が表示されないときや、支援技術にとっても重要なものです。このシリーズでは実装から代替テキストの考え方まで基礎を一通り身につけることができます。

最終回 代替テキストのケーススタディ 4

フローチャート、家系図、QRコード、アクセスマップの代替テキストを考えます。悩みがちな画像ですが、事例に沿って解説しますので、実務でのヒントとして使ってください。

第6回 代替テキストのケーススタディ 3

今回はバナー類と、グラフ類の代替テキストについて考えます。グラフ類は特に代替テキストが長めになる傾向がありますが、その調整についても考えます。

第5回 代替テキストのケーススタディ 2

「こんなときはどういう代替テキストを指定するの?」と、業務で出くわすさまざまなパターンをケーススタディ形式で解説します。今回はさまざまな写真や、形容が難しい画像について考えます。

第4回 代替テキストのケーススタディ 1

「こんなときはどういう代替テキストを指定するの?」と、業務で出くわすさまざまなパターンをケーススタディ形式で解説します。同時に、常に原則に戻って考える思考方法を身につけましょう。

第3回 代替テキストの考え方

代替テキストを書くポイントを解説します。ウェブを閲覧する人に意図したとおりの情報を伝達する機能を担うのが代替テキストであるなら、逆説的ですが、代替テキストを書くこと「だけ」にこだわる必要はありません。本文などさまざまなalt属性値以外で展開することも含めて考えてみましょう。

第2回 代替テキストのさまざまな表示のされ方

実装された代替テキストがブラウザ、アプリケーション、メールなどでどのように表示されるのかを押さえておくことは大切です。すべてのエージェントではありませんが、一例を紹介しつつ、その特徴をみてみます。

第1回 代替テキスト実装の基本

代替テキストはimg要素のalt属性で実装するだけとは限りません。img要素をはじめ、svg要素、area要素など少しマイナーな要素も含め、どのようにマークアップするのか、基本を解説します。