Webの文字組版の問題は、かつてDTPが通ってきた道なのかも

3/23（日）に、WordBench京都に参加してきました。
WordBenchというのは、WordPressというCMS（というかブログシステム）についての小さな勉強会で、WordPressの特性上、たいていデザイナーは教えてもらう立場です。
しかし今回は、デザイナーからノンデザイナー（プログラマ）向けにデザインについて話そうという趣旨で行なわれました。

事前にFacebookページでデザインに関する疑問を募集し、それについてデザイナーが答えていくという形で進行し、言いだしっぺの高井さんと私がメインで、参加者同士で質疑応答を進めていきました。

詳細は、下記のブログが詳しいです。

デザイン初心者がプロのデザイナーにいろいろ質問して勉強になった話。WordBench京都にて。

“プログラマさんのデザインに関する疑問にお応えする会” @WordBench京都(2014/3/23)

2014年度 第03回WordBench京都 勉強会 フォントって大事なの？

勉強会の内容については、その後いろいろなところで話題にしていただいているようですので、細かい内容は上記のブログなどで見ていただくとして、この記事では、勉強会で言い足りなかったことや、後から思い出したことを少し書きたいと思います。

文字組版のこだわりは、Webでは意味のないものなのか？

Web制作においては、デザインのこだわり、特にDTPで培われてきたデザインというのは邪魔に感じることが多いと思います。

「文字組みになぜそんなにこだわるの？（等幅でいいだろ）」
「小塚明朝はダメでヒラギノ明朝がいいとか、訳わからない」
「文字を画像にしたら重くなるし、SEO面倒だし、レスポンシブにできないし、自動化できないし」
「色はどうやって決めるの？　青・赤・緑で分けたらダメなの？」

みたいな話ですね。
で、特に文字組版についてこだわると「DTPの人はWebの特性がわかってない！」って意見が出てきてしまうわけです。

では、文字組版のこだわりは、Webにとって意味がないのでしょうか？

実は勉強会の中で交わされた会話の中で、こんな意見がありました。

プログラマ：
「デザイナーが文字組みにこだわるのは、プログラマーが処理速度を数ミリ秒縮めるのにこだわるのと似たようなものですか？」
デザイナー：
「表示を数ミリ秒縮めるのがプログラマなら、表示された情報が脳で認識させるのを数ミリ秒縮めるのがデザイナーです」

それを聞いて、私は思い出しました。
以前参加したDTPのセミナー「INDD 2012 Kyoto」で、「美しい文字組みについて考える」というセッションを担当された大石さんの、こんな言葉を。

「（組版が）自然であればあるほど（逆に）その苦労も表からは見分けにくく、評価の対象にもなり得ません。」

十分にこだわりを持って組まれた文字組みというのは、あまりに自然に頭に入ってくるので、デザインしていることにすら気づいてもらえないということなんです。
（参考記事　INDD2012 Kyoto に参加しました！）

ただ、こだわりの文字組みに意味があるとわかったとしても、DTPデザイナーが行うような文字組みをWebで実現するのは簡単ではありません。
見出しなどで良く使われる「文字を画像にする」なんて手段もありますが、あまり良い手段とは言えません。
特に動的なサイトでは、コストがかかりすぎて実現がほぼ不可能であると言えます。

しかし、かつてはWebに向いていないと言われていたのに、最近の技術によって実現可能になってきていることもあります。

例えば、「Webの本文フォントに明朝体をつかうのは、視認性が悪いからダメ」と言われてきましたが、Ratinaディスプレイの登場により十分実用に耐えるようになりました。
それに加え、Webフォントにより、動的なサイトでもフォントにこだわった表現ができるようになりました。
まだ実用的ではありませんが、自動カーニングやジャスティファイを実現する仕組みも出てきています。

ということを考えていたら、そういえば、昔にも似たような話があったのを思い出しました。
かつて紙のデザインにDTPが出てきたときに同じような話があったなー　と。

かつては美しくないと言われたDTP

上記の記事（INDD2012 Kyoto に参加しました！）でも書いたのですが、かつて写植から Macintosh によるDTPへと流れが進む中で「DTPは美しい文字組みが出来ない」と良く言われていました。
こう思ったのは、特にデザインにこだわりのあるデザイナーばかりではありません。まだ単なるオペレーターでしかなかった私が見ても、Macで組んだ文字組みは美しくありませんでした。

これは、Macintosh DTPが普及してきたときにデファクトスタンダードだったDTPソフトである「Quark XPress」が大きな原因だと思います。

当時は、DTPイコールQuarkXPressの操作と言ってもいいくらいで、これが使えないと仕事になりませんでした。
しかし、このソフトには大きな欠陥がありました。
日本語組版にほとんど対応していなかったのです。

