久しぶりにレンタルサーバーのコントロールパネルへログインしたらさくらのレンタルサーバーで動いている WordPress ならモリサワの Web フォントが無料で使えるというニュースが表示されてました。
っても「簡単インストール」した WordPress だけ、とかって話でしょ?でもモリサワの Web フォントが無料で使えるなら入れ替えちゃってもいいかも?とか思いながらリリースをちゃんと読むと、プラグインで提供なので既存のインストール済み WordPress にも適用されるらしくてビックリ。ごらんのとおり、早速使ってみてます。
モリサワとさくらインターネットが協業し、無料でのWebフォント導入を実現
条件としてはさくらのレンタルサーバー(スタンダード以上)またはマネージドサーバー、ドメイン1個、月間2.5万/年間30万PVまで、使える書体は30書体から選択、となっています。PV はざっと計算して毎日 750 ぐらいがラインになりそうです。
ちなみに TypeSquare (モリサワのWebフォントが使えるサービス)だと無料の場合 PV は月間1万、使える書体は1書体なので、ずいぶんオトクな感じです。
価格 | Webフォント TypeSquare [タイプスクウェア]
使い方は、まずサーバーのコントロールパネルで Web フォントを適用するドメインを選択します。その後プラグインを検索→インストールします。どっちが先でもいいんですが、ドメインの選択を忘れないようにします。
プラグインがインストールされたら、管理画面のメニューに TypeSquare Webfonts という項目があるので、お好みのフォントテーマを適用すればOKです。
フォントテーマ?という感じですが、ざっくり言うとタイトル、本文、リード(見出し?)、太字、の4つについてのフォント指定をセットしたものです。最初からいくつかの組み合わせが用意されていますが、自分でも 16 個まで作ることが出来ます。
仕組みとしては適用する項目に対してのフォント指定をスタイルとしてヘッダーへ書き出す形になります。
適用する項目はタグとクラスで指定され、自分で指定も出来ますが、h タグと the_ID とか post_class() をテーマに設定していればすんなり適用されます。
ただ、Windows だとフォント表示が汚いです。ギザギザ。
というわけでちょっと回転させます。
transform: rotate(0.001deg);
Webフォントを滑らかに表示させるCSS 2016年版 IE 11/Edge/Chrome/Firefox(Windows)
レンダリングに負荷がかかりそうですが、Webフォントを使おうって時点でレスポンスなんてものは窓から投げ捨ててるはず、なので突き進みましょう。
フォントテーマで指定できない部分にも適用させたい場合は自分で CSS を書いちゃえばいいんじゃないかなぁ。試してないけど。
あと、プラグインにちょっとイヤンなところがあったのですが、それはたぶんすぐ修正されるだろうから、別記事にします。