第30回リクリセミナー「フォントのホント」に参加してきました。

Publish2016/10/04(火)

Update2020/11/25(水)

2016年10月1日に中央会計セミナールーム(どうでもいい情報:僕は親しみを込めてCSRと略してSNSに書いているが一向に定着する気配がない。)で行われた第30回リクリセミナー「フォントのホント」に参加してきました。
このイベントは、前回のリクリで告知された時から「やばい。めっちゃ行きたい!」と個人的に大注目イベントだったわけですが、残念ながら小学校の運動会と日程がかぶっていたので、参加できないはずだったイベントでした。
しかし、当日は朝から雨が降っており、予定されていた運動会は中止に。
「これならリクリに行ける!」と申し込みをしようとすると、まさかのキャンセル待ち。
人気イベントだし仕方ないなーと思っていると、「立ち見でよければ来てもらって大丈夫」というアナウンスがあったので、立ち見でも見たいから行ってきました。
なんというめぐり合わせでしょう。
ちなみに、運動会は翌日快晴のうちにとり行われましたことをここに報告します。
とまあ運動会のことは置いといて、参加したリクリは非常に勉強になる素敵イベントでした。
当日はTwitterのハッシュタグ「#resem30」で参加者がツイートしていたので、例のごとく帰ってからツイートをまとめました。
当日の雰囲気を確認したい方はこちら。
https://storify.com/deroter/resem30
なお、公開後にもツイートが増えていたので、追加しております。

目次

書いてたら長くなったので目次

  1. 日本語Webフォント最新事情(2016年版)
  2. 文字・書体のひみつ 〜フォントの裏側教えます〜
  3. フォント愛ダダ漏れ LT大会
  4. 読みやすさ、伝わりやすさのためのテキストの扱いアレコレ

日本語Webフォント最新事情(2016年版)

最初のセッションは関口さんのWebフォントの話です。
いきなり人類の歴史からは始まるアカデミックなオープニングから、文字の歴史に入り、ヒエログリフの話など普通に勉強になるし面白い話から始まるセッションでした。
フォントを語る上で、まずは文字そのものから入るアプローチは素敵です。
フォントという形で文字が扱われだす契機ともなる15世紀のグーテンベルグの活版印刷の話の際には、個人で所有している当時の実際の印刷物を回して見せてもらうなど、「この人ほんまに好きやな」という愛がこれでもかと伝わってきます。


日本での印刷や写植の話を経て、PCでのデジタルフォント、そして今のWebフォントへと話が進みます。
こうやって順序立てて考えると、今の時代がどういう状況なのかを俯瞰的に考えることができるのでよいですね。
Webフォントの話では、最近特にサービスが増えてきているという点が紹介されていました。
僕もこのブログで使っている「FONTPLUS」や、モリサワの「TypeSquare」などの有名どころ以外にも多くのサービスが出てきている状況で、ユーザー側としてはどこを選べばいいのか難しい感じです。
そして、Webフォントを取り巻く環境がよりよい状況になってきていることも紹介されました。
その中の一つが、IE8のサポート終了です。
IE8をサポートする必要がなくなったので、IE8のために必要だったeotファイルが不要になり、ファイルを読み込むプロセスが減ったので結果的に高速化が実現し綺麗なフォントが早く表示できる時代が来たという話がすごく面白いなと思いました。
古く問題のあるサービスは、存在していること自体が迷惑なものだという分かりやすい例としてだけではなく、なくなることで間接的に改善される環境が出てくるというとてもよい実例です。
関口さんのいるFONTPLUSでは、人気フォントランキングを作っているそうで、その結果を公表しています。
http://support.fontplus.jp/font-ranking/
このデータがなかなか興味深い内容で、どういうフォントが好まれて使用されているのかを知るとてもよいデータだと思います。
また、関口さん個人の体感として、利用企業や団体が増えてきているという感想もふむふむと聞いていました。
そして面白かったのが、関口さん調べによる日米のWebフォント普及率の比較。
厳密にデータがあるということではないですが、その経験値によるとアメリカでは80%以上、日本ではまだ10%以下というのが実感だそうです。
アメリカのようにアルファベットだけでいい場合は、フォントを構成する文字数が少なくて済むのでわかりますが、日本はまだ全然普及していないなと改めて感じました。
逆に言うと、まだ伸び代はあるなと思いますので、これまで同様提案にはWebフォントを積極的に絡めていこうと思います。

