Webフォントの利用

　Webフォントはローカル・デバイス（ＰＣ、スマートフォン、タブレット）ではなく、
　サーバーにインストールして使うフォント。
　基本的にはデバイスが何であれ、同じフォントで表示される。

　使ってみようと思いつつも読み込みに時間がかかって明らかに動作が重くなるので見送っていたが、近頃、Webフォントを利用しているサイトでもストレスを感じなくなっていることに気付いた。

　以前はWebフォントが全て読み込まれるまで文章が表示されなかった。
　今はいったんローカル・デバイスの標準フォント（システムフォント）で表示されてから、少しずつWebフォントに置き換わっていくようになった。

　スタイルシート　CSSの

@font-face{
}

の中に

font-display: swap

が記述されていれば、標準フォントからWebフォントへ置き換わっていく。

　CSSではなくlinkタグ指定の場合、

<link rel="stylesheet" href="https://～">

　hrefのURLに

&display=swap

が付いていれば、同様に置き換わっていく。

　当ブログで使っているCocoon（テーマ）の場合、
　ヒラギノ角ゴシック　Hiragino Kaku Gothic ProN、メイリオ　Meiryo
がデフォルトで、
　他に游ゴシック体　Yu Gothic、ＭＳＰゴシック　MS PGothicが標準フォント。
　　※　上記４フォント中、ヒラギノがApple標準、他３フォントがWindows標準
　Webフォントは、
　Noto Sans JP、Noto Serif JP
　M PLUS 1p、M PLUS Rounded 1c
　さわらびゴシック　Sawarabi Gothic、さわらび明朝　Sawarabi Mincho
　小杉ゴシック　Kosugi、小杉丸ゴシック　Kosugi Maru
の８フォント。

　これらのWebフォントは、無料で使えるGoogleフォント　Google Fonts（fonts.google.com/）。

　Googleフォントの日本語フォントは、近頃（といっても2018－2019年にかけて）、正式版（以前は早期アクセス版　Early Access）になり、上述の
　font-display: swap
指定の他、
　フォントファイル（日本語フォントは漢字を多く含むのでサイズが大きい）を分割して適宜読み込まれるようになった。

　また、Googleフォントでなくても、フォントファイルの必要な部分に限って読み込ませる「サブセット化」という手段もある。

　せっかくなので、当ブログもWebフォントを利用してみた。
　当ブログで使っているレンタルサーバー（さくらインターネット）は、モリサワ社のWebフォント（現在33種）も使えるので迷ったが、
　ひとまず手軽なところから、
　Cocoon設定　－　全体の「サイトフォント」で、小杉丸ゴシックを選択して様子見。
　太字が目立たないので、また変えるかも……。
　　※　「文字の太さ」を変えてみたが、表示は変わらなかった

　　追）ブログのページ表示速度のスコア改善のため、~~「もう１つのブログ」のみ利用~~。
　　　　利用断念。残念。

　－参考－