2017年2月1日その他
Googleで公開している。9種類の日本語WEBフォントを利用してみました。今の段階では試験的に提供しているようです。試しに、利用してみました。とりあえず、9種類全部のファイルを読み込んでいるので、このページだけ少々重くなっています。WEBフォントというと、過去にも利用したときに、とても読み込みに思いイメージがあり、あまり使うきになれませんでした。ただ、他の方のいくつかの記事で、読み込みスピードをもさぼと気にならないようなことを拝見しましたので、試してみました。やはり、文字によるインパクトは大きなものなので、文字がかわるだけで、サイトの見栄えがよくなったりと、かなりの視覚的効果が期待できるので、重くないのなら使用していこうと思いました。Googleでの貼り付けコードでは、CSSに直接リンクされていて、のぞいてみると、さらにいろいろ読み込まれています。自分が使う以外に不要だと思えるものは削って、使う部分だけコピーして、自分のCSSに貼り付けて利用すれば、多少は早くなると思います。
https://googlefonts.github.io/japanese/
M + 1p
1 | .wf-mplus 1 p{ font-family : "Mplus 1p" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
Rounded M +1C
1 | .wf-roundedmplus 1 c { font-family : "Rounded Mplus 1c" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
はんなり明朝
1 | .wf-hannari { font-family : "Hannari" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
こころ明朝
1 | .wf-kokoro { font-family : "Kokoro" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
さわらび明朝
1 | .wf-sawarabimincho { font-family : "Sawarabi Mincho" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
さわらびゴジック
1 | ..wf-sawarabigothic { font-family : "Sawarabi Gothic" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
ニコモジ
1 | .wf-nicomoji { font-family : "Nico Moji" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
ニクキュウ
1 | .wf-nikukyu { font-family : "Nikukyu" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG
Note Sans Japanese
1 | .wf-notosansjapanese { font-family : "Noto Sans Japanese" ; font-weight : 900 ; font-size : 30px ;}
|
日本語フォント
あいうえお
ABCDEFG