ブログの基本フォントが簡単に設定できる!でもどんなフォントなの?[Coccon設定]

スポンサーリンク
ブログの基本フォントが簡単に設定できる!でもどんなフォントなの?ントなの? Wordpress
この記事は約5分で読めます。

WorpPressのテーマにCocoonを使っている海里です。
Cocoonは神と崇めているほどの信者です(笑)

いつもの言葉ですが、無料なのにスゲーの一言。

テーマでお悩みの方はぜひCocoonを使ってみてください。
※金銭授受はございません(笑)

設定でお悩みの方は当ブログComabloをご利用ください(←宣伝w)

前置きはこのぐらいにして、
この記事ではCocoonでサイト全体のフォントを設定する方法をご説明します。

スポンサーリンク

ブログ全体のフォント設定の方法

WorpPress管理画面「Cocoon設定」-「全体」

Cocoon設定ページ「全体」タブクリック

Cocoon設定ページ内「全体」タブ内 「サイトフォント」-「フォント」
ここをクリックするとブルダウンでフォント名が表示されます。

Cocoonで設定できるフォントは11種類

現在Cocconで設定できるフォントは内蔵フォントとWEBフォントを合わせて11種類あります。
(Coccon バージョン1.9.8)

フォントの名前を見てもどんな形をしているんだ??」と思われる方も多いかと思います。

一つずつ設定を変えて保存すれば確認できるのですが、面倒なので一覧にしてみました。

Cocconで設定できるフォント一覧

内蔵フォント

内蔵フォントとは閲覧者のパソコンにインストールされているフォントを利用して表示する方法です。

Cocoonでは下記の3パターンで表示設定ができます。

左側にある「游ゴシック」「メイリオ」「MS P ゴシック」はWindowsに標準でインストールされているフォント。

右側は「ヒラギノ角ゴ」はMacに標準インストールされているフォント。
※ヒラギノ角ゴを持ち合わせていないので類似フォントと言われている「Note Sans JP」を使用しています。

Cocoonで何も設定をしていない場合は「游ゴシック・ヒラギノ角ゴ」になっているはずです。

なぜMacでは「ヒラギノ角ゴ」のみの設定なのか

Macは確かずっと「ヒラギノ角ゴ」を標準フォントとしているので一択。
対してWindowsは「MS P ゴシック」→「メイリオ」→「游ゴシック」という変遷があります。

Cocoon製作者様に確認を取ったわけではないので本当の理由は定かではありませんが、おそらくOSで標準利用されているフォント(システムフォント)を選ばれたのではないかと思っています。

WEBフォント

WEBフォントとは、WEBサーバからフォントを読み込んで表示する方法です。

Cocoonでは下記の8パターンで表示設定ができます。

  • Note Sans JP
    いろはにほへと ちりぬるを 色は匂へど 散りぬるを abcde ABCDEF
  • Note Serif JP
    いろはにほへと ちりぬるを 色は匂へど 散りぬるを abcde ABCDEF
  • Mpulus 1p
    いろはにほへと ちりぬるを 色は匂へど 散りぬるを

WEBフォントは表示速度が遅くなる?

表示が遅くなることもあります。

しかし、Cocoonで使用しているWEBフォントはGoogleが提供しているWEBフォント(Google Fonts)です。

Google Fontsはできるだけ早く表示する技術を採用しているため、閲覧者がストレスを感じるほど表示速度が遅くなることはありません。

詳細をご覧になりたい方は下記をご参照ください。
と、言っても英語なので私もさっぱり読めません。

おすすめのCocoonで設定できるフォント

ぶっちゃけ好みです。

これ言ってしまったら元も子もないですよね。

内蔵フォントのおすすめ

「メイリオ・ヒラギノ角ゴ」です。

「游ゴシック」は線が細すぎて若干読みづらいと感じます。
「MS P ゴシック」は細いカクカクした文字になるので、昔のブログ感が出てしまってちょっとダサく見えてしまいます。

WEBフォントのおすすめ

「 Mpulus 1p 」「 Rounded Mplus 1c 」はパソコンのモニターで見るとギザギザしてるのであまりお勧めしません。

短い文章でさえ読みにくいので、長文になると読むのイヤになります。

フォントサイズを21pxぐらいにするとキレイに表示しますが、逆に文章を21pxで表示するとそれはそれで大きすぎて読みにくいです。

「 Note Sans JP 」「 Note Serif JP 」「 小杉ゴシック 」「 小杉丸ゴシック 」
WEBフォントはこの4種がお勧め。

「 さわらびゴシック 」「 さわらび明朝 」は他のフォントに比べると一回りほど小さいので、フォントサイズを2pxほど上げれば上記で上げた4種と変わらないので使用してもいいですね。

ご参考までに

このブログでは「メイリオ・ ヒラギノ角ゴ 」を使っています。
フォントサイズは17px

まとめ:ブログの基本となるフォントが簡単に設定できる!でもどんなフォントなの?

  • ブログ全体のフォントは「Cocoon設定」-「全体タブ」-「サイトフォント」で変更可能
  • Cocoonで設定できるフォントは11種類
  • WEBフォントでも表示速度は気にならない
  • お勧めフォントは「メイリオ・ヒラギノ角ゴ」「 Note Sans JP 」「 Note Serif JP 」「 小杉ゴシック 」「 小杉丸ゴシック 」
  • 「 さわらびゴシック 」「 さわらび明朝 」 を使うならフォントサイズを2px大きくした方がいいかも
  • 最終的にフォントは好み。

コメント

タイトルとURLをコピーしました