--年--月--日

●スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

2006年04月03日

●可読性、フォントファミリー設定編

 先日書いたように、ちょこっとずつスタイルシートの勉強をしてみている。と言っても、ここで使っているCSSファイルを印刷したやつを1行目から眺めて、分からないところを検索してあーなるほどー、ってやってるだけだけど。ネットって素晴らしいですね。「本当にいろいろ知識をつけようと思ったら何か書籍を買ってくるほうがいい神話」を断固として否定したいぐらいだ。
 とりあえず、分かるところ・分かりやすいところから何か変えてみて、CSSの書き方を理解していこうと思った。書きながら理解しようという魂胆。セレクタとか要素とか、読んでるだけだと理解できん用語がいっぱいあるし。多分そういうのって自分で書いてみるとあっさり分かることもいっぱいあるんだろう。

 というわけでまずはフォントの変更。頭を一文字分空白で下げて、ばーっと書いて意味の区切れるところで次の段落に移って、大きく意味の分かれるところで一行分空行を入れて、っていうわたしの文章の癖が悪いのだが、このごく普通の日本語文の書き方はブラウザ上ではいまひとつ読みやすさに欠ける。文章の書き方を工夫することはもちろんなのだけれど、ここはひとつ、なんとかしてフォントを変更することで読みやすくできないか? と思った。
 自分の好みとしては、行間大きめ・字間小さめが読みやすい。なので何かプロポーショナルフォントを使いたい。昨今のオサレブログのサイズ固定豆字UIゴシックには不満を覚えつつも、そこそこのサイズのMS UI Gothicは読みやすくて好きだ。日本語部分はこれにしよう。
 職場でWordいじるときに使うのは、日本語にMS明朝・英数部分にTimes New Romanの組み合わせが多い。どこが半角なのかが見分けやすくなるからなんだけどね。だけど明朝体はこれもまたブラウザで読むときには非常につらいフォントだ。Timesも、明朝系の(serif字体の)フォントなんだけれど、こちらはゴシック体との組み合わせでも比較的読みやすくて好き。
 そんじゃーTimes New RomanとMS UI Gothicという組み合わせにするか。というわけで、まずは単純に「font-family : "MS UI Gothic", "Times New Roman", sans-serif; /」と書いてみた。んだけれど、英数部分がTimesにならず、全文がUIゴシックになってしまう。順番の問題か?と思い、UIゴシックとTimesを入れ替えてみる。が、今度はUIゴシックが反映されず、PゴシックとTimesの組み合わせになってしまうようだ。えーどうしてー?
 検索したら意外とあっさり答えがみつかりました。KeyNavi.Netによると、IEでは、一つ適合するフォントを見つけたら、もうそれ以降は読みにいかないということらしい。つまり、上記のわたしの最初の書き方だと、UIゴシックだけが採用されて、Timesは無視されてしまう。
 しかもどうやらIEでは日本語に使うフォントと英数部分に使うフォントを分けることはできないらしい。全体にTimesを採用しても、Timesの日本語フォントというのは存在しない。ではどうするかというと、日本語部分にはTimesの仲間とされているMS Pゴシックが自動的に割り当てられるということのようだ。(WordでできるんだからてっきりIEでもできるもんだと思ってたが、そういえば設定画面からフォントの項目を開くと1種類しか指定ができない。それはきっとそういうことなんだろう。)
 CSS初心者入門サイトをあちこち検索していて、フォントが複数指定されていたのは、日本語表示用と英数表示用に分かれていたのではなくて、OS別とかブラウザ別に対応するための設定だったんだな。ようやく納得した。まぁ分かりやすく変化を試してみるために、ばっさりUIゴシックを削ったらとりあえず思惑通りに表示されたので、しばらくはこれでいってみようと思う。
 けれどこれで万人に読みやすい表示ができているとも思えないなあ…なるべく読みやすくする工夫ってどうすればいいんでしょうね。試行錯誤は続く。
スポンサーサイト

メイン

コメントする

サイト管理者にのみ通知する

トラックバックURL


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。