Why not login to Qiita and try out its useful features?

We'll deliver articles that match you.

You can read useful information later.

59
22

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

プロポーショナルフォントでコードを書く

Last updated at Posted at 2023-01-15

これは何?

https://qiita.com/nodai2h_ITC/items/6c7b7ad029adf17da5f0#comment-4e0471395d41c1763f8f

……何故PythonやJSのコードをプロポーショナルフォントで書いたのか問い詰めたい。

というコメントがあったので、プロポーショナルフォントでコーディングする人もいるよ、ということを伝えようと思って筆をとった。

プロポーショナルフォントで書いている人

今はどうか知らないけど、少なくともかつては、 ビャーネ・ストロヴストルップさん はそうだったと思う。

プログラミング言語C++第3版に
image.png
とある。

これを読んで、私もかつてそうしていた。

プログラミング言語C++第3版に書いてあるとおり、しばらくしたらこちらが良いと感じるようになり、固定ピッチに慣れている人からは不思議がられるようになった。

第4版は、紙では持っていないんだけど、 Kindle 版では以下のように
image.png
依然としてプロポーショナルフォントを使っている。

歴史的経緯

そもそも、アルファベットはプロポーショナルフォントが基本。

等幅フォントが存在するのは、かつてプロポーショナルフォントを描画する能力がなかったデバイス(タイプライタとか、古いコンピュータの TEXT VRAM とか)の苦肉の策だろうと想像している。

しかし、古いコンピュータで等幅フォントしか表示できなかったために「ソースコードは等幅フォント」を前提としたエコシステムができいる。

プロポーショナルフォントで書くと

文字・単語の見やすさ

異論はあるかもしれないが、プロポーショナルフォントのほうが見やすい。
フォントによるとは思うけれど、平均的には文字幅が狭くなり、画面に入る情報が増えて便利。

とはいえ、プロポーショナルフォントでソースコードを表示するのに向いているフォント(つまり、 oO01Il| の区別が付きやすいフォント)はそれほど多くなく、フォント選びにはちょっと苦労するかもしれない。

私がプロポーショナルフォントでソースコードを書いていたときは メイリオ(Meiryo) を使っていた気がする。

エディタ

エディタがプロポーショナルフォントに対応している必要がある。

VSCode なんかは問題ないが、vim や emacs だと苦しそうだと思う(思うだけ。未確認)。
私がプロポーショナルフォントでソースコードを書いていたときは Visual Studio(Visual Studio Code ではない) と Sublime Text で書いていたと思う。

字下げと桁揃え

行頭の字下げについては、なんの問題もない。
tab でも space でも、好きな方法で字下げすれば良い。

行頭以外で縦に揃えるのは、プロポーショナルフォントを使う場合基本的に不可能と思ったほうが良い。

行頭以外ってのは、こういうやつ

foo:       [  12, hoge        ],
foobar:    [ 123, hogefuga    ],
foobarbaz: [1234, hogefugapiyo],

この「121234 の1の位を揃えたいというニーズはプロポーショナルフォントだと叶えられない。
手元で揃うように頑張っても、フォントが変われば揃わなくなるのでそういう努力はするべきではない。

コンソール出力

コンソール出力は、等幅フォントを前提とした出力がたくさんあるので、プロポーショナルフォントにするべきではないと思う。

たとえば、等幅なら

エラー出力
main.cpp:3:52: error: expected ';' before '}' token
    3 | int main(){ std::puts("hello, proportional world!") }
      |                                                    ^~
      |                                                    ;

となるところが、プロポーショナルフォントだと
image.png

のようになるので、せっかくの ^ が無駄になる。
等幅を前提としてエコシステムができているので仕方ない。

Haskell

Haskell の場合、行頭以外の文字を縦に揃える必要があって、プロポーショナルフォント好きとしては本当に困った覚えがある。

こういうやつ。

haskell
m x y = let a = 2
            b = 3
        in a*x+b*y

これをプロポーショナルフォントにするとこうなる。

image.png

私の記憶が確かなら、 = が揃ってないとエラーなので等幅フォントじゃないと無理。

【追記】
私の記憶は確かではなかったようで、= ではなく変数名の頭を揃える模様。
さらに改行を適宜入れれば プロポーショナルフォントを使っても無理ない感じで Haskell のコードを書くことはできそう。

コメント 参照。