余談:ふにろぐも紹介されました。

ちょっと余談になりますが、このセッション内で関口さんの好きなブログを紹介するコーナーがあり、3つの好きなブログとして「金沢の坂道」「あなたに会いたい!」と並んでこのブログを紹介してもらいました。
関口さんのセッションでは、これまでも何度か紹介してもらっていて嬉しい限りですが、今回も紹介してもらえました。
この2つのサイトと並んで紹介されるのもとても光栄なことです。
そして、その時に「ふにろぐで使っているフォントのハミングは柔らかい印象のあるフォントなので、やさしく見えるようにされているのでは?」と説明されていたんですが、これがまさにその通りでした。
というのも、ブログ内で結構厳しめの意見を書くこともあるのですが(書かずにはいられない症候群)、言葉は文字にすると一気に攻撃性が上がるので、その攻撃性というか角を取るために、あえてハミングのような優しい印象を与えるフォントを選んでいるんですよね。
なので、聞いた瞬間「ばれた(笑)」と思ってニヤニヤしてしまいました。

文字・書体のひみつ 〜フォントの裏側教えます〜

次のセッションはモリサワの高桑さんのセッションです。
高桑さんのお話は前回のリクリの時に聞いた内容も少し含まれていましたが、やはりすごくよい内容でした。
今回のリクリに「めっちゃ行きたい」と思っていたのも、前回聞いた高桑さんのお話がすごくよかったからということもあります。
フォントのことを心から好きそうに笑顔で話す様子を見て、こちらも心がほっこりする感じというか、独特の世界観に引き込まれます。
内容としては、まず最初に話してたA1明朝の話が面白くて、掴みとしてバッチリでした。
明朝はAなので、A1明朝は明朝最初のフォントという意味だというのは知らなかったので、なるほどそういう意味なのかと納得でした。
A1明朝の特徴である「墨溜まり」の説明とかもなるほどということが多くて勉強になります。
実際にフォントを作っている方の声ってすごい説得力があります。
そして次に紹介されたのが、フォントの製造手順。
よく使われるパターン500文字をデザイナーが一枚一枚手書きし、その内容をデータ化、そのデータを個別に調整したり、文字を文章にして全体のバランスを考えて調整したりといった、気の遠くなる作業を経てフォントが完成するわけです。
その期間はフォントによって様々ですが、最低でも数年、フォントによっては10年もかかる場合もあるらしく、フォントを作っている方々の凄さを改めて思います。
ちなみに、手書きでデザインする際に使用する紙を配布してもらったんですが、この紙のサイズにもこだわりがあり、手の動きを考慮して最も手がスムーズに動かせる最小の大きさに調整しているとのこと。
聞いているだけで鳥肌が立ちますね。
フォントは最大で23058文字もあるらしく、その数を聞いて心が折れます。
フォントを作っている人は本当にすごい(ダジャレではなくて心からそう思う)。
また、フォントを作る際の注意点として聞いた錯視調整の話も大変面白かったです。
人間の視覚にはその事を自分の都合よく見る性質がありますので、その特性を考慮してフォントのバランスを整えているという話はすごく面白かったです。
四角い図形の中心点を指してみてくださいと言われるテストがあって、参加者の方がやってみていましたが、人間は中心よりも少し左上を中心として認識するということらしく、最初にそのことを説明されて、それを考慮して真ん中をさしてもらったのに、それでも中心より左上になっていたりしていたことで、人間の知覚認識の錯視を考慮することがいかに重要なものかが理解できました。
最後に事例として紹介されたサイトの例では、Webフォントありきでのサイトデザインの話で、レスポンシブ時にfont-familyを変えるという話がすごく興味深い内容でした。
その手法自体はまあよくある方法ではありますが、何が面白かったかというと普通に見ていて判別がつかないレベルでの実装だったという点です。
これは最後の鷹野さんのセッションで出てきた言葉ですが、「適切なフォントを選択すると、フォントの存在感は消える。」ということだと理解しました。
文字情報がまるで空気のように、自分の中にすっと入ってくる感覚の時ってありますが、その時にはフォントはフォントとして認識していません。
伝える時の手段として最適な状態というのはこういう状態のはずなので、そのように細かく配慮された設計が素敵だなと感じたということです。

