2011.10.19 Wednesday - 11:02
Webフォントをプレビューできるサイトまとめ
Web Designing 2011年11月号にてWebフォントをプレビューできるサイトを紹介しましたが、この他にもまだたくさんあるので改めて紹介します。情報は今後も随時追加していきます。
・・・・・
Webフォントサービスが提供するプレビューサイトです。任意のURLを入力するだけで、自社で取り扱うフォントがどのように表示されるのかを確認できるプロモーション用サイトです。
Web Fonts Preview (by Fonts.com Web Fonts)
http://www.webfontspreview.com/
任意のURLを入力するだけで、WebフォントサービスFonts.com Web Fontsで提供されているWebフォントを表示することができるサイト。見出しと本文用のフォントをライブラリから選択できるだけでなく、サイズ、行間、文字間も調整することができます。
Font Swapper (by Webtype)
http://www.webtype.com/tools/swapper/
任意のURLを入力するだけで、WebフォントサービスWebtypeで提供されているWebフォントを表示することができるサイト。見出しと本文用のフォントをライブラリから選択できるだけでなく、サイズ、行間、文字間も調整することができます。
FontFont FontFonter (by FontFont)
任意のURLを入力するだけで、オンラインフォントストアFontShop (FontFont)で提供されているWeb用フォントを表示することができるサイト。専用のJavascriptブックマークレットを登録しておけば、いつでもお気に入りから呼び出すことができます。
FontDropper 1000 (by WebINK)
http://www.extensis.com/en/WebINK/fontdropper/
用意されているJavascriptブックマークレットを登録しておけば、WebフォントサービスWebINKで提供されているWeb用フォント一覧を表示することができるサイト。ドラッグ&ドロップでフォントを変更できるというユニークなUI。
Web Fonts in Action (by FontsLive)
http://www.fontslive.com/preview/
WebフォントサービスFontsLiveで提供されているWeb用フォント一覧を表示することができるサイト。Monotype Imaging系列なので、Fonts.com Web Fontsのほうと仕組みは同じ?
・・・・・
Font Dragr
ドラッグ&ドロップするだけで、ローカル上のデスクトップフォントをWebフォントとして適用することができるJavascriptブックマークレット。OTF、TTF、WOFF形式のみ対応。
・・・・・
番外編。OSやブラウザ別にWebフォントのレンダリングを確認することができるサイトです。Macは比較的きれいですが、Windowsはちょっと汚いですね。
Typekit Browser Samples
WebフォントサービスのTypekitには現在プレビューツールは用意されていませんが、各書体、OSやブラウザ別にWebフォントのレンダリングを確認することができます。
MyFonts Webfont browser screenshots
オンラインフォントストアMy Fontsでは、フォントのサンプル表示画面で“Webfont browser screenshots”にチェックを入れると、各書体、OSやブラウザ別にWebフォントのレンダリングを確認し、なおかつ2つ並べて比較することができます。
こちらの記事も合わせてどうぞ
- 海外のWebフォントサービスまとめ【2015年11月版】
- Webフォント (Webfonts) 2011年6月のニュース
- 有名書体も使える! 必要な分だけ購入し自分で設置できる MyFonts Webフォント完全ガイド(日本語)
- Webフォントを使ったサイトのデザインを競うWeb Font Awardsが今年も開催
- Web Designing 2011年12月号にて、「Webフォントを使いこなすためのコツと注意点」の記事を執筆しました
- FontFontのWebフォントを体験できるFontFonter
- ついにウェブでも有名書体が使える!Webフォントサービス Fonts.com Web Fonts β版が運用開始