dポイントプレゼントキャンペーン実施中!

img要素のalt属性で質問があります。
今windows環境のSafari3.1で確認済みなのですが、ある一定のwidthとheightを指定してやらなければsafariの場合は画像オフ(リンク切れ)の場合にalt属性が見えません。
ですが、さすがにフォントサイズと画像の大きさにによってはwidthやheightが対応できません。

これを常に見えるようにコントロールする方法はないでしょうか?
できるだけコントロールするほうが好ましいですが、safariでのアクセシビリティを上げるためにできそうなことでもかまいません。

A 回答 (4件)

どれも、いまひとつですが思い付いたことを。



CSSでimgの文字サイズを指定する。
img{font-size:xx-small;}
代替テキストの文字サイズを小さめに設定しておくことで「なるべく」表示されるようにする。(これは既にやってるのかな?)

title属性も付けて置く。
マウスオーバでバルーン表示してくれるのでないよりマシかも。

Javascriptでロードされていないimgのwidthやheightを再設定する。
(うまく代替テキストが収まる大きさを導き出すのは結構難しいかもしれない)
    • good
    • 0
この回答へのお礼

回答ありがとうございます。

javascriptが一番何かできそうですよね・・・。(Javascriptはまだまだ勉強中でよくわからないんですが)
titleとaltを別にしないといけない状況がある可能性を想定するとtitleは難しいですね。

お礼日時:2008/06/05 16:23

逆にwidthやheightを指定しない、というのはいかがでしょうか?


widthやheightは記述が推奨される属性だとは思いますが、
書かなければ、メジャーなブラウザでFirefoxと同じような表示になると思います。
(結構前に検証した記憶なので、今では違ってるかも。
メジャーなブラウザの中にiCab、Omniweb、Netfrontは含まれません。)

IEのobjectはclassidをちゃんと指定してやらないと、paddingがかなり大きく取られて、コンテンツが思うとおり表示できないと思います。

Firefoxの独特の表示方法により、<span>と同じ見た目になりますが、
alt属性はあくまで属性ですから、マウスで選択できなくて正解じゃないかと思います。

この回答への補足

なかなか難しいようですのでこのあたりでいったん締め切ろうと思います。
ありがとうございました。

補足日時:2008/06/07 19:56
    • good
    • 0
この回答へのお礼

私もできるだけwidthやheightは指定したくないですね。
ただ、何も指定しないとやっぱり見えなくて(汗
今自分の中で一番有力なのはmin-heightとmin-widthをem指定するというものなんですが、これも画像が表示されている状況ではどうしようもなくなりますし。

objectに関してはいろいろと考えてはみたんですが、safariは画像が表示されないときでも代替要素を表示しないようで、imgよりも酷い状況になってしまいました。

お礼日時:2008/06/06 09:15

追記:


意外とobject要素使えるかもしれない。

https://bugzilla.mozilla.org/show_bug.cgi?id=12460
上はMinefield Trunkの話だが,Opera,Safariでもalt属性によって表示される文字列は選択できなかった。
    • good
    • 0

object要素を使ってみる。



#IE6で問題出たような気がするけど,手元の環境はIE 8になっているので
VPC使うのも面倒くさいし,検証は断念。
    • good
    • 0
この回答へのお礼

実はobjectのほうはもっと深刻で、imgの場合は横幅は文字数ぐらい確保されるのですが、objectはまるで代替要素がないかのように表示されます。
objectの代替要素としてaltを入れたimgでieには対応できるのですが、結局imgの問題に戻ってしまいますし。

お礼日時:2008/06/05 16:34

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!