2012 . 07 . 17
Awesome Fontstacks : コーディネートされたWebフォントのバンドルを作れるサイト
Awesome Fontstacksは異なるWebフォントから相性のいいものを一つのバンドルとしてパッケージング化し、それらを公開・共有しているサイト。
ダウンロード可能なWebフォントの中から見出し用・本文テキスト用・装飾用・等幅フォントの4種類のフォントを選び出し、それらがベストマッチするような組み合わせを提供するというものです。
バンドルを作るには、はじめは見出し用のフォントからチョイスしていき次に本文用と、ステップバイステップで自分の好きなフォントをチョイスしていきます。
見出しフォントを選ぶとそれに合うような本文用フォントが提示されていくという、マッチングエンジンが組み込まれているところが最大の特徴です。
また、自分で作成しなくてもすでに多くのユーザーによって作成されたバンドルが公開されているので、それを直接選んで使ってもいいでしょう。
実際に利用するには、ダウンロードリンクよりWebフォントを配布しているサイトから個別にフォントをダウンロードし適宜サーバーにアップロードしておきます。
Webフォント用のCSSコードが自動的に生成されるので、必要に応じパスなどを書き換えてからWebページに適用するだけです。
代替フォントの指定や相対的なサイズ合わせなどもあらかじめされており、各フォントは『.afs-(フォント名)』というクラス名で定義されているのでそのクラス名を使ってスタイルを適用することが可能です。
- 不必要な記述もあるので、まるごとペーストするよりは目的に合わせてコード内の必要な部分だけ参照して使った方が無難かもしれません。
最近ではWebフォントとして利用できるフォントがたくさんあって、一つだけを探すならば自分の感性を頼りに好みで選ぶこともできますが、統一的なセットを作るとなるとそこにはちょっとしたセンスが要求されもの。
こんな時に頼りになる便利なサイトです。
Awesome Fontstacks
