WEBフォント(クラウドフォント)

読み :  ウェブフォント・クラウドフォント

WEBフォント(クラウドフォント)はサーバー上にあるフォントを読み込み、
閲覧するパソコンにインストールされていないフォントでも、
ブラウザ上で指定のフォントの表示を可能にするCSS3の機能。
特殊なフォントでもWEBフォントを利用することで表示が可能となる。

通常、CSSでフォントを指定しても、
閲覧するパソコンに指定のフォントがインストールされていないと別のフォントで表示されてしまう。
製作者が指定したフォントがインストールされていない場合、
閲覧するパソコンによってフォントが変わってしまう。

WEBフォントを利用することにより、
指定フォントがインストールされていないパソコンから閲覧する場合、
サーバーからフォントを読み込んで指定のフォントで表示させることができる。
Google Web Fonts」は無料で利用できる。
モリサワの「TypeSquare」は有料のクラウドフォントサービス。

以下の形式でフォントを指定する。

@font-face {
    font-family: "フォント名";
    url("フォントのURLを指定") format("フォント形式");
}

例:ミウラLiner-Jr

@font-face {
    font-family: "TypeSquare";
    url("/font/ミウラLiner-Jr") format("woff");
}