toggle
Sep 4, 2014

あいこウェブフォントのCSS設定 Aiko-web font

aikowebfontウェブフォント

Aiko-webフォントをウェブフォントとして使う方法
1.サブセット化
日本語フォントは、ひらがな・カタカナ・漢字が含まれるため、ファイル容量が大きくなり読み込みに時間がかかります。読み込み時間の短縮にはサブセット化が必要です。簡単に言えば、使用する文字だけを抜き出したフォントファイルを作成することです。当フォントはこれが、すでに行われており、何もする必要がありません。

2.CSSの指定
まずCSS3の@font-faceでフォントファイルを指定する必要があります。
@font-faceを使ってフォントファイル名とフォントファイルへのパスを指定します。
パスはアップロードするディレクトリのパスなので、各々異なります。
代表的な記述だと以下の様になります。

@font-face {
font-family: ‘Aiko-web’;
src: url(‘パス/Aiko-web.eot’);
src: url(‘パス/Aiko-web.eot?#iefix’) format(‘embedded-opentype’),
url(‘パス/Aiko-web.woff’) format(‘woff’),
url(‘パス/Aiko-web.ttf’) format(‘truetype’);
}

次にCSSでフォントを適応させます。

Comment





Comment



CAPTCHA


関連記事

最新記事