MT100本をAmazonで購入!

HTML5のimg要素のalt属性の仕様は読んでおくべきだと思う。

07月30日(木)20:12

category
(X)HTML

読んでおくべき。で終わってるタイトルが、自分っぽくなくて違和感有り有りだったの何となく変更。

都道府県選択するやつ。がもしかしたら一日辺りの過去最高のアクセスを稼いだかも知れないという現実。
7月16日のアクセスが17,000PVオーバーって何だ・・・おかしいな、ウチはCSSネタが主力なのに・・・あぁ複雑。

本題ですが、HTML5のimg要素のalt属性に関する仕様がすごい事になってますね。
ちょっと読んでて泣きそうになるくらい事細かに書かれています。

これは、コーディングを生業としている人間なら覚えていなければならないと思うので、必読すべき内容です。

---- こっから続き

ざっくりまとめると、その画像が無くても完全に意味が伝わるようにしろって事です。
本文内に画像が出てくる場合は、前後の文書とalt属性の値が不自然になるのもいけないってなってますね。

図なども、タイトル的な書き方ではなく、事細かに書けと、仕様書が言ってるのはちょっとすごい事だなぁって思いました。

例えば、「図:CSS HappyLifeの1カ月辺りのアクセス数」
とかは全然ダメで、
「CSS HappyLifeの1カ月当たりのアクセス数はxxxxPVで、何日のエントリー時にはxxxxPV上がっているのが確認出来ます。うんたらかんたら」
みたいに書く必要があると。

alt属性をどうやって入れるか悩んでいる場合、大いに役立ちそうですが、ガイドラインやこうやって書くといいよ!的なものではなく「仕様」として考えてるってトコロがすごいです。

HTML5のリファレンス本とか書く時も、この説明省けなくなるって事っすねぇ・・・alt属性の節だけで何ページ使うんだろう(笑

なんにせよ、仕様としてこれだけの事が書いてあると、HTML5じゃない場合でもalt属性をどうするかっていうのは影響しますね。

各種SBMに追加
  • Hatenaブックマークに追加
  • del.icio.usに追加
  • POOKMARK Airlinesへ追加
  • livedoorクリップへ追加
  • ニフティクリップへ追加
  • newsingへ投稿
  • Redditへ追加

comment [8]

1 - Zoorasia さん

文字原稿と写真素材が来ても、写真やグラフや組織図など埋めるimg要素のライティングに時間が取られる…と言うことかしら。クライアントに「画像の細かい説明文の原稿もください」と説明するのか、それはコーディングエンジニアの提案として文章を揉むのか…、どちらにしても慣れるまで手間取りそう。

URL|2009年7月31日 04:15

2 - Koji さん

分かりやすいまとめ感謝です。
ちょっと脱線しますけど、alt入れすぎて、スパムになって。。。Googleでも読み込まれなくなって。。。みたいのを想像しちゃいました。

そうなるとやっぱりみんな画像置換に手を出すんですかね(^^;)

URL|2009年7月31日 09:38

3 - えど さん

なるほど・・色々と大変ですね。しかも仕様って・・。
イメージとしては、小説で場面などの描画をするのに似てるかもしれませんね。
家の雰囲気とか形とかを説明したりとかそういう。

アイコンの隣に説明文があると空でなければいけない、というのがなんか慣れない感じですねw
これは知っておかないとー。

URL|2009年7月31日 15:15

4 - frankly さん

元来、「図:CSS HappyLifeの1カ月辺りのアクセス数」というのはalt属性ではなくtitle属性に書くべきものなのでは?

もともと仕様がどうなっていたかは把握していませんが、altは代替テキスト(alternative)を入れる属性なのだから、「図:CSS HappyLifeの1カ月辺りのアクセス数」のような画像のタイトルを入れるのはXHTML1.0でもHTML4.01でも見当違いなのではないでしょうか?

2009年8月 1日 14:32

5 - hirasawa さん

>franklyさん
言ってる事は特に間違ってないと思います。
ただ今までは、詳細な説明に関してはlongdesc属性を使うとなっていたので、alt属性があまり冗長になるのは良くありませんでしたし、あくまでも簡単な代替テキストを入れるとなっていたので、図などは文書にすると冗長になりやすいと思うので、簡潔にまとめるとタイトルのようにするのがベターじゃないのかという判断からです。
特に仕様書の場合、厳密に具体的な使い方までは書かれていないケースが大半で、それぞれの人で解釈の違いや考え方の違いが生じやすいですし、一概にコレが正しいという類では無かったので色んな意見が飛び交い、その中で自身が一番正しいと思った選択をしているかと思います。

この辺りも色々突っ込んで書くと長くなりすぎてしまうので、割愛させていただきますが、ボクはあまり人の考え方に対してどうこうってのは無いですし、ボクの考えを無理に押す気も無いので「仕様は把握していないが、それは見当違い」だと思うのでしたら、自身がもっとも正しいと思うやり方で良いと思います。

URL|2009年8月 1日 16:17

6 - 真昼のコーダー さん

コーディングを生業としている立場から言えば
altなんて要求があったとき文字列読み出して
表示するためだけのもんすよ。

2009年8月 5日 13:32

7 - shkd さん

企業向けのサイト構築時は「alt」の値をどうするか、予め定義して行っていますが、alt原稿を要求することが出来ない例がおおく、そもそもWebサイトとしてのターゲットによって、ただただ負荷になることになるので、そこにどんな画像があるかタイトルレベルで記載することが多いです。
グラフとかをHTMLで容易に表現出来れば、苦労しないんでしょうけどね…。

URL|2009年8月17日 11:18

8 - Kawehi さん

いつもこちらのブログでは本当に本当に助けて頂いております。本当に信頼できる確かな情報で、私にとってはバイブルです。本当に感謝してます。これからも楽しみにしております。記事とは関係ないコメントなので、アップして下さらなくてもOKです。私も本日、たまたまこちらの記事をトラックバックして記事を書いたんですど、altってそうなんですよね、重要なんですよね。なので、「
JavaScriptを使わずにやるimg要素のロールオーバーサンプル」の記事、大変参考になりました。

URL|2009年9月 8日 20:21

コメント投稿フォーム

post your comment

※コメントが認証されるまで、コメントは反映されません。ご了承くださいませ。

ブログパーツ

フィードメーター - CSS HappyLife

Feeds購読数

あわせて読みたい

change color or layout
  • デフォルトカラー
  • 薄い青
  • 青緑
  • 緑
  • 青
  • 薄い紫
  • ピンク
  • 黄金
  • 茶
  • 赤
  • 黒
  • 白
  • シルバー
  • 2カラム(カラーはデフォルト)
  • リキッドレイアウト(カラーはデフォルト)

ページトップへ