今回の日記はちょっぴり難しい話になりますが、ひとことで言ってしまうと、

　　画像の上にカーソルをのせたときにコメントを表示させるには
　　imgタグのtitle属性を使って指定してやればいいですよ～

っていうことです。

タグをご存じないかたでも、あちこちのホームページをうろうろしていると
「画像の上にカーソルをのせると文字が出る」ことがあると思います。

これは本来「title」で指定するものなのですが、「alt」もよく使われています。
恐らく、シェアの高いWindows版IEでは、画像にカーソルをのせたとき、
「alt」に指定したテキストを説明コメントとして表示されているからでしょう。
同じIEでもMac版では、画像にカーソルをのせたときに、「alt」に指定したテキストが
表示されることはなく、この「alt」の解釈はWindows独自の仕様だと思われます。

でも「alt」というものは、そういう使われ方をするためのものではありません。

本来は、画像が表示されないとき、そこにどんな画像が使われているかを
示すために指定するもので、読み込みが遅いときやエラーのときに表示されたり、
テキストブラウザや音声読み上げソフトを使ったときに活用されています。

つまり、本来の使い方としては、「alt」は必須で画像の説明を入れるもの、
「title」は必要に応じて、画像に対するコメントを入れるもの、ということです。

知ってはいても、使い分けるのが面倒でつい「alt」を「title」がわりにしてましたが、
これからは気をつけて書き分けていくようにしたいと思っています(^_^;

最近作っている楽天広場のオススメページにつけた紹介コメントや、
レシピページ、日記ダイジェストで使っている写真説明だけでなく、
3/9以降は日記の写真にもどんどん使っていくことにしましたので、
これからは気になる写真の上にカーソルを動かしてみてください(^_^)

「このワザ、使ってみたい～」と思われたら、こちらのページにタグの書き方などが
詳しく紹介されていますので、ぜひご覧になってみてください。

IMG－HTMLタグリファレンス


最後に、Windows版IEでの見え方について補足しておきます。

「alt」だけ指定すると、画像にカーソルをのせたとき「alt」の内容が見えますが、
「alt」「title」の両方を指定すると、「title」の内容が表示されるようになります。

「alt」に書いた内容を表示させたいときは「title」にも同じ内容をコピペしてください。
もっとも「alt」の内容って、本来は「イラスト1」とか、画像の説明になるはずので、
「title」には「alt」とは違ったことを書きたくなるものだと思いますが(^_^;