どちらの方が見やすく、信用力が高く感じますか？

質問

http://matsu.tm.land.to/
上記サイトのA案とB案。

どちらの方が見やすく、そしてサイトの信用力が高く感じますか？

内容は同じ文章で、最新情報を表すものです。

よろしければその理由もご記入願います。

回答No.10

quads

■構成上の問題。
内容がテキストである以上、画像を利用することは様々な面で不適切です。

img要素で呼び出される画像は、そもそも図やイラストなど、画像として情報を表現することを目的とされている。といった感じです。

デザインや装飾的なことに使うのであれば背景として使えばいいのです。しかし、例えば、特殊なフォントで画像として表示させることでブラウザやフォントに依存せずに表現することが出来ますが、本来の扱い方からすれば不適切です。

そういう意味で、画像でなくてはならない必要、画像の方が適している（グラフなど）という場合以外は、画像の濫用は避けたほうが良いです。

■実際の問題。
上記の通り、タイトルの一部を画像化する。というのはアリです。また、alt属性値にその文面を入れればアクセシビリティ上も問題ないと思われます。
が、今回のような所謂、文章全体。を画像化してしまうのは、一般的には不適切であり好ましくありません。
例外として、例えば隠しページが云々とか、情報を態と伝えにくくする。という理由で使われることはあるかもしれませんが、それはそれです。

既に仰られていますが、コピペしたいときにコピーできなかったり、フォントサイズの変更やユーザスタイルシートによる操作に対応できません。
その面でも、ユーザビリティ上不適切でしょう。

■デザイン的に。
HTML構文とか実質問題は考えなくとも（＝印刷物として使うなど）、こんな影の付け方では見にくいです。
太字部分が潰れていたり、文字が装飾に対して小さかったり、視覚的に色の相対性が悪いという印象を受けます。

上記のような内容から、相対的にＡよりＢの方が良い。という考えになります。

この2つのうち、
見やすいのは、デザイン的な問題から比較した結果Ｂ。
サイトの信用力は、構成上の不適切さから、比較した結果Ｂが高い。

と考えられます。

ただ、提示されたページはWeb標準の面から評価しても非常に悪い印象を受けます。
サイトの信用力が気になるというのなら、表現方法よりHTMLに於ける文法云々を理解した方が良いでしょう。

お礼

ご回答、ありがとうございます。
今後のページ作りの参考にさせて頂きます。
ポイントについては回答順で付けさせて頂きました。