sodeyama.s
デザインにこだわりたい、文字にこだわりたい、Webデザイナー必見。Webフォントに関するまとめサイトが散見しているのでNAVERまとめに集約します。個人的な探検ログも追記していきます。
CSS3のWebフォント機能では、サーバー上にあるフォントファイルを参照するため、ユーザーのPCにインストールされていないフォントを表示できるようになります。
適用方法も簡単で、使用したいフォントファイルをサーバーにアップロード、またはフォント提供してくれる第三者サーバにあるフォントへの絶対パスを、CSS3の@font-faceでフォントファイルを指定し読み込ませるだけで利用できます。
ちなみに、非対応ブラウザもあるのでは?と思う方に朗報、html5.jsというJavascriptを読み込ませることで、たいていのブラウザで標準化できるっぽいです。
▼欧文フォント
無料
Google様。
わかりやすさ、つかいやすさ、選びやすさ、No1です。
すべて無料。
Display beautiful fonts on your Web site with Fonts.com Web Fonts
フリープラン:$0
フォント数:7000以上!
Webフォントでは有名なサイト。
有料プランもあります。($10/30days、$100/30days)
ヘルベチカも使えるらしいです。
どんなライセンス契約結んでるんでしょうか。
Select and download from hundreds of free @font-face packages that you can drop into your web pages.
無料
フォント数:1500以上
ここもかなりの数です。
個人クリエーターが自作フォントをあげているのかな?
探せばユニークなフォントがたくさん見つかります。
Want a better way to buy fonts online? Pay one fee for your font and @font-face license. Use your font online or in print—it’s up to you. No subscription. No pageview limits.
$0〜$50(ファミリー揃えると$300くらいいっちゃう場合も)
フォント数:3000以上
個人に近い業者がフォントを売っているポータルECサイトといったものです。
@Font-Face Demoで大小サイズでの見え方を確認できます。
DL式売切り型なのでDTPにも使えます。
ゴシック系はきれいなフォントが多いかも。
フルティガーっぽい無料フォント見つけました。
▼和文フォント
Type Square とは? 価格 フォント 一覧 導入事例 よくある 質問 English –> ログイン ご利用 申込み News 2012/12/28 [導入事例] フェスティバル/トーキョー公式ウェブサイト 2012/11/29 [サポート情報] Internet Explorer 8でのフォント表示改善のお知らせ 2012/11/26 TypeSquareが2012年度グッドデザイ…
WEBフォントでリュウミンなどが使えるようになりました。
無料トライアル:1000PV/月
ほか、120万PV/年:16900円〜
デコもじでホームページが、ブログが、もっと楽しく、もっと個性的になる!デコもじサービスは無料でお試しいただけます!
個人向けライトプラン:315円/月〜
フォント数:約330種類
無料プランもありますが使えるフォントがかなり限られます。
和文フォントのWebフォントって貴重ですよね。
フォントプラスは、プロ向けのフォントが500書体以上使えるWebフォントサービスです。独自のサブセット化技術やAPIによりWebフォントを快適にご利用いただけます。
モリサワ、イワタ、フォントワークス、モトヤのフォントが使えるようになりました!
1年間12,600円〜
WebFonts として利用できるフリーの和文フォント 2010年5月10日 月曜日 WebFonts とは、ユーザーのローカル環境に左右されずに CSS でフォントを指定できるとても画期的な仕組みです。 WebFonts の demo を用意したので下記で WebFonts を実際にお試しできます。 WebFonts の demo (IE, Fx, Webkit, Opera で動作します) …
ヨモツネット様より。
Webフォントとして利用できるフリーの和文フォントをまとめていただいています。
WebフォントはOTFフォントなら何でも使えるので、
結局はライセンス的にOKか確認できればお手持ちのフォントも使えるという事になります。
タイププロジェクトは、書体開発を中心に文字を活かす事業を展開しています。機能性と独自性を核にした魅力ある書体づくりに挑む21世紀の文字カンパニーです。
試用版:無料
うっつくしいAxisフォント。
DL型フォントで、ライセンスは確認済み。
試用版は無料ですが4200文字入っているので十分です。
和文フォントの中に入っている英文フォントって、
そのまま使えないの多いですよね。
特に文字間が不揃いすぎてイィーーー!ってなったりします。
Axisフォントはほんとに和文・英文ともに、またセットで組んでも美しいです。
CSSのLetter-Spacingで文字間に余白なんか持たせちゃった入りすればオシャレ度UP間違いなしです。
タイポグラフィにこだわっている方にもお勧め。
▼アイコン系フォント
Studio Works Pushkarev pereulok, 5, Moscow, Russia +7 495 998-40-68,
[email protected] .glyph, .glyphbox div span {font-family: ‘WebSymbolsRegular’;} .preview div, .glyphbox div{ float:left;} .previe…
無料
例えば「A」をタイプするとクリップのアイコンに変えてくれる。
画像と違ってCSS3で拡大してもギザギザにならない!
この性質を利用して下記リンクのようなバナーアイコンを実現できちゃいます。
▶Creative CSS3 Animation Menus
http://tympanus.net/Tutorials/CreativeCSS3AnimationMenus/index.html
IcoMoon is a package of flat, vector icons along with a font generator. Using this font generator, you can make a custom icon font that has icons as its glyphs.
$30
412アイコン!
ここの買えばよかった・・・
412個もアイコンデザインよくでてくるなあ。
FreeTrialでも58個はいってます。
Pictos Font Server: Serving Custom Built Icon Fonts to Your Website. Also Hand Crafted, Infinitely Scalable & Royalty-Free Icons for User Interface Designers.
パーソナルプラン:$19/1年
なかなか質が高い。円高だから1500円か。安いな。
Typeface for interface designers
商用利用の場合有料:$25
かわいらしいアイコンがそろってます。
18pxまでの縮小が可能。
A set of scalable icons included as a webfont. Easy to use and released under MIT License.
無料
ドイツのサイトから。
けっこうスタイル出てますね♪
In a previous article, I addressed the many advantages of using a web font (in place of images) to render icons into your UI design. In the same article I
無料
こちらもドイツから。
Social Networking Icons in a handy font format
無料
ドイツラッシュです。
ソーシャル系アイコンです。
font colorを設定するとよりかわいくなるっぽいです。
https://matome.naver.jp/odai/2132880259264021001
2013年01月23日