アルファベットという少ない文字種の組み合わせと、単語とスペースで表現される欧文組版のシステムで、日本語を表現するのには無理がありました。
もちろん、手動で1字1字に手を入れていくことは可能でしたが、数十ページから時には数百ページに及ぶ文字組みに対して、そんな手間をかけることはできません。
そのため、だんだん、きっちりした日本語組版というものがDTPから無くなっていきました。

こだわるデザイナーは「DTPフォントのひらがなは形が悪い」とも良く言っていました。
しかし、今のように多くの日本語フォントを使い分けることなど出来ませんでした。
モリサワ、フォントワークス、ダイナフォントなど、多くのフォントベンダーから新しいフォントが発売されていましたが、日本語フォントは1書体で何万円もしたので、DTP制作を満足にできるだけの書体を揃えようと思ったら、数百万円の投資が必要でした。

こういったことで、
「DTPの文字組みは汚くても仕方がない」から、
「汚い文字組みが当たり前」になり、
「汚い文字組みだと思わない」デザイナーも増えてきてしまい、
いちいち面倒な文字組みにこだわるデザイナーは煙たがられるようになりました。

今のWebでの、デザイナーとプログラマみたいな意識のずれに似ていますね。

そんなDTPの世界に変革をもたらしたのが「Adobe InDesign」と「OpenTypeフォント」です。
この2つの技術により、写植でないと実現できなかった「美しい文字組み」、しかも電算写植でも実現できなかった「自動の文字組み」が実現できるようになったのです。

特に「文字組みアキ量設定」という機能は秀逸でした。
ひらがな・カタカナ・漢字・英数字・句読点・カッコなどの文字をクラス分けし、それらの組み合わせによって異なる文字間の空き量の「最適値・最小値・最大値」を、あらかじめ設定しておくことができるようになったのです。
例えば、「カッコの次の漢字は通常50%詰めるけど、次に読点が来た場合は100％詰める」「漢字と英数字の間は最低12.5％空ける、でも最大25%以上空けない」みたいな設定です。
最大値と最小値を設定して幅を持たせることで、文字組みで左右両端で行の長さをそろえたい場合に、偏りなく見えるような文字間調整が自動で行われます。
また、複数行についてこれらをトータルに計算して最適値を求めることで、かつては綿密な計算と試行錯誤が必要だった美しい組版が、コンピュータの得意とする計算能力によって自動で実現できるのです。
また、InDesignではJavaScriptなどによる自動化やCSV取り込みなどにも対応しており、データベースからPHPでデータを抽出してCSVを作成し、JavaScriptで自動組版をしてPDFを書き出すということも行われるようになりました。
そのような場合でも、それなりにこだわった組版が実現できるようになってきています。

デザインのこだわりが実現できないのは、まだWebの技術が発展途上だから

つまり何が言いたいかというと・・・
DTPでは、デザインのこだわりをソフトウェア開発者（プログラマ）が少しずつですが実現してきているんです。
ということはこの先Webでも、次世代のCSS、ブラウザの描画エンジン、サーバー技術、インフラ技術などの向上によって、デザイナーのこだわりが実現できる世界が訪れるかもしれないと思うのです。

プロのデザイナーのこだわりには意味があります。
それが今の技術で実現できないからと言って「Webの特性を知らない」と言ってしまうのは、プログラマが自ら成長を諦めてしまっていることにはならないでしょうか？

もちろん、普段のWeb制作では納期や予算があるので、「こだわり」にも限界があり、落としどころを見つけることがデザイナーにもプログラマにも必要なことだと思います。
そういう意味で、デザイナーは現在のWebの特性を知っておかなければなりません。
でも、デザイナーはできるだけこだわりを捨てないでほしいし、プログラマはそのこだわりが実現できる可能性を探ってもらいたいのです。

この記事を書いた人

川井 昌彦

FAシステムメーカー、国内最大手印刷会社製版部、印刷・ウェブ制作会社を経て、家庭の事情で実家に帰省して独立
現在はフリーランスと制作会社シニアディレクターのマルチワーク
ウェブ制作のほぼ全般を見渡せるディレクター業務が主だが、デザイン・コーディングも好き

1997年ブログ開設
WordPressコミュニティには2011年から参加
WordCamp Kansai 2025 セッションスピーカー
WordCamp Tokyo 2023 パネルディスカッションパネラー
WordCamp Kansai 2016 セッションスピーカー
WordBench京都、WordBench神戸、WordBench奈良、WordPress Meetup八王子など登壇多数

最新の投稿

• ブログ2025年11月16日WordCamp Kansai 2025 で「触れるけど壊れないWordPressの作り方」についてお話しました
• 技術記事2025年6月15日ブロックテーマ時代のWordPress制作ワークフローとは
• 技術記事2025年3月7日WordPressに百千鳥フォントを入れて遊んでみました
• ブログ2025年1月3日移転のお知らせ（2024年）