タイププロジェクトのデザイナーやエンジニアが、書体関連のあれこれを投稿していくブログです。書体デザイン・組版の豆知識や開発の裏話、スタッフおすすめの書籍紹介など幅広い内容でお届けします。

月末にひと月の更新内容を振り返るメールマガジンの配信も行いますので、ぜひご登録ください。

TPフォント使用事例紹介 「広告 その1」

パッケージや書籍、Webサイト、広告など各媒体でのタイププロジェクトのフォントの使われ方を事例を元に紹介していきます。 今回は、広告をご紹介します。※一部調整されている文字も含みます。 企画展「アリスの世界展―不思議な冒険の招待状―」告知チラシ 広告主:高知県立文学館URL:https://www.kochi-bungaku.com/exhibition/8473/ 【使用され…

Webフォントの最適化06「size-adjust・ascent-override・descent-override」

Webフォントの最適化01「FOIT・FOUT」にて、Web フォントの課題の一つである FOUT(フォントが入れ替わる際のチラツキ)を紹介しました。 Web フォントの利用の際、切り替わりによってテキストの行数が変化することなどにより、ページのレイアウトが変化してしまいます。これにより、テキストの読み取りの阻害や誤クリックなどのユーザー体験の低下や、CLS(Cumulativ…

意外と多い仮名系グリフ02「濁点・半濁点つき、小書き」

シリーズ前回の記事はグリフ数の話でしたが、今回は作るポイントの紹介です。 濁点・半濁点つきの仮名 元の字にそのまま濁点・半濁点を付け足すだけで上手くいくとは限りません。点がついても元の字と同じくらいの黒味に見えるよう文字全体を少し小さくしたり、点と筆画がかぶってしまわないよう一部を短くしたり、それぞれの文字に合わせて調整します。 元の文字の調整とは別に、濁点・半濁点の配置や大き…

Webフォントの最適化05「unicode-range」

unicode-range は指定することで、そのフォントで表示する文字の Unicode 範囲を指定することができます。 Webフォントのデザインテクニック05「混植してみよう」では、これを利用して混植表示を試みましたが、最適化でも利用することがあります。 unicode-range は、指定した範囲の文字が出てくるまで、そのフォントが読み込まれることはありません。 例えば、…

意外と多い仮名系グリフ01「50字では足りないひらがな」

よく「ひらがな50音」なんて言いますが、フォント制作でひらがなを作るとなると50グリフでは足らず100グリフほど作ることになるのが常です。 濁点付きの「がぎぐ」、半濁点付きの「ぱぴぷ」、よう促音などに使う小書きの「ゃゅょ」、こういったグリフが揃って初めて一般的な文章に対応できるようになります。ここまででもすでに80ほどのグリフが必要です。小書きの仮名は横組用と縦組用とでそれぞれ…

純明朝開発ストーリー2「骨格の特徴 その2」

前回の記事では、純明朝の漢字は縦方向に引き締まっていると書きました。単にフトコロを同じ方向に引き締めればよいのではなく、各々作り方は異なります。純明朝で作り方が特徴的なものや、難しかった例をいくつか挙げてみます。 「日」や「幽」などは他の字とのバランスや大きさ、その字らしいシルエットを意識せずに、縦方向に引き締まった他の字と同じように作ると単に細長くなってしまいます。 「刈」は…

今月の一冊(2024年4月)『明朝体活字 その起源と形成』

今回は、小宮山博史著の『明朝体活字 その起源と形成』を紹介します。 ずっしりと大きめの本で内容もぎっしりと詰まっているのですが、小宮山先生の柔らかな文体と、文章と関連図版を一緒に追えるよう設計された丁寧な紙面で、読み口は優しく感じます。 本書は「もしかすると金属活字の明朝体は中国人ではなくヨーロッパ人が作ったのか?」という疑問から始まりました。そして実際にアジアの国々に留まらず…

純明朝開発ストーリー1「骨格の特徴 その1」

純明朝・純明朝 ヘッドライン・純明朝 ヘアラインで漢字を担当した私は、仮名との関係や、どのような書体を目指すのか、書体の位置付け、新しいものにするにはどのような形になるのかを探りつつ制作を始めました。漢字筆画の細部ももちろんですが、それ以上に骨格に苦心しました。 制作当初から横組みを主眼に置き、縦組みでも実用性を持たせることが念頭にありました。特徴として、仮名はゆったりとした筆…

TPフォント使用事例紹介「書籍のタイトル その4」

パッケージや書籍、Webサイト、広告など各媒体でのタイププロジェクトのフォントの使われ方を事例を元にご紹介していきます。今回は、翻訳書をまとめて紹介します。 『音楽のはたらき』 著者:デヴィッド・バーン 翻訳:野中モモ 発行:イースト・プレス 書籍情報:https://www.eastpress.co.jp/goods/detail/9784781621968 【使用されている…

Webフォントの最適化04「サブセット化」

Web フォントの利用において、フォントファイル自体の最適化をする際、サブセット化は一番最初に検討される方法です。 サブセット化とは、必要なグリフだけを収録したフォントファイルを生成することです。 その際、不要なグリフを削除するだけでなく、GSUB・GPOS や、他の様々なテーブルも再構築する必要があります。 Web フォント配信サービスでは、利用しているページを解析し、動的に…

フォントの組版機能17「ライニング数字とオールドスタイル数字(lnum/onum)」

たいていの日本語フォントでは、高さの揃ったライニング数字が採用されています。これに対して、組んだときに上下に凹凸のできる数字が、オールドスタイル数字です。オールドスタイル数字は「Text Figures」または「Lowercase Figures」とも呼ばれ、アルファベットの小文字とマッチするので、欧文組版の本文でよく使われます。 前回は、プロポーショナル数字(pnum)と等幅…

漢字制作と部首04「意味から連想」

フォントの一文字一文字から作り手の気分を垣間見ることはなかなか無いかと思います。しかし多くの漢字はそれぞれ意味を持つため、私はその時作っている漢字から色々と連想してしまうことがあるのです。これは部首ごとにも傾向があり、例えば病垂れなら「痛疲痔」などちょっと気分が下がる文字が多く、「癒」もありますが制作においては要素が多くてバランスに気を遣う文字なのでどうにも癒しの時間にはならな…

今月の一冊(2024年2月)「タイポさんぽ―路上の文字観察」

今回は、藤本健太郎著の『タイポさんぽ―路上の文字観察』をご紹介します。 本書は著者が日本各地の路上で見つけた、看板や商品ロゴなどの文字たちとの出会いを記録したものです。自ら撮影した写真とグラフィックデザイナーである著者の視点から綴られた文章で120余りの事例が紹介されています。 本書で紹介されているのは、どれもアナログな手仕事の文字たちです。街の中で時代を経た姿は、現代のデジタ…

フォントの組版機能16「等幅数字とプロポーショナル数字(tnum/pnum)」

フォントに含まれている数字の話をするとき、「プロポーショナル」または「等幅」という用語が、ちょっとややこしいかんじになりがちです。 一般的な日本語フォントには、デフォルトの数字「0123456789」のほかに全角数字「0123456789」が入っています。一方、欧文フォントにはしばしばプロポーショナル数字(Proportional Figures)と等幅数字(Tabular F…

Webフォントの最適化03「ファイル形式」

Web フォントには、いくつかのファイル形式がありますが、現在ではほとんどのケースで WOFF または WOFF2 フォーマットを使うのが良いでしょう。 WOFF / WOFF2 の主な違いは圧縮アルゴリズムで、WOFF2 のほうが圧縮率が高いとされています。2つのフォーマット間には互換性がないため、WOFF2 を WOFF として、もしくは WOFF を WOFF2 として読…

フォントの組版機能15「エキスパート字形(expt)」

IllustratorやInDesignの字形パネルメニューに「エキスパート字形」という項目がありますが、これって何?という話をします。なるべく専門用語を使わずに短く言うと、昔、JISの文字コード規格が略字を多めに採用していたころに、おそらく「略字ではなく正しい字体を出力する」という意図で策定・実装された文字セットをルーツとするグリフが「エキスパート字形」です。 図は珊瑚の「珊…

漢字制作と部首03「作り分け」

フォントで之繞の文字を打ってみると「近送通」と「迚遙迴」のように之繞の点が1つのものと2つのものがあります。他にも、示偏の文字なら「祁祇禰」のような”示”形と「社祝福」のような”ネ”形の2種類です。このようにひとつの部首が複数のバリエーションをもつことがあります。文字セットによっては2種類両方作る文字もあるのですが、2種類目は漢字の意味合いに既視感を覚えつつの制作になります。 …

書体づくりの舞台裏:視覚調整02「線の太さ」

今回は縦画・横画の太さによる視覚調整のポイントを紹介します。 今回の記事で紹介する縦画・横画は、「下ほど太く」「右ほど太く」というルールに沿って制作することが多い例です。これも前回記事の空き部分と同様で、人の目には上部が膨張して見えるためです。 横画の多い「圭」を例に挙げて紹介します。横画の太さや、横画の間の広さを均一にしてしまうと、上側の「土」の方が大きく見えてしまいます。 …

フォントの組版機能14「任意の合字(dlig)その2」

前回は、欧文フォントであるHama Mincho Itilicを例として、オプショナルなリガチャを呼び出す「任意の合字(dlig)」について紹介しました。日本語フォント場合、「任意の合字」は、「FAX」を「℻」に、「ミリバール」を「㍊」に、「株式会社」を「㍿」に置き換えるようなパターンのほかに、「JIS」を「〄」のような例もあります。そう言えば、話は完全に脱線しますが、JISマ…

フォントの組版機能13「任意の合字(dlig)」

前回は「欧文合字(liga)」を取り上げました。今回は「任意の合字(dlig)」を紹介します。「任意の合字」という名前がちょっとわかりにくいですが、英語ではDiscretionary Ligaturesです。訳すと「自由裁量合字」とかでしょうか。むしろ、ますますわかりにくくなりましたね。 「欧文合字(liga)」がデフォルトでの利用を想定しているのに対して、「任意の合字(dli…