フォント愛ダダ漏れ LT大会

セッションとセッションの間に、今回はスポンサーセッションとLTがありました。
スポンサーセッションでは、リクリ用にjimdoのスペシャルパッケージが用意されていて、これはすごいなと思いました。
そのためにサイトまで用意してあって、jimdoの本気度合いに圧倒されます。
これは参加者特典なので実際のURLは紹介しませんが、こういう取り組みができる会社って素敵だなと思います。

あわゆきさん「フォント、作るほうの話」

最初にLTをしたのは、寿司ゆきでおなじみのあわゆきさん。
あわゆきさんは自分文字好きが高じて、自分文字の手書きフォントを作ろうとしたようです。
この時点で色々とすごい。
そして、実際にやってみて思ったより大変だったということを実感したようです。
作成に使ったdrop&Typeは面白そうだなと思いましたが、この話を聞いた後に気軽に手を出せる感じはしないので、そううものがあるということを覚えておくくらいにしておこうと思います。

森さん「Windowsのフォント事情と本音」

LT2人目は森さんのセッション。
森さんは先生業をしているので、話がとても上手いんです。
大阪っぽい感じのわかりやすいトークは本当に圧巻で、これにさらに笑いを入れたりするので本当にすごいなと思います。
こういう話し方は参考になるけど、僕には真似できないですね。
内容もきちんとオチをつけていたりして非常にテンポのいい内容でした。
今回伝えようとしていた「Windowsでのフォント問題」はあるあるの話だったんですが、なんというか森さんの優しさが伝わるいいLTでした。

こざるさん「こざるとフォント〜コンピュータとともに」

LT3人目はこざるさん。
こざるさんはメインがマークアップなので、スライドもHTMLで書いてきたそうです。
さすがですね。
それはそうと、こざるさんとはよく話はしますが、LT聞いたのは多分2回目?くらいでして今回はどういう感じの話だろうと楽しみにしていました。
結果から言うと、ジェットコースターみたいなLTでこざるさんの人生とフォントの関連性を5分間の間に浴びせ続けられた感じでした。
この勢いはすごい。

こざるとフォント〜コンピュータとともに

コンチさん「Fontでできる戦争撲滅」

LT4人目は、某界隈でLT芸人として有名なコンチさん。
コンチさんといえば、マイプロジェクターを持っていることでも有名なくらいLTにかける情熱がすごい人です。
(マイプロジェクターを持っているのは、LT芸人たるもの、いつどこででもLTができるようにするためには、常に持ち歩ける携帯型のマイプロジェクターが必須であるという考えから来ているようです。なんだかよくわかりませんが、すごいですね。)
さてそのコンチさん、さすがのLT芸人らしく、LT開始前にスライドを公開するという荒技をやってのけます。
これはLT中に手元のPCでもスライドを見ることができるので、席が遠くの人でもLTをよく理解できるようにという配慮からだと思います。
こういう気配りはすごくいいですね。
そして、LT参加者の中で唯一時間以内でLTを終えるというレベルの高さを発揮していました。
内容も非常に面白く、Noto推しな理由も、他言語対応に対する考え方も、僕は似たようなことを思うとこともあり、非常に共感できました。
Fontでできる戦争撲滅

読みやすさ、伝わりやすさのためのテキストの扱いアレコレ

