周りに相談できる人がいないので教えてください。
HTML5のお作法なんかを見ていると、HTML上に要素として書くことが妥当な画像は、例えば会社案内のマップや、ビジュアルが求められる商品写真などであり、それに該当しない挿絵などはCSSで書くべきだ、ということが書かれています。
なるほど、とそれに倣っていたのですが、子ども向けのサイトやイラストを多用したいサイトを作ることになった時、背景や:before:afterだけでは、イラストを入れきれないということがあります。
あまりそんな体験はないかもですが、そんな時どうされてますか？
よくHTML上の 文字（タイトルなど）を画像に置き換える手法も見かけますが、イラストを入れたいがために「○○のイラスト」という要素を書くのもなんだか間が抜けているかなぁ、と。
程度の低い質問で申し訳ないですが、アドバイスいただきたいです。
みんなの回答 3 件
それあんまり気にしなくていいよ。まじで。
プログラムから見た場合の分かりやすさと、人間が見た場合の分かりやすさが、同時に成立するコーディングが理想であるとは思う。ただ、それはほとんど学問的な理想であって、商業的なメリットに直結することは、今のところほぼないと思う。たとえば、img要素を使わずにCSSで画像を配置する場合、Google画像検索の不利は明らかで、ページビュー減少に直結するけど、それでいいのかって話。
ドキュメントとして「意味のあるもの」はHTMLに、
「装飾以外の意味の無いもの」はCSSに、
が基本です。
見出しなどそれ自体に意味のある画像は普通にimgでaltに文字で同等の文言を書けばいいです。
文字を画像に置き換えるやり方は俺も使うけど、
なんていうか、レスポンシブで画像と文字を切り替えるときにやりやすいってだけです。
どんな手法を選ぶかは自由ですが個人的には、jsとcssを「切った状態でも」同じ意味に読めれば何をやっても問題は無いと思います。
そこから先はページ設計ではなくUA側で対処する物だと思いますし。
関連するトピックス