こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

-広告-

締切り済みの質問

画像文字 HTMLのつくり

HTML上に画像文字で表現する場合にタグの作りとして皆さんはどのようにされていますか?理由も記載頂くとありがたいです。

<img タグで書いて altにテキストの内容を記載
<img でtitle属性にテキストの内容を記載
<divなどのボックスを造りその中にテキストを記載し、CSSにて背景に画像文字を表示し、テキストは非表示にする。

等々

投稿日時 - 2017-10-12 14:06:30

QNo.9385008

暇なときに回答ください

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

-広告-
-広告-

回答(1)

ANo.1

私の場合、基本的に文字を画像で表現するということをしません。アイコンフォントやCSSを使って表現することがほとんどです。
どうしても文字を画像で表現する必要性があるときは以下のようにすると思います。

imgタグで記述しaltに代替テキストを記載。あとはアクセシビリティ向上のため、role属性とaria-labelなどを付け加えるといったところでしょうか。

文字を画像で代替するときに最も気をつけねばならないことは、それが何を表すのか、仮に画像が表示されなくとも伝わるようにすることだと思っています。(これは文字を画像で代替したくない理由の一つでもあります。)これを考慮に入れて上記のような実装になります。

投稿日時 - 2017-10-12 23:21:23

お礼

ありがとうございます。

画像表示でしか無理なデザインをあげてくる人もたまにいるもんで質問させていただきました。

投稿日時 - 2017-10-17 09:43:40

-広告-
-広告-

あなたにオススメの質問

-広告-
-広告-