[B! kerning] akira_maruのブックマーク

ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

akira_maru 2015/09/28

リンク

jquery.kerning.js

jQuery.Kerning.js A jquery plugin which adjust text kerning in HTML. Get Source Demo うつくし明朝 - plain ポラーノの広場あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎらひかる草の波。うつくし明朝 - kerned ポラーノの広場あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎらひかる草の波。 M+ 2m Regular - plain ポラーノの広場あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎらひかる草の波。 M+ 2m Regular - kerned ポラーノの広場あのイーハトーヴォ

akira_maru 2014/03/07

リンク

ワンランク上のデザインにはかかせないPhotoshopの文字詰め「カーニング・トラッキング」のまとめ

こんにちは。今日も元気にPhotoshopと戯れます井畑です。今回はPhotoshopの文字詰めに使うツールについてちゃんと調べてみました。今では息をするように文字詰めをしていますが、デザイン初めたての時は勝手が分からず苦労しました…Photoshopの文字詰め♪ 基本的なことがほとんどなので、知ってる人にとっては当たり前のことですが、おさらいによろしければご覧ください。それではどうぞ！ちょっと待って文字詰めって何？まずは文字詰めが何か分からない人の為に軽く説明しておきますね。ワンランク上のデザインにはかかせない文字詰め文字詰めとは読んで字のごとく、文字と文字の間を詰めてバランスをとる作業のことです。通常文字を打っただけでは「ベタ組み」と呼ばれ、基本的に文字と文字の間が空きすぎています。それを詰めてデザインのバランスをとります。 WEBの性質上テキストデータの文字詰めは難し

akira_maru 2013/04/18

リンク

カーニング各種のおさらい - なんでやねんDTP・新館

Illustrator・InDesignのカーニング機能それぞれの違いについて簡単に説明した動画を作成し、YouTubeで公開した（画面は主にIllustratorを使用しているが、InDesignも考え方は共通）。*1 ※Photoshopも考え方は共通（2013.04.19追記）*2 Illustratorの画面で、各種カーニング機能の違いを説明しています。 InDesignの場合もほぼ同様に考えてイイのですが、異なる部分は随時InDesignの画面も交えて説明してあります。 ※InDesignで、オプティカルとプロポーショナルメトリクスを併用した場合、マズイ結果になるのは知っていたが、Illustratorでは特に問題ないの場合は少し挙動が異なるということは今回の作例で初めて知った。（併用した場合の初期的な表示は「オプティカル」が優先され、「プロポーショナルメトリクス」は無視される

akira_maru 2012/12/14

リンク

HTMLでカーニング！手軽に文字詰めできる「FLAutoKerning.js」 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

こんにちは、机に置いたおもちゃの日焼けが気になるもりたです。今回は、前からちょっと気になっていたウェブフォントをカーニングできるJS「HTMLで文字詰めするタイポグラフィー用JS」を試してみました。 http://fladdict.net/blog/2011/02/auto-kerning.html ※現在はアクセスできなくなっています。ご存知のとおり、jsを使わなくてもletter-spacingを使ってcssだけで設定しようと思えばできるんですが、ひと文字ずつの設定となるとhtmlもcssもすっきりしなくなる上にめんどくさい！こうパッとガッとスッと設定したい！そんな希望を叶えてくれるのが「FLAutoKerning.js」です！ポイント1：導入が楽です手順は簡単、サイトからファイルをダウロードしてjqeryと一緒に読み込ませて<head>内に設定を書くだけ。入れてみたデモ

akira_maru 2012/10/29

リンク

creative-tweet.net

This domain may be for sale!

akira_maru 2012/05/01

リンク

[Webデザイン]カーニングの件もっと | chihosh blog

先日、このブログのエントリーを見て衝撃をうけたよ！ ⇒ [Webデザイン] 文字組みについて本気出して考えてみた正確にはこのエントリーについているはてブコメントに衝撃を受けたよ！「これは参考になる」とか書いてあるよ！これって基本中の基本だと思っていたよ！私は紙の経験はほとんど無いけど、ウェブデザインの仕事は10年以上になるので世の中の文字詰めの甘いサイト（やポスター）のことは同じく気になっていたよ!! 東横線の中刷りの東急のポスターとかひどいよね！あと運用していくうちにカーニングぐちゃぐちゃになってるサイトとかね！ということで、上のエントリーに書かれていないことで、カーニングの基本と思われることを書いてみるよ！音引きは横85%、小さい「ャ」は縦横85%、「・」は縦横50%＋ベースライン調整漢字の「一」と音引きの「ー」が似ているため。ぱっと見で音引きとわかるように横幅を