地味だけど強力なWebフォントのお話。まだ日本のWebデザインで普及してないから書いとく - bathtimefish's blog
今日SNSでつぶやいたネタを少し広げて書いておこうと思う。 Webフォントサービス「フォントプラス」を電通レイザーフィッシュが採用 興味深い採用事例。サイト運用コスト軽減のためWebフォントを使う。たしかに大規模なコーポレートサイトの場合効果があるかもしれない。結果が知りたいところ。 と言ったら、MJの例の人が「画像つくる手間なくなるのいいからウチでもつかってるよ。」的なレスくれたりして、なるほどなーと思った。 WebFont。CSS Font Module Level 3でCSSによる仕様がまとめられている。まあ日本ではまだ活用事例が少ない地味なHTML5関連の技術である。 すごく簡単に言うと、どんなフォントでも使えるようになるって機能。Web上にフォントを置いておいて、Webサイトを表示するときにそのフォントを使うことでコンピュータの中にないフォントでもWebサイトで利用できるというこ
画像の代わりに使えるアイコンタイプのWebフォントのまとめ
アイコン形式になったWebフォントを集めてみました。これだけ色々揃うと画像を使う場面も減ってくるかもしれませんね。 @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff') format('woff'), /* Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */ url('webfont.svg#svgFontName') format('svg'); /* Legacy i
フリーフォントやさしさゴシックボールドのダウンロード | フォントな
やさしさゴシックボールドはどんなフリーフォント？ フリーフォントのやさしさゴシックボールドは、自由にダウンロードし、商用・非商用問わず使用可能です。 やさしさゴシックレギュラーよりも太くタイトル、見出し向けのフォントになります。 このフリーフォントをご使用になるには、ダウンロードファイルに含まれる 「M+FONT-TESTFLIGHT」の内容を読みください。 It is requested to read and accept “M+FONT” before downloading Font. ページ最下段のフォントのダウンロードボタンを押してダウンロードして下さい。 ライセンス フォントは以下のライセンスに準じます。フォント同梱のテキストをお読み下さい。 * M+ (LICENSE_J,LICENSE_E) Copyright(c) 2012 M+ FONTS PROJECT ひらがな
[CSS]フォントのサイズ指定はpx？ em？ 既存の再検討とこれからのテクニック
フォントのサイズの単位に何を使ってますか？ px？ em？ それら2つのよく利用されるテクニックをおさらいし、さらに第3のテクニックも紹介します。 Font sizing with rem [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに pxを使ったサイズ指定 emを使ったサイズ指定 remを使ったサイズ指定 はじめに フォントのサイズの単位に何を使用するかは、未だに激しい議論の的となっています。それらのテクニックにはそれぞれ長所と短所があるのも現実です。 それらの中で短所が少なく、よく利用されるテクニックは2つあります。 pxを使ったサイズ指定 emを使ったサイズ指定 これら2つのテクニックを再検討し、さらにもう3つ目のテクニックを紹介します。 pxを使ったサイズ指定 ウェブの初期に、私たちはテキストのサイズを定めるために「px」を使用していました。これは一貫しており
[Webデザイン]カーニングの件もっと | chihosh blog
先日、このブログのエントリーを見て衝撃をうけたよ！ ⇒ [Webデザイン] 文字組みについて本気出して考えてみた 正確にはこのエントリーについているはてブコメントに衝撃を受けたよ！ 「これは参考になる」とか書いてあるよ！ これって基本中の基本だと思っていたよ！ 私は紙の経験はほとんど無いけど、ウェブデザインの仕事は10年以上になるので 世の中の文字詰めの甘いサイト（やポスター）のことは同じく気になっていたよ!! 東横線の中刷りの東急のポスターとかひどいよね！ あと運用していくうちにカーニングぐちゃぐちゃになってるサイトとかね！ ということで、上のエントリーに書かれていないことで、 カーニングの基本と思われることを書いてみるよ！ 音引きは横85%、小さい「ャ」は縦横85%、「・」は縦横50%＋ベースライン調整 漢字の「一」と音引きの「ー」が似ているため。 ぱっと見で音引きとわかるように横幅を
![[Webデザイン]カーニングの件もっと | chihosh blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/2a01e1629306ca9cf40722f445a3870ff46e172e/height=288;version=1;width=512/https%3A%2F%2Fpds.exblog.jp%2Fpds%2F1%2F201102%2F17%2F53%2Fa0144753_17402048.jpg)
[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary
これはもう何年も前から気になってることなのですが。 何故、昔からずっと見出し画像などの文字組みや文字詰めの甘いWebサイトが多いのでしょうか。 私はデザインについて偉そうに言える立場でないのは分かっていますが、折角全体的なデザインや背景、写真、Flashなどの動きはとても美しく、文章構成のしっかりしたサイトなのに、ただ一点文字詰めだけが甘いというサイトがあまりにも多くて、そういうサイトが減る様子もないのがずっと気になっています。 私は以前、ファッション雑誌やビジネス誌の組版（MacのInDesignやQuarkXPressを使って印刷用のデータを作る仕事。DTPとも言う）の仕事をしていて、見出しは言うまでもなく、本文の文字詰めが少し甘いだけでもものすごく怒られたものですが、Webデザインの世界ではそういうのはあまり怒られることがないのでしょうか。 私は、見出しやタイトル画像における文字組み
![[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary](https://cdn-ak-scissors.b.st-hatena.com/image/square/e6e22153e1233d79c8da8733fc112f935fe5ee4a/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fstocker.jp%2Fdiary%2Fwp-content%2Fuploads%2Ftypographic-1-1.png%3Ffit%3D500%252C250%26ssl%3D1)
グーグル、「Google Font Directory」と「Google Font API」を公開
ウェブ上の単調なタイポグラフィの改善を目指すGoogleは米国時間5月19日、無料で利用できる18種類のフォントと、ダウンロードされたフォントを表示する際のブラウザの問題を解決するオープンソースツールを公開した。 多くのウェブデザイナー（全ての読者ではないにしても）は、最近のブラウザがダウンロードフォントをサポートしており、ユーザーのコンピュータに既にインストール済みと見なして問題のなさそうな数種類のフォント以外のものをサイトが使用できるということに、喜びを感じている。グランジフォントやComic Sansを活用して、芸術的なロゴや個性的なテキストがたくさん作られている。 しかし、フォントのライセンスの問題のため、ウェブデザイナーは必ずしもサイト用にフォントを自由にアップロードできるわけではない。この問題を解決するのが、Googleが今回、Google I/Oカンファレンスで発表した無料フ
「fonthack.jp | フリーで使える日本語フォント」に使われている日本語フリーフォントをまとめてみた（漢字も使える）：ekakou:絵描校 - 絵の描き方講座
（フリーで使える日本語フォント） 好きな文章を入れて日本語フォントを試せる「fonthack.jp」 本日紹介するのはこのサービス....ではなく、このサイトで使用されている日本語フォントをまとめてみました。 詳しくは以下から、 Y.OzFonｔシリーズ F910ゴシックW3-IPA（無料） F910明朝W3-IPA（無料） KesaranPasaranKT qoocRomanKT SampomichiHR Tokage-no-ShippoHR TowerGothicKT 出島明朝フォント みかちゃん ホリデイＭＤＪＰ えるまー M+ と IPAフォントの合成フォント M+ IPAフォント 梅フォント さわらびフォント さざなみフォント 戸越フォント VLフォント GLアンチック GL築地5号 白舟教育漢字 怨霊 ルイカ あられ アニト キャパニト セプテンバー ゆたぽん（コーディング）
美しいフリーフォント45セット:phpspot開発日誌
45 Beautiful Free Fonts for Modern Design Trends - Six Revisions 美しいフリーフォント45セットが紹介されています。 ロゴデザインなんかに使ってもまったく問題なさそうです。 Cicle Share Reznor Broken Alte Haas Grotesk Abrosia AUdimat 全部見る フォントのインストールのしすぎは注意が必要ですが、これは、というお気に入りのフォントがあったら入れておきたいですね。 関連エントリ 萌え系フォントのまとめ ウェブ、ＤＴＰに使えるクールなフォント集 フリーフォント大量配布/紹介サイトいろいろ フリーフォントを入手するためのトップ５サイト 女性の書いたようなやわらかい萌えフォント「あんずもじ」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Windows 8 で改善してほしいフォントと日本語テキスト表示の問題
国内のWeb制作に役立ちそうな無料の写真素材やフォント、Webデザインギャラリー等のリソースサイトいろいろ・2011
IEにも対応！10分でできるWebフォント実装法 (1/3)
IDEA * IDEA