noteのフォントにちょっと感動した話

みなさん、フォントに興味はありますか?

僕はけっこう興味あるんです。

というのも、仕事柄ウェブサイトの見た目を作ったりしてるのもあり、もともとデザイン性のあるものにかなり興味があるのもあり、かっこいいフォントを見ると独り言の域を超えてテンション上がったりしてしまいます。

「何に感動したのか。」

基本的にnoteはPCで書いています。(MacBookです、格好いいMacBook。2014年のやつだけど。)

スマホの記事入力画面ではそんなことなかったと思うんですが、PCの記事入力画面では「」(括弧)とか、(点)とか。(丸)とかがなんと半角くらいの幅になるんです!

本文では日本語であればどの文字も全角幅なのに、タイトルの部分でのみ半角幅になってるんです!

気がついたときはめちゃめちゃテンション上がりましたね。。。

どこの指定でこうなっているかはまだ追えてませんが、そのうち追ってみようかな。

ただ、このままでは終われません。

そこから考えました。

「なんで見出しだけこのフォントなの?」

自分なりに考えました。

あくまで『自分なりに』考えました。

まず前提として、noteは下記のような特徴があると思っています。

- 基本的に余白が広い(記事入力画面も記事画面も)。広めの余白でバランスをとっている。

- シンプル(直感的に操作できるもの)でUI/UXを意識して作られてる。

で、これらを意識して考えてみると、本文は『余白が広い』、かつ見出しは『太字 + 本文より大きい』です。

となると、ただでさえ余白多めでバランスをとってつくっているのに、そういった記号を使われたときに想定している余白よりも大きい余白が入るようになっていしまいます。

本文は、「」(括弧)とか、(点)とか。(丸)とかを全角幅で表示しても、フォントの大きさ自体がそこまで大きくないので目立ちません。

ただ見出しは前述したように『太字 + 本文より大きい』ので、「」(括弧)とか、(点)とか。(丸)とかを全角幅で表示してしまうと、けっこう余白が目立って見えてしまうのです。

書き手側も見出しの記号部分にバランスが崩れたような余白が存在していると、スペースが入っているかどうかを意識してしまう可能性も考えられます。

このような理由で、見出しの記号は半角幅になるようにしてあると考えました。

かなり細かい部分ではあるが、内部でちゃんと決めて「こういう実装したほうがいいよね」って感じでサービスに落とし込めているのは素敵ですね。

もちろんサービスなのでこだわりは絶対に必要なのですが、無意識レベルで引っかかりそうな部分にも配慮していてすごいなと感じた。

まさに、『神は細部に宿る』ですね。


僕も自分で作るもの、サービスにはこだわりを持って、開発していきたいって思いました。


この記事が参加している募集

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

7
『湧き出てくるポエマティックな独自の思考の上澄み』 - 都内でプログラミング的なことを仕事にしています