Web デザイナーなら押さえておきたいフリーフォントをダウンロードできるサイト６０選 | Web活メモ帳
デザインによって必要なフォントは毎回違いますよね。毎回買う事ができれば良いのですが、そういうわけにもいかないのでやっぱりフリーで配布しているサイトを探す事になります。 ただフリーの物を探す際にはかなりの時間がかかる場合もあるので、フラストレーションが溜まらないようにしたいですね。フォントに限らない話ですが、、 というわけで、無料でダウンロードできるサイトを60紹介している「60 Best Websites To Download Free Fonts 」というエントリーのご紹介。覚えておきたいですね。 詳しくは以下 dafont.com 公式サイト 1001freefonts.com 公式サイト urbanfonts.com 公式サイト fontstock.net 公式サイト fonts500.com 公式サイト gmkfreefonts.com 公式サイト getfreefonts.in
[CSS]IEを含めた主要ブラウザと各スマートフォンに対応した@font-faceの指定方法
IE6, 7, 8, 9をはじめとする主要ブラウザ、iOS, Androidのスマートフォンに対応させるための@font-faceの指定方法を紹介します。 The New Bulletproof @Font-Face Syntax [ad#ad-2] 各ブラウザ・スマートフォンに対応させる@font-faceの指定方法 各主要ブラウザ、スマートフォンに対応させる@font-faceの記述は、下記のようになります。 @font-face { font-family: 'MyFontFamily'; src: url('myfont-webfont.eot?') format('eot'), url('myfont-webfont.woff') format('woff'), url('myfont-webfont.ttf') format('truetype'), url('myfont-w
Webサイトの表示フォントとして「Meiryo UI」を使う
Windows Vistaが登場した当時、XPからの以降メリットのひとつとして「見やすい・読みやすい新フォント『メイリオ』が搭載された」というのがあった。残念ながらVistaは大して普及しないまま終わってしまったので「商売上の大きなウリ」にはならなかったようだけど、その後メイリオはXPでも公式に使用（ダウンロード）できるようになって、一部の企業サイトやブログで使用される程度には普及した。もちろん「フォントは優先順位を決めて複数の設定が可能」だったので、メイリオが入ってなくてもほとんど何の問題も起こらなかったのも大きかったはず。 Vistaの次のバージョンであるWindows 7には上記のメイリオに加え、さらに標準で「Meiryo UI」というものが追加された。これはメイリオの改良、あるいは派生バージョンのひとつで、MS曰く"特に表示領域の限られたところでの日本語テキストの表示に効果的です"
テキストを好きなフォントで表示できるJavaScript「cufon」
twitter facebook hatena google pocket 最近多くの英語サイトのソースで見られるJavaScriptにcufon.jsと言うのがあります。 これはJavaScriptを使用して、テキストを好きなフォントで表示できるものです。 Google Font APIが出ましたが、まだまだ数が少ないです。 こだわりのある方は、フォントを選択できるcufo'n - fonts for the peopleを使用するのも良いのではないでしょうか。 ※フリーフォントのみで・・ sponsors 使用方法 cufo'n - fonts for the peopleからcufon.jsをダウンロードします。 また、表示させたいフォントをjs化します。 今回は、1001 Free Fonts - Download Free Fonts for Windows and Macint
フォントサイズ変更機能（Cookie対応）│Web制作の現場から 〜入院、退院、そしてつまはじき〜
最近ではあって当たり前とも言うべきフォントサイズ変更ボタン。 やり方はいろいろあると思いますが、CSSファイルをたくさん用意したりしなくてもできる簡単な方法です。 jQueryとｊQuery.cookie.jsを使用します。 HTMLはjQueryとjQuery.cookie.js、そして外部スクリプトファイルです。 <script type="text/javascript" src="common/js/jquery.js"></script> <script type="text/javascript" src="common/js/jquery.cookie.js"></script> <script type="text/javascript" src="common/js/script.js"></script> 次にscript.jsです。 $(function(){ $('
フォントサイズを変える「大・中・小」ボタンを実装する方法
知り合いのデザイナーさんに、「大・中・小」のボタンでフォントサイズを変更する方法ってどうやるのですか？という質問をいただきました。 CSSとJavaScript（場合によってはJSのみ）で簡単にできてしまうので、サンプルをご紹介しておきます。 フォントサイズを変える「大・中・小」ボタン実装 jQueryを使ってフォントサイズを変える「大・中・小」ボタンをサクサクっと実装してみようと思います。 まずは仕様を考えてみましょう。 仕様 ・大・中・小のボタンをクリックするとフォントサイズが変更される ・それぞれのボタンにIDをセットしておき、そのID名をもとにclassをセット ・CSSにあらかじめ各class用のフォントサイズを入れておく ・再度訪れたとき、クッキー情報があればそのサイズ、なければ中サイズを。 スタイルシートごと変更する方法もあるのですが、今回はCSSとclassでセットで対応し
シンプル、ミニマルなサイトを作りたい時に役立ちそうなアイコンやフォント、ギャラリーなどのまとめ - かちびと.net
個人的にミニマリズムなサイトが 好みなので自分用の備忘録です。 情報が多いので若干まとめのまとめ という感じになっていますがご了承 下さい。シンプルなサイトを作る時に 役立ちそうなリソースやギャラリーを。 内容はシンプルなアイコン、インスピレーション向上に必須なギャラリー、相性の良さそうなフォントなどになります。 白黒のサイトを作りたいときに役立つもの、という記事と被りますがご了承下さい。 Iconic モノクロながら可愛らしい感じのアイコン103個セット。 Iconic picol 汎用性の高そうなアイコンセット。 picol Token 色々なところで紹介されてるアイコン。28万人中10万人はDLしてるみたいです。人気ですねー。 Token Brightmix icon set EPSファイルで配布されるアイコンセット。丸型にほぼ統一されてます。地球のアイコン凄いですね。。 Brigh
見出しやタイトルに使えるフォント20 – creamu
見出しなどに使えるフォントを探している。 そんなときにおすすめなのが、『Top 20 Free Fonts for Distinctive Headlines and Titles』。見出しやタイトルに使えるフォント集です。 商用でも使えるものも含まれていますね。 ↑はComfortaa。商用利用可 DuePuntoZero Spin Cycle Aldo かっこいいフォントがそろっているので、一度見てみてください。 Top 20 Free Fonts for Distinctive Headlines and Titles 会計士の友達にいろいろ聞きまくり。すごく勉強になるけど、難しいですね。 個人事業主だと、ある意味会社より経費等算出しにくい印象でややこしいので、外注にしようかと思ったりしています。んーここ数日は経理のことで頭いっぱいだ。
@fontface 以外で任意のフォントを使う方法 | Nutspress
@fontface を使って任意のフォントを表示させているサイトが増えてきましたが、@fontface 以外にも方法があるようで調べてみると色々見つかりました。アンチエイリアスありの状態で表示してくれるものや別サーバーから呼び出してくるウェブサービスなど、運用している環境で使い分けるといいですね。 sIFR（Scalable Inman Flash Replacement） Shaun Inman氏が世に広めた技術ということで、JavascriptでFlashムービーに置き換え出力させています。Shaun Inman氏のサイト（2007以前）で使われていました。アンチエイリアスがかかった状態で表示されるので見た目がとてもきれいです。 DEMO：sIFR 設定方法は『選択可能なアンチエイリアス文字を出力する『sIFR 2.0』導入メモ』や、『sIFRの設置方法』にてかなり詳しく解説されていま
CSS 基準文字サイズ（px）ごとの相対フォントサイズまとめ | バシャログ。
こんばんは、ishidaです。急に肌寒くなってきましたね。 弊社シーブレインは馬車道から目と鼻の先にありますが、その馬車道にて今年も恒例の馬車道まつりが開催されています。１１月１日（日）～１１月４日（水）まで開催されておりますので、馬車道付近にお越しの際は是非お立ち寄りくださいね。 それはさておき、フォントサイズを指定するときにまずはベースとなる基準のフォントサイズをbody等に指定しますが、サイトによって基準を12pxにしたり、13pxにしたり、たまぁ～に10pxにしたりしてます。 そうなってくると相対指定で20px相当って何％だっけ？ってことがよくあるのと、毎回毎回電卓をたたくのが面倒になったので、ここに基準としてよく使いそうなフォントサイズをメモします。 基準文字サイズ 10px 基準文字サイズ 11px 基準文字サイズ 12px 基準文字サイズ 13px 10px
Useful Cheat Sheets for Web Designers
President of WebFX. Bill has over 25 years of experience in the Internet marketing industry specializing in SEO, UX, information architecture, marketing automation and more. William’s background in scientific computing and education from Shippensburg and MIT provided the foundation for MarketingCloudFX and other key research and development projects at WebFX. Cheat sheets (also known as reference
文字サイズ変更 - Vosegus Sakura
下のボタンクリックでフォントサイズが変更されます。セットされたCSSの情報はCookieに保存され、リロードしても保持されます。 高速サイトを実現する14のルール 米Yahoo!のパフォーマンス担当責任者が導き出した「高速サイトを実現する14のルール」を実例とともに紹介します。サイトの高速化と聞くと、サーバ負荷分散などバックエンドで実施する大掛かりなパフォーマンスチューニングを思い浮かべますが、じつは待ち時間の80%はフロントエンドの処理に費やされています。ここで紹介する明解なルールに従いさえすれば、この時間を大幅に削減できるのです。定価 ¥ 1,890 JavaScript window.onload = function(){styleCtrl.addFSBtn.create("ctrl");} var styleCtrl = new Object; /************
EM Chart - Aloe Web Design Coupons
Using a relative unit such as EM is a great way to maintain the vertical rhythm of a web page when a user resizes text in their browser. Constantly reaching for a calculator to compute the correct EM value to use every time you need to is also a great way to drive yourself mad. Let’s say you have an H3 that’s 24 pixels. It doesn’t matter how the font-size is set (pixels, EMs, percentages, etc). Yo
HTML5ホームページテンプレート無料配布 [Cool Web Window]
404 Not Found お探しのファイルは見つからないようです。 お手数ですが、下記リンクからトップページへお戻りください。 CoolWebWindow Copyright (C) Cool Web Window All Rights Reserved
20 Awesome and Free Fonts for Web Designers (Serif Family) | TutorialFeed
If you are looking some awesome and exciting new fonts then your search ends here. In this post I'm sharing a bunch of some new and exciting fonts for web designers and desktop publishers (for printing). The following list covers most of Serif and Sans Serif family fonts like Serifan, Serifab, Serifat, Vaground, Bitstream Vera Serif, Stonsans, Bastardus Sans, Museo Sans, Ambrosia Demo etc. Serifan
フォントサイズを調整するJavaScript「fontScaler」
twitter facebook hatena google pocket フォントのサイズをユーザーが調整できるサイトは多いですが、大中小と制作者側で決めてしまってよいのでしょうか？ jQueryプラグイン「fontScaler」は+-でも調整が可能です。 sponsors 使用方法 fontScalerからファイル一式をダウンロードします。 <link rel="stylesheet" type="text/css" href="jquery.fontSizer.css" media="screen" /> <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.fontScaler.js"></script> <script ty
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blitz - ウェブクリエイタの人も，そうでない人も楽しめるデザインブログ
Adobe Fonts
IEにも対応！10分でできるWebフォント実装法 (1/3)
Blogger