このウェブサイトを定期的に見ている人はお気付きかもしれませんが……否、そんな人はもはやいないと思うので、わたしだけしか気付いていないと思うのですが、去年からフォントをはじめタイポグラフィ周りがちょくちょく変わっています。今年に入ってからまた調整し直している中で、フォントの選定がまー難しくもあり楽しくもありで、ここ数日でようやく落ち着いてきたというところです。
今のテンプレートにしてから行間とか文字詰めは何度か調整していたのですが、1年前ぐらいからほかのブログとかnoteの記事なんかを読むにつけ、自分とこの（ただでさえ量が多い）文章が読みにくく感じることが多かったということと、最近PowerPoint/Keynoteスライドとか動画なんかを作成するときにフォントについて考えることもあったりして、このタイミングで見直し。
もともとこのサイトではフォントにはほとんど頓着していなくて、この17年間でマジメに検討したのも1、2回ぐらいの話です。まあ、ちゃんと自分でデザインしてサイトを作っていた10数年前はフォントの選択肢なんて大してなかったので、そこから認識がアップデートされてなかったということですね。ＭＳ ゴシックは好きでなかったので、メイリオが使えるようになったときはさすがに飛びつきましたが、その後はとりあえずメイリオが表示されていればいいや、ぐらいのもので。
とりあえず、とは言いつつ、個人的にはメイリオをけっこう評価していたので、メイリオでもいいっちゃいいのですが、iOSで見たときに表示されるヒラギノ角ゴとの印象の差があるのはちょっと感じていたのと、親しみやすいフォントゆえの、いかにもブログ！という雰囲気を変えてみようかなと思い。
ちなみに下に書く設定はWindows環境を念頭に置いたもので、iOSやmacOS環境についてはそれこそ基本的にヒラギノフォントで表示されればいいや、です。空気とか水みたいなフォントで、言ってしまえば無難な選択肢ですが、Webで表示されるフォントに必要なのは結局そこですよね。無難は普遍です。
本文: 游ゴシック / Open Sans
和文フォントは去年の夏から游ゴシックになっています。比較したのはBIZ UDゴシックとかNoto Sansですが、10年以上前から自分が思っていることとして、モダンな和文フォントは線がしっかりして可読性が高い反面、ブログ記事で見ると文字そのものの主張がやや強くなりがちというのがあって、わたしがいつも書いてる記事は段落ひとつにつき300-400文字はあるので、文字が羅列されていればされているだけなんだかコントラストが強くてギラギラして見えてしまうわけですね。
まあ、特にNoto Sansあたりは綺麗に見せているウェブサイトは非常に多いので、このサイトの内容が悪いだけなのですが、その点で言えば游ゴシックは、読みやすさと美しさを両立しつつ線がシャープで字面はコンパクトという、上記のような懸念を解消できる選択肢でした。これがWindows標準で使えるというのはありがたい話です。ただ、ウェイトがRegularだと逆に細すぎるので、font-weightを500に指定してMediumを表示させています。
そういうわけで、しばらくWindows向けには游ゴシックのみを指定していたのですが、英数字がやや縦に長いのが気になっていて、いくつか欧文フォントを試した結果、Open Sansになりました。もともとこのテンプレートでは見出しに使っていたのですが、曲線にモダンな可愛げがあって、かつ全体的にシャープなので、游ゴシックと雰囲気は通じていると感じます。iOS環境で見た場合のヒラギノとの相性も悪くなかったので、今年の初めぐらいからはこの組み合わせになっています。わたしが飽きるかWindowsのフォント事情がまた変わるまではこれでいくということで。
見出し・ナビゲーション: BIZ UDPゴシック / Open Sans
記事タイトルとか、たまーに使う章見出しにはBIZ UDPゴシックを使うことにしました。これも今年の初めから。ぱっと見モリサワっぽくすっきりしていて、非常に読みやすいUDフォントです（実際はタイプバンクフォントが元になっているようですが）。ただ、英数字の字面がかなり大きいので、これもOpen Sansと組み合わせる形にしています。
それから、下部のタグクラウドとかのナビゲーション欄にもBIZ UDPゴシックを使っています。これこそUDフォントの本来の使い方のような気もしますが、小さいフォントサイズでも可読性が全然落ちません。ちなみにタグクラウドとカテゴリー欄だけ英数字もBIZ UDPゴシックを使っています。
引用文: 游明朝
たまーに、というか稀に使う引用文は、本文からの流れとして游明朝。こういう具合です。
AKB48 Team8茨城県代表 TeamA兼任キャプテンの岡部 麟です。
そもそも游ゴシックが游明朝と組み合わせて使うことを念頭に置いて作られているらしいので、使わない手がない。個人的に游明朝という書体はけっこう好きで、実を言えばこっちを本文に使いたいというのもあったりしたのですが、さすがに文章の雰囲気が違いすぎました。
あと、この部分に関しては付属する従属欧文フォント以上にマッチするセリフフォントがまったく見つけられず、混植せずそのまま使用しています。完成度が高いなあと。ヒラギノ明朝も同様。
サイトタイトル: Montserrat
左上のサイトタイトルは今までOpen Sansだったのですが、Montserratの細いウェイトのものを使っています。Open Sans以上にチャーミングなフォントなので、もっとうまく使いたいところではあります。
というふうに、去年の夏ぐらいから断続的に色んなフォントを試しに試し続けてきた結果、そろそろ今の時点での納得できる設定が出来上がってきたというところです。奥が深すぎて沼にも程がありましたが、だいぶ検討はしたので、よほどのことがない限りこれで戦っていくんじゃないでしょうか。自分でAdobe Fontsとか、FONTPLUSとか使い始めない限りは（ない）。あとはmacOSでの見え方が自分で確認できてないので、どこかで見ておきたいとは思っています。
昔話
昔はフォントに頓着していなかったと上に書いてますが、ごく初期はむしろまあまあ拘っていたんですよね。というのも、互換性とか何も考えていなかったからなわけですが。
覚えているのが、ごくごく初期の数ヶ月間、サイトタイトルのフォントにSmall Fontsというドットフォントを使っていたこと。当時はゲームの記事とかが置いてあったので、ゲームっぽいポップさを出したかったのでしょう。ちなみに、この時はスタイルシートを使っていないのでfont要素で直指定。その後何ヶ月かは、当時IE6だけで使えた（！）filter: Alphaプロパティでタイトルに半透明グラデをかけたり（笑）、なぜかスラヴセリフ体っぽくしたり（たぶんCourier New）、まあ遊んでいました。
ここまではサイト開設半年ぐらいの話で、Photoshop Elementsを買ったことをきっかけに妙なフォントをHTMLで指定して使うのをやめて、画像にアンチエイリアスをかけた文字を埋め込んで表示させることを覚えるわけです。これも今思えばそんなことやってたなあという感じ。とはいえ、ほかに書体を持っていたわけでもないので、最初は基本Arialだったような気がしますが、当時のバナーとか確認すると、後になるにつれVerdanaとかTahomaも使っていたみたい。
ちなみに本文は2009年頃までずっとMS UI Gothicでした。縦に長くて文字が詰まっている感じがよかったんですかねえ。サイズは当時の流行に漏れず、8ptとかそのくらい。ビットマップフォントは中途半端なサイズにするとドットの粗が目立ってしまうので、文字をあえて小さくして綺麗なふうに見せていたという。どうにかこうにかはしていましたけど、当時のWindowsのフォント事情はこんなものでした。
2010年にWordPressに移行してからは本文フォントをメイリオにしたぐらいだと思います。もうこのあたりでウェブデザインということをやめてしまったわけですね。ただ、まとまった文章を書くようになるのと同時に全体の可読性を意識するようになって、ちょっと読みにくいなと思ったら文字サイズと行間、文字詰めを調整したりはしていました。このあたりの調整は10年ちょっとの間にそれなりの回数やりつつ、この記事冒頭に続く。
じつはWPサイトになる少し前にサイトデザインを新しくしようとしたことがあって、このハイフンがないサイトタイトルの画像を作ったのですが、結局お蔵入りにしてしまったんですよね。今回変えたサイトタイトルの表記はここから来ています。12年越しの実現（小ネタですらない）。