しかし、他人が書いた上記のようなコードを無理なく読むことはできそうにないので、いずれにせよプロポーショナルフォントで Haskell の仕事はできないと思う。

Python

字下げが重要な Python だけど、私の知る限り行頭以外はどうでもいいのでプロポーショナルフォントでも全然困らないと思う。

JavaScript

JavaScript も全く困らないと思う。

ブラウザで表示されるテキストの殆どはプロポーショナルフォントなので、プロポーショナルフォントのほうが便利かもとすら思う。

ウェブサービス

github みたいなものでソースコードを表示する場合、たいてい等幅になっている。
プロポーショナルフォントだとだいぶ見た目が変わるので、見比べるのがちょっと面倒だったりはするだろう。

困るかというと別に困らないけれど、気にはなるかも。

まとめ

わたしも最近は等幅ソースコードを書いている。
プロポーショナルフォントの場合は設定が面倒(ここは等幅じゃないと困る、ここはプロポーショナルがいい、と設定を細かく行う必要があるので)ということもあるし、エコシステムが等幅前提になっていることに負けたということでもある。

とはいえ、おそらく今でもプロポーショナルフォントでソースコードを書いている人はいるだろうし、それは非合理的なことではない。

マイノリティではあるけれど。

プロポーショナルフォントでコードを書きたいという人がいたら、その人には「Haskell 以外なら別に困らないと思う」と伝えると思う。

59
22
13

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up

@Nabetani's pickup articles

Nabetani

@Nabetani(鍋谷 武典)

元横浜へなちょこプログラミング勉強会を主催者 / 元 CodeIQ の出題者 / 日経 WinPC に連載を持っていました(名義が違うけど)/ https://bsky.app/profile/nabetani.bsky.social / https://misskey.yancya.club/@nabetani / https://taittsuu.com/users/nabetani

Linked from these articles

Comments

igrep
@igrep(Yuji YAMAMOTO)

私の記憶が確かなら、 = が揃ってないとエラーなので等幅フォントじゃないと無理。

=が、というより、変数名の頭が揃っていないとエラーになります。
なので例えばこれはOKなので、プロポーショナルで書くならこのように書く手があります:

main :: IO ()
main = do
  let
    a = 1
    b = 2
  print $ a + b

Elm界隈だとよく見られる書き方だったと記憶しています。

3
nodai2h_ITC
@nodai2h_ITC

恥ずかしながら私も「プログラミングには等幅フォントだろう」と無条件に思いこんでいて、プロポーショナルフォントでプログラムを書く流儀が(しかもビャーネ・ストロヴストルップみたいな大物に)あることを知りませんでした。拙記事にこの記事の件を追記させていただきました。

3
Nabetani
@Nabetani(鍋谷 武典)
(Edited)

@igrep さん、コメントありがとうございます。
= ではなく変数冒頭でしたか。記憶曖昧でした。ありがとうございます。

というわけで、加筆して、haskell の例も変更しました。

2
sevenc-nanashi
@sevenc-nanashi(名無し。)
(Edited)

元のコメント書いた人です。
プロポーショナルフォントでコードを書く、というのを考えたことがなく(自分が見てきた記事とかエディタは基本的に等幅フォントだったので)、あまり良いイメージがなかった(ググって出てきた記事がコードをプロポーショナルフォントで書いていたら速攻ブラウザバックするレベル)のでプロポーショナルフォント派の人の主張がとても興味深かったです。

……なんかごめんなさい。

4
Nabetani
@Nabetani(鍋谷 武典)

@sevenc-nanashi さん、@nodai2h_ITC さん、コメントありがとうございます。

私は、プログラミング勉強会の主催をしていたということもあり、わりと多くの方のプログラミング環境を目にしてきました。
それでも今思い出せる範囲ではプロポーショナルフォントでコードを書いている人は、私自身以外一人も目にしたことがないように思います。

体感としては、1% 以下のマイノリティです。

一定数といるといえばいますが、まあ無視しても困らない程度の割合だとも思っていますし、「プログラミングには等幅フォントだろう」と無条件に思いこむのも、無理もないと思っています。

1
scivola
@scivola

記憶違いかもしれませんが,ええと 1990 年代あたりですかね,Macintosh の標準フォント(?)が Chicago(プロポーショナル)で,プログラミングの画面でも使われていたような。

2
Nabetani
@Nabetani(鍋谷 武典)

