私が大好きな blog、soundscape out さんで美しい NewsNetWire のスタイルが紹介されていたのを見て、ふとこのネタを思いつきました (笑)

こういうスタイルってとても美しいのですが、海外のデザイナーがデザインしたものは大抵、そのお国の特定のフォント (や、特定の英字フォント) で表示したときに美しく見えるようにレイアウトされているわけです。ところが、日本語でそのスタイルを使った場合、本来設定されているフォントでは日本語が表示できませんので、システムは代替の邦字フォントを呼び出してそこに適用します。そうすると、問題が生じます。どうしても本来デザインされたレイアウトのバランスが崩れてしまうわけですよ。やたら文字が小さくなったり、タイトルだけ馬鹿でかくなったり。

例えば、soundscape out さんで紹介されていた Serif Black というスタイル。英語だとこんなに美しいのに、

(UsingMac.com さんの記事を拝借)

日本語だとこうなっちゃいます。

※NewsNetWire の環境設定で NewsItem のフォントサイズは 14 にしてあります。

タイトルがでかすぎる。文字と文字の間が空きすぎていて読みにくい。それと、広い画面ではちょっと幅が狭すぎる。

しかしこれ、簡単に調整できるんです。というのも、NewsNetWire のテーマの中身は css と html なので、css をちょいちょいと調整してやれば見やすくなります。

Serif Black の場合で見てみましょう。

1. インストールしたテーマは、ホーム/ライブラリ/Application Support/NetNewsWire/StyleSheets にあります。
2. Serif Black.nnwstyle ファイルをコピーして別の名前を付けます。
3. コピーしたファイルを右クリックして、パッケージの中身を見てみましょう。
4. すると、stylesheet.css というファイルがあります。これを編集します。css エディタがあればそれを使ってもいいですし、テキストエディタで開いても構いません。
5. max-width: 450px; とか、width: 450px; となっている部分がいくつかあると思いますが、これはそれぞれ、画像、ヘッダー、タイトル、記事情報、本文の幅を指定しています。
6. 表示幅をもう少し広げたい場合は、この数値を大きくしてしまいましょう。例えば、私の場合は一括置換で 450px を全部 550px にしました。
7. 次に、文字ですが、/*Typography*/ 以下の部分で指定されています。body、#title、#description にある font-family: というのがフォントの種類、font-size: が文字の大きさですね。line-height: は行の高さ、letter-spacing: は字間です。
8. 私の場合は #title の font-size を 3.6em から 3em に変え、line-height を 1.1em から 1.3em にしました。 
9. さらに、body の line-height を 1.5em から 1em に変更し、letter-spacing: 1px; を削除しました。
10. 変更を保存して、NewsNetWire を再起動します。すると、こんな感じになります (ちょっとやり過ぎたかも: 汗)。

あんまりいじくりすぎるとせっかくのデザインが壊れてしまうのでほどほどにしましょう (汗)

それから、カスタマイズしたスタイルの再配布はオリジナルの作者の権利を侵害する可能性がありますので (本人が OK だよ！と言っていれば構いませんが) 注意してください。

ちなみに、記事のタイトルに示したとおり、Growl のスタイルの中身も css です。海外のデザイナーがデザインした Growlstyle は、日本語で使うと文字が小さすぎたり大きすぎたりすることがありますので、やっぱり css をちょっと調整してあげると綺麗に表示されます。Growlstyle は、ホーム/ライブラリ/Application Support/Growl/Plugins にインストールされています。