Simplicityでウェブフォント「Google Fonts + 日本語 」を使ってみた!

danfador / Pixabay

こんにちは bibaです。
先月、ブログの内容を見直すことにしたのですが、やはり更新できない状況に陥ってしまいました。

文末表現の仕方も変えてみたのですが、これも「です・ます」調に戻すことにしました。理由は特にありません。なんとなく、そんな気分だったので・・・

スポンサーリンク

ウェブフォントGoogle Fonts+日本語

さて、そんな気分に流されて、今回はブログのフォントを「Rounded M+ 1c」に変更してみました。

気付きましたか?

Google Fonts+日本語 早期アクセスで提供されているウェブフォントです。

その存在を知ったきっかけは、これもお試しで使って見た、WordPressテーマ「Luxeritas」でした。

実は、WordPressテーマ「Luxeritas」では簡単にウェブフォントが使えるようになっており、このフォントの選択が簡単にできるようになっていたのです。

そこで使ってみて、気に入ってしまったというわけです。

スポンサーリンク

Rounded M+ 1c

「Rounded M+ 1c」という日本語ウェブフォント。

Google Fonts+日本語 早期アクセスのサイトでは「明るく伸びやかなデザインを心がけた」フォントとして紹介されています。

丸みをおびた少し太めの文字なので、とても読みやすい感じがします。

好みのフォントだったので、私はこれを選択しました。

Google Fonts+日本語 早期アクセスでは、ほかにも8種類のウェブフォントが提供されています。漢字やひらがなが使えないフォントもあるため、漢字・ひらがな・カタカナのどれでも使えるのは全部で5種類ですが・・・

Google Fonts + 日本語 早期アクセス • Google Fonts + Japanese Early Access
As Google makes progress on supporting Japanese web typography, we invite designers and developers to experiment with these Japanese web fonts now available fro...
スポンサーリンク

導入方法(Simplicityの場合)

自分のWordPressサイトでGoogle Fonts + 日本語を導入する手順は次のとおりです。

    • Google Fonts + 日本語のページで、使用したいフォントを選ぶ。
    • <link href~ から始まる1行をコピーし、header-insert.php内に貼り付ける。
      *これはSimplicityを使っている場合。一般的には<head>タグ内に貼り付ける*
    • Google Fonts + 日本語のページで.wf-roundedmplus1c { font-family: “Rounded Mplus 1c”; }の{ }内をコピーし、style.css内に貼り付ける。
    • 貼り付けた{ }内、つまりfont-family: “Rounded Mplus 1c”; をbodyで囲む。

まとめ

Google Fonts+日本語を導入した結果、ブログの雰囲気も少し変わり、個人的には満足しています。

現時点でGoogle Fonts+日本語は完全にはサポートしていないフォントの試験的な提供という段階です。今後、どうなるかはわかりませんが、端末が持つフォントに依存しない表示ができるウェブフォントを無料でお試しできるのはありがたいことです。

皆さんもお試ししてはいかがでしょう・・・