最後のセッションは鷹野さんのセッション。
鷹野さんのセッションを聞くのはかなり久々だったんですが、今回聞いてみて改めてすごくいいなと思って聞いてました。
話のつかみのGoogleのロゴがSVGになった件とかもキャッチーでわかりやすかったです。
こういう分かりやすいところでぐっと掴んでから本編に繋げるのはすごく上手いなと思います。
そして本編では「3つのレイヤー」を中心に話が進んでいくわけですが、このテーマを「3つに絞る」というやり方は非常に上手いなと思います。
僕もお客さん先でよく言っているんですが、人間は同時に理解できることは3つまでというルールのようなものがあります。
4つでも5つでも覚えることができる人はいますが、人間の認知能力では一度に入る情報は3つまでにしておくというのは鉄則だったりします。
そのルールをもとに考えると、テーマを3つに絞るやり方はわかりやすさを出す上で非常に重要ですよね。
今回の3つのルールは「文字原稿」「フォント」「組版」という3つでした。

文字原稿

まず何故この3つなのかというところですが、今回はフォントのセミナーなので、フォントだけ取り扱えばいいところですが、フォントを考える前に、まずそのフォントを適用させる文字原稿についてきちんと考えようということが重要なんですよということを説明されてました。
文章書く上でよく言われる漢字をひらがなにする「ひらく」という手順は、読みやすさ、わかりやすさへの配慮です。
そのため、「ひらく」文字に対するガイドラインがきちんとしているところでは存在していて、表記のゆれがないように統一されているという話は文章を伝える上でやはり重要だということを再認識しています。
ここは僕も普段気を使っているところではありますが、ガイドラインなどの明確な指標はありませんので、ちょっと考えてみようと思っています。
ひらく際のポイントとしては、「手書きで漢字にしないものは。ひらく基準になる。」「実際の形がないものはカタカナで。」という基準は非常にわかりやすかったです。
読ませる側の配慮としての「ひらく」についての考え方は、鷹野さんの文章に対する付き合い方と姿勢で、すごく勉強になりましたし、背筋がピンとなる感じでした。

フォント

そして今回のメインテーマのフォントですが、面白いなと思ったのは「世界観に合うかどうか」「時代のムードも考慮に入れる」という点です。
例として、あるセミナーのタイトルの箇所のフォントをどれにするのかという話をしてましたが、印象的だったのは「これは3年前だとドンピシャにかっこいいけど、今やったらちょっとイタイ」という言葉でした。
フォントにも時代のトレンドがあり、太いフォントがかっこいい時代もあれば、細いフォントがかっこいい時代もあるので、その時代のムードを感じ取ってタイトルのフォントを選択するというのが非常に面白いなと感じました。
そしてフォント選びのこだわりのポイントとして、紙では絶対にしているという「従属欧文は使わない」という話も非常に面白い内容でした。
この辺はさすがにDTPもやってきた方だけあって素晴らしいなと思って聞いていました。
Webしかしない僕からすると、今回聞いた内容をどうやってWebで表現するのがいいのかなとか考えてしまいます。
また、欧文だけではなく、かなのみ変えたり、()などの記号類だけフォントを変えるなど、ものすごく細かい話をされていたんですが、イラレの「合成フォント」で設定して対応しているということだったので、僕も帰ってきてから早速イラレ環境を真似してみました。

組版

最後のセクションの組版では「文字詰め」についての話を聞きました。
「なぜ文字詰めをするの?」という質問に対して、人間が文字を認識するときに、文字単体ではなく、ブロックで読んでいる(視認している)ので、詰める必要がある。
というのがすごく納得できました。
単に文字を綺麗に詰めるということだけが目的なのではなく(もちろんそこも重要)、詰めることによりより読みやすく、理解されやすい文章にすることができるので、文字詰めをしないわけにはいきませんね。
その時の手法として、「一旦詰めてから開ける」という手順も納得でした。
開けながら調整ではなく、一旦開けた状態を詰めていきながら調整するのは今後真似します。
また、自動カーニング(メトリクス)とオプティカル、和文等幅などの違いも非常に面白い内容でした。
鷹野さんのセッションを聞いていて感じたのは、最後におっしゃられていた「打ちっぱなしにしない」に集約されていると思います。
美しいかどうかは当然として、文書がスッと入ってくるかどうかを考え、誤読を避ける気遣いをすることが重要ですね。
そしてやはりこの言葉が印象的でした。
「適切なフォントを選択すると、フォントの存在感は消える。」

