EKKEN♂

このブログは http://ekken.blog1.fc2.com/ に移転しました

フォントいじりとテンプレートの選択

2004-11-26 | WEBにまつわる話
 テンプレートのデザインの話なんですけど、
 「全体の構成は好きだけど、字の大きさとか色がちょっと・・・ 」
という人が多いのでしょうか、記事本文の全体をフォントタグを使って変更している方がいますね。
例えばこういう風に
 メタルテンプレ兄弟のように文字の小さいものを大きく表示させたい場合や、空テンプレのように背景色と文字色のバランスが悪くて見難いのを調整する為、あるいは、ブログ主さんの気分によってという人もいらっしゃるようです。
 なるほど、確かにそれは面白い使い方です。
 僕も強調表示させたい時や、引用部分を分かりやすくする為に、青字赤字フォントサイズ-1をよく使います。
 でも、これを記事全体に使うことって、僕はあまりオススメしません。
 本日も新しいテンプレートが追加されました。
 見た目のセンスは、なかなかのものだとは思うのですが、正直機能的には今一歩ですね。綺麗な画像を表示させる為だけのサイドバー、ちょっと無意味なんじゃないかな。
 いや、言いたいのはそんなことじゃなくて。
 新しいテンプレートが発表されたら、一度は使ってみたくなるものです。
 僕は現在のパセリクラブモノトーンが大変気に入っているので、当分変える気はありませんが、新しい物好きの方は、テンプレ追加を知って早速変えている人も多いでしょう。
 で、先ほどのフォントカラーを変えている人の話です。
 そういう人たちは、恐らくはそうそう簡単に、テンプレートを変えていないのではないでしょうか?
 それは記事部分の背景色と、文字色とのバランスの問題があるからです。
 ちょっとこれを見てください。

背景色が白の場合
黒い字だとこうなります。
赤い字はこうですよ。
青い字だとこんな感じ。
水色だよ~ん。
緑ですよ緑!
黄色でぇす! 黄色黄色っ!
灰色でんがな。そこんとこよろしく。
銀色でごわす。
紫の雨の中で。
そんでここが白い字なのら。



で、背景色が黒の場合
黒い字だとこうなります。
赤い字はこうですよ。
青い字だとこんな感じ。
水色だよ~ん。
緑ですよ緑!
黄色でぇす! 黄色黄色っ!
灰色でんがな。そこんとこよろしく。
銀色でごわす。
紫の雨の中で。
そんでここが白い字なのら。



 どうですか、明らかに読み難い文字色ってありますよね。
 白背景の場合だと、水色と黄色と銀色が非常に読みにくく、当然白い字は選択して反転させないと読めません。
 黒背景の場合は、青と紫、それに緑が読みにくいでしょうか。当然黒い字は読めませんね。
 ここでは白背景と黒背景の例だけを取り上げていますが、もちろん他の背景色でも似たようなことがいえます。背景色に対して、読み難いフォント色が存在します。空テンプレはテンプレートデザインをした方のモニタの性能が非常に良かったのでしょう。我々ビンボー人が使っているモニタでは、多くの人が読みにくいと感じるバランスだと思います。
 つまり、フォントカラーを変えることを多用する人は、テンプレートを変えるときには、よく注意しないと、大変読み難い記事がたくさん出来てしまうことになるのです。
 実質使えるテンプレートに制約が出来てしまうのですね。
 僕なんかは、青字、赤字をよく使うので、空テンプレの他にも釣りテンプレもみじテンプレ、それに今回加わったツリーテンプレ等を選ぶことが出来ません。
 テンプレートの背景色は、白・または白に近い色が大変多いので、白背景で見やすい色のフォントカラーを使っていれば、テンプレートの選択肢は多いのですが、むやみにフォントカラーを使うと、組み合わせによっては読み難い色がでてくるので、気をつけたほうがよいです。
 余談ですが、これを回避する方法として、コンビニ・フリーク方式があります。
 コンビニ・フリークのkazumuchaさんのテンプレートが、同じテンプレを使っている他の人とは、若干違うように見えることにお気付きでしょうか?
 詳細は★レイアウト紹介:罫線をいれましたに書かれていますが、テーブルタグを使って記事本文全体を括ることによって、テンプレートの背景にとらわれないデザインを作り上げているのです。この方法だと、もし背景色の異なるテンプレートを選択しても、記事部分はそれまでと変わらないデザインになるので、テンプレを変えても文字が読み難くなるということがありません(その代わり、テンプレを変更しても、あまりイメージが変わらない)。
 
 他にもテンプレで指定されている文字の大きさが小さいからと、フォントサイズを指定するのは、考え物です。
 そもそも、文字の大きい小さいは、ブラウザの「表示」コマンドのなかの「文字の大きさ」の設定で変えられます。小さすぎて読みにくいのなら、通常は「中」になっている文字の大きさを「大」または「最大」にすればすむことです。
 下手にフォントタグでサイズを変えてしまうことは、閲覧者が設定している「読みやすい文字の大きさ」を邪魔するものとなってしまいますし、やはり他のテンプレに変えるときに、選択肢を減らしてしまうことになりかねません。


追記:
怒涛のカラーサンプルとか、Color Dictionary Onlineなどで、フォント色と背景色の組み合わせを確認すると良いでしょう。自分が使用しているテンプレートの背景色が分からない人は、自分のブログを表示して、ブラウザのメニューから「ソースを表示」させて、CSSファイルのアドレスを調べれば、CSSファイルを見る事が出来ます。とはいえ、結構面倒なので、お気に入りの色 のようなカラーコード取得のためのフリーソフトを使う方法もあります。