easyfonts
1.0.0
Easy Fontsは、HTMLで<div classs="font-open-sans"></div>として使用するCSSクラスを提供します。これにより、プロジェクトでGoogleフォントを簡単に使用できます。 Easyフォントは、新しいフォントファミリを試すたびに、適切な手順を繰り返す必要がなくなるため、WebFonts 2ステップを簡単にします。
簡単なフォントを使用すると、単一の軽量CSSファイルを使用してプロジェクト内のすべてのフォントをインポートし、新しいフォントをインポートすることを心配することはできません。
Easy Fontsは、PageCDNがWebサイトをスピードアップするために使用するホストの統合技術を活用するために開発されました。最初の目標は、PageCDNを使用してコンテンツ配信に使用するWebサイトを許可して、同じCDNホストにフォントをオプションで配信して、Googleフォントが必要とする2つの追加のDNS検索を減らすことでした。その後、簡単なフォントは、迅速なプロトタイピングに非常に便利なライブラリであることが証明されました。そこで、このライブラリを自己ホストするか、fonts.google.comと組み合わせて使用することに興味がある人のためにGithubに移動しました。
Easy Fontsは、CSSクラスのコレクションを提供して、新しいフォントファミリをテストする必要があるたびにCSSを変更することを心配することなく、ウェブサイトをより速く構築するのに役立ちます。 Easy Fontsリファレンスを使用して、利用可能なすべてのフォントファミリと関連するCSSクラスについて学習します。
< link href =" https://pagecdn.io/lib/easyfonts/fonts.css " rel =" stylesheet " />
<!-- Or load specific font files
<link href="https://pagecdn.io/lib/easyfonts/open-sans.css" rel="stylesheet" />
<link href="https://pagecdn.io/lib/easyfonts/roboto.css" rel="stylesheet" />
-->
< div class =" font-roboto " >
< div class =" font-open-sans w600i " >
Stuff here appears in Open Sans, bold and italic
</ div >
< div class =" w600 " >
Stuff here appears in Roboto, bold
</ div >
< div >
Stuff here appears in Roboto and uses inherited weight and style
</ div >
</ div >
:) fonts.css使用している場合、ブラウザはHTMLで実際に使用するフォントファイルのみをダウンロードし、すべてのフォントをロードしてユーザーの帯域幅を無駄にしません。 fonts.cssファイル自体は、pagecdnからロードされた場合、わずか25 kbです。 PagecdnはBrotli：11圧縮を使用して、ファイルを非常にしっかりと圧縮して、許容できる制限内にサイズを保持します。
distディレクトリには、HTMLからリンクできる個々のフォントファミリーごとにCSSファイルが含まれています。ライブラリをダウンロードして、個々のフォントファミリで再生するか、CDNから直接CSSファイルにリンクできます。以下は、 open sansフォントファミリへのリンクです。他のフォントファミリの場合、便利な検索ツールがあります。
< link href =" https://pagecdn.io/lib/easyfonts/open-sans.css " rel =" stylesheet " />さまざまなフォントをすばやくテストするために、簡単なフォントを使用すると、すべてのフォントファミリを一度に簡単にインポートできます。このためには、 dist/fonts.cssファイルを使用するか、以下のCDNリンクを使用する必要があります。
< link href =" https://pagecdn.io/lib/easyfonts/fonts.css " rel =" stylesheet " />簡単なフォントとGoogleフォントを一緒に使用することができます。これがそれを行う方法です。
< link href =" https://fonts.googleapis.com/css2?family=Open+Sans:ital@0;1&display=swap " rel =" stylesheet " >
< link href =" https://pagecdn.io/lib/easyfonts/classes.css " rel =" stylesheet " />Easy Fontsは、個々のフォントファミリにJSON形式のフォント情報を提供します。これにより、テーマやウェブサイトビルダー向けのフォント選択インターフェイスを構築できます。 JSONはdist/info Directoryにあります。個々のフォントの情報をロードするか、フォントコレクション全体に包括的なJSONファイルを使用できます。
https://pagecdn.io/lib/easyfonts/info/fonts.json
https://pagecdn.io/lib/easyfonts/info/open-sans.json
dist/fonts内のTTFフォントファイルは、ライセンス情報を読むことができるGoogle Fonts Github RepoのTTFファイルの修正コピーです。個々のフォントファミリはdist/licenseで独自のライセンスファイルを持っています。関連するライセンスファイルは、ライセンス情報を簡単に表示するのに役立つすべてのCSSファイルからもリンクされます。
このリポジトリのCSSおよびJSONファイルは、フォントファイルのみから生成され、MITライセンスの対象となります。このリポジトリにリストされているフォントファミリーのライセンスの問題を知っている場合は、矛盾を解決できるように問題を開いてください。
