webフォントというものをご存知でしょうか。
通常webページで文字を表示させるには、閲覧しているデバイス（PC、タブレット、スマートフォン等）にインストールされたフォントが使用されます。これに対しwebフォントが設定されたサイトではサーバーで用意されたフォントを使用して表示させます。
これにより、ユーザー側の環境に依存することなく、制作者が意図したデザインが提供できるというわけです。
主なwebフォント
現在提供されている主要なwebフォントは以下になります。
Google Fonts
Googleが提供しているオープンソースのフォントです。全てのフォントが無料で使用できます。現在試験的に日本語フォントが公開されており、2017年7月の時点で9種類用意されています。読み込み速度が速いのもポイントです。
Adobe Typekits
Adobeが提供するwebフォントです。日本語フォントは新ゴ／新丸ゴ／リュウミンなどのモリサワフォントを含む35種類（2017年7月の時点）用意されています。Adobe Creative Cloudに契約しているユーザーであれば無償で使用することができます。
Typesquare
こちらはモリサワが提供するwebフォントです。2017年7月の時点で日本語フォントは695種類が用意されています。1書体／1ドメイン／月間PV1万以下の制約下での無料使用が可能なほか、モリサワパスポートに契約していれば全書体／ドメイン無制限で使用できます。typesquareのサイト（http://typesquare.com/about_tryout/）からトライアウトも可能。
FontPlus
Fontworksが提供するwebフォントサービスで、フォントワークス、モリサワ、イワタ、モトヤ、白舟書体といった、800を超える日本語フォントが利用可能です。無料会員登録で最大5,000PV／6ヶ月までの無料使用も可。2種類のカーニング機能を備えており、シンプルな設定で文字詰めの調整が行えます。有料プランは月額1,080円〜。
実際にwebフォントを使ってみましょう！
上記のwebフォントうち無料で利用でき、なおかつ設定も簡単な「Google Fonts」を実際に導入する手順を紹介していきます。
1.Google Fontsの日本語用サイト（現在は早期アクセスサイトhttps://googlefonts.github.io/japanese/）へアクセスします。
2.使用したいフォントがサンプルで表示されているエリアまでスクロールします。
（ここでは例として「さわらび明朝」を利用します。）
3.ページ右エリア下部にあるCSS読み込みコードをhtmlにコピー＆ペースト。フォントを適応させたい箇所に”font-family: “Sawarabi Mincho”;”を設定。
HTML（head内）
<link href="https://fonts.googleapis.com/earlyaccess/sawarabimincho.css" rel="stylesheet" />
HTML（body内）
<p class="sawrabi">さわらび明朝表示サンプルです。</p>
CSS（class名は任意）
.sawrabi { font-family: "Sawarabi Mincho"; }
4.これで完成です。たったこれだけ！
表示サンプル
さわらび明朝表示サンプルです。
このように少ない手順での導入が可能ですので、ぜひ一度試してみてはいかがでしょうか。
今回はgoogle Fontsの導入方法のみの紹介でしたが、後日他のフォントの導入方法も紹介したいと思います。