【ブログ便利機能】ブログやサイトの使用フォントを簡単に調べる方法
こんにちは。40代双子持ちサラリーマンです。
今回は、気になるブログやサイトの使用フォントを簡単に調べる方法を紹介します。
紹介するにあたり、ブラウザ「Google Chrome」の拡張機能を使用するため、「Google Chrome」を事前にインストールすることをオススメします。
「WhatFont」とは
「WhatFont」とは、Chromeの拡張機能の1つで、ブログやサイトで使用している文字フォントなどのフォント情報を簡単に調べることができる機能です。
この機能を使用すると、どんなことができるようになるんですか？
自分が気になったブログやサイトのフォント情報を知ることができるため、その情報をCSSに反映することにより、まねることができたりします。
それは便利ですね。早く使ってみたいです☺
「WhatFont」のインストール方法
Chromeへの「WhatFont」のインストール方法を紹介します。
- chrome ウェブストアの拡張機能「WhatFont」にアクセス
- アクセスすると以下のような画面表示後、【Chromeに追加】ボタンをクリックする
- ポップアップ画面（下記画面参照）が表示後、【拡張機能を追加】ボタンをクリックする
- 拡張機能が追加されると、URL入力の右横にWhatFontアイコン（赤枠）が追加される。
その際、ポップアップ画面（下記画面参照）が表示されます。
「WhatFont」の使い方
「WhatFont」の使用方法を紹介します。
-
WhatFontアイコンをクリックし、【Exit WhatFont】ボタンが表示されることを確認する。
-
「事前に探した文字フォントが気になるサイト」の文字の上にマウスをもっていくと、その文字フォントが表示される。
※今回は、YAHOO! JAPANの【Y】の部分にマウスをあてて、【MS PGothic】が表示されています。
-
さらに、【MS PGothic】の部分をクリックすると、詳細な情報が表示されます。
具体的には以下のような情報を取得できます。
WhatFontで取得できる情報
- フォントの種類：Family
- フォントのスタイル（標準・イタリック体・斜体）：Style
- フォントの太さ：Weight
- フォントのサイズ：Size
- 行間：Line Height
- フォントのカラーコード：Color
「WhatFont」の削除方法
chromeからの「WhatFont」削除方法を紹介します。
- chrome ウェブストアの拡張機能「WhatFont」にアクセス
- アクセスすると以下のような画面表示後、【Chromeから削除します】ボタンをクリックする
「WhatFont」の対応ブラウザ
Chrome以外のブラウザでの「WatFont」使用方法に関しては、下記サイトに載っているので、参照してみてください。
以下のブラウザに対応しているようです。
Chrome以外の対応ブラウザ
- Firefox 3.6以降
- Safari 4以降
- Internet Explorer 9
- Internet Explorer 8
「WhatFont」まとめ
「WhatFont」を有効活用することにより、ブログを見やすくするためにかかせない、フォント選びを効率的にできるようになります。
ぜひ、ブログを見やすくするための一つの手段として、この拡張機能を有効活用していただけたらと思います。
