Google Web Fontsの使い方

Google Web Fontsの導入が超絶かんたんだったので、導入までの流れをご紹介します。

WebFontとは

通常は見ている人のパソコンに入っているフォントしか使うことはできません。しかし、WebFontを使えば、見ている人のパソコンの中にフォントが入っていなくても、好きなフォントを使うことができます。これはフォント自体をサーバー上に置いておくことで、これを実現しています。

Google Web Fontsでは無料で使える英語フォントが700件近く登録されています。ここで好きなフォントを探して、Webサイトで使うことができます。ちなみに、英語に比べて日本語は漢字やカタカナなど、データ量が圧倒的に多いため、まだ実用的ではありません。

これから、Retinaディスプレイなど、スマートフォンにかぎらず高精細なディスプレイが増えていけば、今までの画像テキストはぼやけてしまうほか、複数の解像度の画像を準備する手間が増えます。そんなこともあって、こういったWebフォントを活用する場面が増えていくと思います。テキストならいくら拡大しても綺麗なままですので、使い勝手もいいですよね。

Google Web Fontsの使い方

Google Web Fontsを開きます

好きなフォントがあれば、Quick-useボタンを押してみてください。

タグをコピー

表示されているCSS読み込みのタグをコピーして、使いたいページで読み込ませます。あとは好きな場所でfont-familyでフォントを指定すれば使えます。

変更もしやすいですし、おすすめです。

Google Web Fonts

[sc name=”engeneer”]

SHARE

• Tweet

PROFILE

入江 慎吾
Webサービスを作るのが大好きです。制作会社10年→フリーランス→受託をやめサービス開発に専念。プログラミングのメンターサービスMENTAは月間流通額約1,300万を突破🚀 YouTubeでは個人開発について語ってます / 「自分のサービスで生きていく」をコンセプトに個人開発オンラインサロン「入江開発室」を運営（詳しいプロフィール）