webデザインを1ランクアップさせるタイポグラフィの「字間」「行間」「読みやすさ」を改善する方法
Webデザインにおいてタイポグラフィは、キーコンセプトやコアメッセージをサイト訪問者に伝える重要な役割を担っています。 ですが実際に文字を並べてみると、なんとなく締まらない感じがすることはありませんか？それはフォントの種類という問題よりも「文字間の間隔（アキ）」の問題かもしれません。 こうした文字間のアキをうまく調整することを「カーニング」と言います。字間のアキを詰めたり離したりすると言えば単純ですが、このカーニングはちょっと奥が深い技術でもあります。逆に言うと、カーニングをしっかり意識すればバシっと決まるワンランク上のタイポグラフィを組めるようになりますので、Webフォントの「カーニング」についてご紹介することにしましょう。 見出しを「正確に」見せるカーニング まずはこちらの見出しをご覧ください。 こちらはGoogleのWebフォント「Abril Fatface」を用いた見出し文ですが、
ウェブ組版は行間が基準なのではという話 - note
以前見かけたこの記事がきっかけで、実務でもずっと引っかかっていたことがあるので書こうと思う。 ＞ remの基準となる値を行の高さにする | yoshihiko com-blog 行間 ≠ line-height という罠よくある疑問に、日本語で言う「いわゆる行間」と、CSSの「line-height」は違うというのがある。日本語の文章は、仮想ボディが基準の原稿用紙のようなグリッドがあって、それが「いわゆる行間」のピッチで繰り返されて本文ができている。文字の頭（仮想ボディの上）から次の文字の頭までがいわゆる行間とされている。もっと正確に書くと、これは行送りであって、正確な意味での行間は line-gap というものになる。 行送り= line-height、行間= line-gapで、一方ラテン語圏が基本のウェブ（CSS）では、この line-gap のくっつき方が純粋な日本語組版とは異なっ
フォントブログ
フォントブログ閉鎖と一部記事の移管について 平素はフォントブログをご覧いただき誠にありがとうございます。 数年前よりブログの更新を中止したまま、諸般の事情で過去の記事は公開をしていましたが、 時代に合わない内容や、すでに古い情報をこのまま残しておくのは良くないと考え、 フォントブログを閉鎖することにいたしました。 これまでお世話になった方々、私に様々な機会を与えてくださった方々、 そして約25年間に当ブログをご覧いただいた方々に心より感謝いたします。 私自身2014年に関東から地元へUターンをし、 書体デザイナーやフォントメーカーの方、文字関係者の方と直接お会いする機会が減ってしまったこと、 また私自身の環境の変化により、以前のように情報収集をする時間の確保が難しくなってしまいました。 フォント好きとして初心に帰り、過去の一部の記事は順次個人サイト (PETITBOYS) のブログのほうへ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