まとめ

フォントのセミナーという形で、少しマニアックな感じに見えますが、全体を通してフォントの成り立ちや現状、どういう過程で作られているのか、どのようなことが考慮されているのかといった体系的な学びがあり、LTではそれぞれのフォント愛が伝わり、最後のセッションでフォントだけではなく、「伝える」とはどういうことなのかを考えるとても一連の流れが素晴らしいセミナーだったと思います。
リクリはいつも本当に内容が素晴らしくて、いいセミナーだと思います。
当日は懇親会にも行きたかったですが、所用があり行けずに残念でしたが、本編でかなり色々と勉強することができました。
次回の日程は未定ということですが、次回も基本的に参加する方向で動きます。

記事の著者:ふにすでぐち

ふにすでぐち

1978年生まれ。企業のWeb活用をテーマに、Web運用を中心とした戦略的な企画立案、サポートやホームページ/Webサイトの構築などを行っています。
5年間のWeb制作会社勤務後、2年間のフリーランスで「フニス」として活動後に法人化し、2012年7月「ふにす株式会社」を設立。
Web運用の情報や考え方などを発信するブログ「ふにろぐ」を定期的に更新し、情報配信をしています。
また、Googleアナリティクス認定資格を取得しているので、アクセス解析を用いた分析などの手法でお客様のホームページの成功をサポートしています。
本社のある大阪府高槻市で「ふにすWeb相談所」を開設し、
地域の方々に気軽にWebのことを相談できる場所として、より多くのWeb運用の問題解決をするために活動しています。
Webの運用に関するお悩みや、ホームページで成果が出せないお悩みをお持ちでしたら、お気軽にご相談ください。
お問い合わせはこちら

LINEでWebに関する質問にお答えしています。

ふにすでは、LINEでWebに関するご質問にお答えしています。Webに関するあんなことやこんなこと、今さら聞けない疑問などなんでもご相談ください。LINEアプリでQRコードを読み取ると友達登録のリンクが表示されますので、試しに登録してみてください。

ふにろぐとは?

でぐち

ふにろぐは「ふにす株式会社」の「でぐち」が書いているブログです。
このブログでは主にホームページの運営をしている企業のご担当者様向けに、「ホームページ/Webサイトの運営に役立つTips」や「今更人に聞けないような初歩的なこと」を中心に情報を配信しています。

このブログについて

ふにす株式会社

ふにす株式会社は大阪の高槻にある「Webを起点に会社の成長を応援するパートナー」をモットーに、Webにまつわるいろいろな問題を解決する、サポートをする会社です。
ホームページでお問い合わせを増やしたい、もっとたくさんの人に見てもらいたいなど、ホームページ/Webサイトを活用したい方向けの活動を行っています。
また、ホームページの作成や、外部パートナーとしての運用サポートなど、幅広くWebにまつわる諸々のことをおこなっております。
どのようなことを頼めるのかをまとめてみましたので、ご確認ください。

ふにすにはどんな仕事が頼めるの?

ブログ内検索

サービス

ふにすWeb相談所

ホームページの運用お得情報

ホームページ/Webサイトの運用に関する記事のまとめです。ツールや運用ノウハウなど、知っていると便利になる情報ですので、まずはこちらをご覧ください。

Webサイトの運用に関する情報

お問い合わせ

ホームページを成功させたいとお考えの方はお気軽にご相談ください。
ご相談は、下記の中からお好きなものを選んでいただければ大丈夫です。

  • メールで問い合わせる
  • チャットワークで問い合わせる
  • Facebookで問い合わせる
  • X(旧Twitter)で問い合わせる

LINE@でも相談を受け付けています。
QRコードから友達登録を行って、メッセージを送ってください。

LINE@

最新記事

カテゴリ別記事一覧

月別記事一覧