@scivola さん、コメントありがとうございます。

の pascal のコードを見るとプロポーショナルに見えますね。Chicago かどうかはわかりませんが。

1
scivola
@scivola
(Edited)

@Nabetani さん
おお,見つけてくださったのですね(私は見つけることができなかった)。

これ(Pascal のコード部分)は Chicago ではありません。
「w」を
https://slate.com/culture/2014/09/chicago-typeface-apple-computer-font-made-for-macintosh-and-used-on-ipod-felt-friendly.html
と比較していただくと分かりやすいですね。

メニューやウインドウのバーのところは Chicago です。

Pascal のコードの部分はたぶん Geneva です。

Geneva は文字ごとの幅の違いが抑えめなので,文字の並びによっては「モノスペース?」と勘違いしそうですが,よく見ると「:」なんかはかなり狭めだし,コードを縦に見ていくと確かに位置が揃っていないことがわかりますね。

いやあ,懐かしい。
この頃の Macintosh でプログラミングしたことは無いのですが,そもそもコンピューターの画面にプロポーショナルの文字が出るということが衝撃的でした。

4
KaoruHeart
@KaoruHeart

こんにちは。
少数派かもしれませんが、わたしはプロポーショナルフォントでプログラムを書いています。
読みやすさが全然違うと思います。等幅フォントの英単語は読めません。
プロポーショナルで書く理由は、英語ベースであるためで、当然変数名などもローマ字ではなく、英単語を使います。略語も使わず、きちんとした単語にします。
文字のそろえもスペースではなく、タブで行っています。

プログラミングを始めたときは、とくに.;などが重要な意味を持っているので、それを強調したプロポーショナルフォントを自作して使っていました。最近はメイリオです。

2
codelynx
@codelynx(Kaz Yoshikawa)

Mac Plus の 9インチの画面のTHINK Pascal でプログラムしていました。デフォルトはGenevaでした。プロポーショナルで、しかも予約語などはboldにされていたので、カラムで揃えるのはほぼほぼ不可能だったと記憶しています。

タブ揃えはほぼ不可能でしたが、とにかく、エディタが勝手に入力の都度リフォーマットしてくれるので、変な手間をかける必要がなく、かえって良かった記憶があります。

環境があれば、今はフリーで使えるみたいです。

2
Daru-IBN5100
@Daru-IBN5100(Daru)

今時な人たちは分かりませんが、

  • コーディングシート
  • キャラクタ・ディスプレイ・コンソール(TextVRAM)やインパクトプリンター
  • アセンブリ言語やFORTRAN(~77)他

等々、いにしえのプログラミング言語やハードの文字数/カラム制約にさらされてきた自分のような老人会会員だとやっぱり等幅が染みついちゃってますね。(^^ゞ

その他、人によっては

  • 読み易さ(見た目)か、管理のし易さ(フォーマット)か
  • 文章としてとらえているか、命令構文としてとらえているか

等々、重視するポイントが異なるのだと思います。
 

余談 1. 自分の場合、最近はUnicode(サロゲートペア・結合文字列・合字・絵文字・East Asian Ambiguous Width・他)がらみでエディタの文字数・幅が制御不能気味です…

余談 2. 念のため少し調べてみたところ、後期の電動タイプライターの頃には限られた機種ですがプロポーショナルな印字ができる代物もあったようで、ちょっとびっくりしました。
広告の中のタイプライター(33):IBM Electric Typewriter Model A

0
Nabetani
@Nabetani(鍋谷 武典)

@Daru-IBN5100 様 コメントありがとうございます。

自分のような老人会会員だとやっぱり等幅が染みついちゃってますね。

とのことですが、ビャーネ氏は 1950年生まれとのことです。
私も FORTRAN の経験こそ無いものの、PC-9801F なんかでプログラムを書いていた世代です。

染み付いているものから逃れるのも楽しいものなので、気が向いたら試してみるのも悪くないと思います。

1
Nabetani
@Nabetani(鍋谷 武典)

@codelynx 様 コメントありがとうございます。

今見ると解像度が低く、画面も狭い中でよくコーディングしていたなと思ったりもします。

当時のマシンパワーから考えると、Mac の何でもグラフィックスな環境はちょっとした冒険だったんだろうなと思います。

2

Let's comment your feelings that are more than good

59
22

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Login to continue?

Login or Sign up with social account

Login or Sign up with your email address