Fonts.com Web Fonts

2010年8月18日 11:44

昨日のエントリーで Google Font API を試した旨を書いたのですが、
Linotype、Monotype などの有名書体が参加しているサービス
「Fonts.com Web Fonts」が現在試験運用中で無料利用できるようなので試してみました。

http://webfonts.fonts.com/

本稼動した際は有償サービスとなるかもしれませんが、
とりあえず DIN が使いたかったのでお試しでやっています。

利用するにはトップページからサインアップします。
登録申請してから1日ぐらいで ID とパスワードが明記されたメールが届きます。
ログイン後、「Creat Project」というタイトルのページが表示され、
上記に表示されているタブを左から順番に登録していきます。

■Project
フォントの管理はプロジェクトごとに行います。
新規のプロジェクト名と利用するドメインを登録し、
[Save Project] をクリックします。

Fonts.com Web Fonts

■Choose fonts
利用するフォントを選択します。
ちなみに自分は迷わず「DIN Next Regular」を選択しました!

Fonts.com Web Fonts

■Work on style sheet
“Selectors” というフィールドにフォントを設定したいセレクターや
ID、クラスなどを設定し [Add selector] をクリックします。
下部にプルダウンが表示されるので、設定したセレクターに対してフォントを指定します。
[Save changes and update style sheet] をクリックします。

Fonts.com Web Fonts

■Publish
JS ファイルが発行されるので、これを BODY タグの直後にペーストで完了。

Fonts.com Web Fonts

ちゃんと設定できていれば、指定箇所にフォントが適用されます。
このブログではタイトル部分と、サイドバーの小見出しに
「DIN Next Regular」を適用させています。

カテゴリー: html/css others 

2 Comments

  1. おお、これは参考になる! 興味はあれど、ちゃんと試してなかったんですよ~。試験運用中のようですが、実際に多くのサイトで導入され、日本語でも使えるようになって欲しいですねぇ。

    コメント by 木本達朗 — 2010年8月21日 18:47

  2. Fonts.com ではわずかながら日本語フォントも登録されているようです。
    先週、Adobe Font も Typekit を通じてフォント配信されるというニュースがありましたし、これから Webfonts サービスのニーズも更に高まっていきそうですね。

    コメント by littlepad — 2010年8月23日 00:23

TrackBack URL

Leave a comment