フォント

概要

　ディスプレイに文字を表示しようとしたならば、文字コードに対応したフォントが必要になります。各言語だけの領域に特化した小さなフォントファイルからUnicodeフォントのような非常に膨大な情報をもったものまでさまざまですが、Unicodeフォントともなると相当に時間のかかる作業になると思われます。誰かがフォントを作ってくれているから文字が画面上に正しいカタチで見えています。その大変さを感じ、感謝するべきなのかもしれない。どれほどすごい作業なのかということと、実際に簡単でありながらも美しさをもかもしだせるアウトライン形式のフォントファイルを作成する手法の一つを紹介したいと思っています。アプリ作成においても独自フォントによる汎用の再利用図形セットとしての扱い方もあると思いますので、これはアプリケーション開発にも関係するものだと思います。

フォントファイル作成手段

フォント METAFONT <ymath>$$ \TeX、\LaTeX $$</ymath>に搭載されているFONT作成技術です。

Windowsフォントファイル作成アプリ

FontForge 公式サイト

アプリケーション入手方法

1.上記の公式サイトからWindowsInstallというオレンジのボタン状のリンクをクリック

2.「subscribe/confirm and dawnload」というボタンを押します。後ろの確認してダウンロードという意味の方になりますね。寄付してもいいという寛大な方はdonateからアプリの価値相応の金額をクレジットカードで支払って、隣のテキストボックスにコードを入力して「subscribe/confirm and dawnload」というボタンを押します。寄付した人には、いいことがあるかもしれませんね。

インストール

日本語対応してますので、直感でいけます。

パスの登録は自分でやらないとダメみたいですね。環境変数PATHに追加で「インストールディレクトリ\FontForgeBuilds\bin」という感じです。Windows10だと

「コントロールパネル\すべてのコントロールパネル項目\システム」から「左側の項目のシステムの詳細設定」

あるいは

「スタートアイコンを右クリックして表示されるメニュー」から「システム」を選択して「関連情報の項目にあるシステム情報」

を選択して表示されるダイアログウィンドウの「詳細設定」タブから環境変数を選択して「新規」ボタンでアクティブになった部分に追記入力します。デフォルトのインストールパスだと「C:\Program Files (x86)\FontForgeBuilds\bin」ですね。

パスを通しておくと、METAFONTのmf2pt1コマンドの結果呼び出されるFontForgeコマンドが動作してType1フォントが生成されます。

アプリの特徴

METAFONTも読み込めます。もちろん、METAFONTからmf2pt1で生成するplain type1フォント$($adobe方式$)$のようなアウトライン形式のフォントも読み込めます。通常利用するフォントであるTrueTypeフォントであるttfやttfのコレクション形式のttc、OpenTypeフォントのotfやコレクション形式のotcといったフォントファイルも読み込めます。なんというか物凄い豊富な機能を保有したアプリのように感じます。これがフリーで手に入るようになったのか！！という凄さです。

対応するファイルの種類・拡張子

TeX Bitmap Font

*.mf

*.$($nnnn$)$gf

*.$($nnnn$)$pk

PostScript

*.ps

TrueType

*.ttf

*.ttc

OpenType

*.otf

*.otc

Type1

*.pfb AdobeのPostScript形式Type1でPrinter Font Binary

Type2

Type3

SVG

Unified Font Object

FontForge SFD

*.sfd

フォント Font Forge

フォント技術一般

Windowsでヒラギノフォントを使う

　Windowsで游ゴシックやヒラギノフォントを使うと汚いというか、滲む(にじむ)というかか、変な感じになってしまいます。これはWindowsのフォント設定がmacOSの標準フォントの設定とが異なるためと言われています。少し大きい目のフォントサイズ(1.13em、113%、あるいは17px以上)で使わないとmacOS同等のようなきれいな描画はされません。この原因は一つにはRetinaDisplayの高解像度による滲みの低減作用。もうひとつは、文字のウェイト設定がmacOSではweight400が標準になっているのに対して、Windowsでは300が使われているようです。つまり細めになっているので、細くなりすぎると、より繊細な演算をしないと表示がおかしくなるというものですが、繊細な演算はできない(多くのブラウザ、chrome、Edge or IEとか…)からです。Microsoft Office関連のアプリはうまいこと描画できている気がします。Windowsを普段から使っている人からするとmacOSのフォントは少し太く感じるはずです。最近はWindowsでも高DPIで使うことも多くなっているので、少しは改善されているはずです。ちなみにWindowsにはヒラギノフォントはついていないので、株式会社SCREENグラフィックソリューションズ(大日本スクリーン製造の子会社：スクリーングループ)から購入する必要があります。自分は25年くらい前に購入したものですが、W1(200),W3(400 標準), W4(500), W5(600),W6(700 bold相当)を持っています。すっげ、高かったっすけど、小さいフォントではあまりきれいじゃない。意味わかんねぇ。Windowsでは使うなと言っておいて欲しかった。でも自己満足な場面では、フォントサイズを少し大きくして使いますので、美しいフォントが使えるし、よしとします。

　ちなみにこちらから購入出来ます。だいぶ安くなったような気がします。昔は別売りで1書体が2万円くらいしていたきがします。

　ヒラギノ基本セット

　このようにWindowsにヒラギノを取り入れようと躍起になっていた時期があり、ヒラギノが最高のフォントだと思っていましたが、最近はそうでもないかなと思うようになりました。今更？例えば、BIZ UDPゴシックやメイリオなんかは、Windowsユーザにとってはヒラギノよりもいい感じかなと感じることもあります。

　Biz UDPゴシックも美しいフォントの一つでなんなら、ヒラギノを超えてるような気もする。Windows10でモリサワが提供し、採用されたフォント。実に素晴らしい。この段落はBiz UDPゴシックで書かれているのでWindows10ユーザなら、美しいフォントが表示されているはずです。

　ヒラギノ角ゴシック W4も美しいフォントの一つで管理人が最も愛する中途半端な太さの設定のフォント。太くもなくほそくもなく、ヒラギノ角ゴ Pro,ProN,Std,StdN,Pr5,Pr6いわゆるW3相当の美しさを超えてるような気もする。大日本スクリーン製造=株式会社スクリーングラフィックソリューションズが提供し、モリサワで販売されるフォント。実に素晴らしい。この段落は「ヒラギノ角ゴシック W4」で書かれているので、マニアックなユーザなら、このフォントの美しいフォントが表示されているはずです。そんな人はおらんか…

　メイリオも美しいフォントの一つでなんなら、ヒラギノを超えてるような気もする。Windows7くらいでMicrosoftが提供し始めたフォント。実に素晴らしい。この段落は「メイリオ」で書かれているのでWindows7～Windows10ユーザなら、美しいフォントが表示されているはずです。

　Consolas＋Meiryoはプログラミングをするときに見やすくてわかりやすい等幅フォントで、管理人も愛してやまないフォントです。改造されたMeiryo等幅とConsolasというゼロに斜め線が入ったフォントの合わせ文字で、FontLinkというWindowsの仕組みを使うものです。メイリオ等幅はMeiryoKeで検索して出てくるサイトから等幅へ変換する実行ファイル群を入手して説明書のとおりにやると良いでしょう。20-09-03時点ではメイリオフォントのバージョンは0.63なので、それに対応した変換ファイルを使うと良いです。バージョンの調べ方ですが、メイリオフォントファイルを右クリックして表示されるコンテクストメニューのプロパティを選択して表示されるダイアログの詳細タブからメイリオのバージョンを確認できます。配布予定のWindows10 Version2004ではメイリオのバージョンが0.65に上がる予定なのでその場合には650の変換実行ファイルを使うと良さそうです。レジストリでuser_local_machine¥software¥Microsoft¥Windows NT¥CarrentVersion¥FontLinkに「Consolas」という複数列文字列キーを新たに作成し「MeiryoKe630r1.ttc,MeiryoKe_Console」とすることでConsolasの字体が不足しているところに「等幅のメイリオ、MeiryoKeXXXr1.ttcの中のフォント名MeiryoKe_Console」が割り当てられる仕組みです。このレジストリ変更は、再起動をしないと有効には機能しません。導入している人がいくらかいるようなモノです。for(int i = 0; i < n; i++){ function(i); }とかも見やすい。フォントは「Consolas」を選択するだけです。

フォントリンクの仕組み説明Powered by Microsoft

　等幅フォントのConsolas＋メイリオの合字フォントが最強かなと思います。このフォントを持っている人は少ないと思うので、サンプルは作っても意味がないと思いますが上記のように少し書いておきました。

　購入したヒラギノゴシックは「ヒラギノ角ゴ5」のようなフォント名なので、一般には使われることはありません。Web閲覧用としては、このままだと、あまり役に立ちません。自分はフォント名を調整して使っています。

　実際の見え方は以下の通りになっています。

オススメのフォント達の見え方

　このYonewikiではWindowsでヒラギノフォントを持っている人向け(希少な方達)にfont-weightを500にしたり、フォントサイズそのものも110%程度で表示されるように設定しています。なのでmacOSやiOSを使っている人からすると少し文字が大きいように感じると思います。

　高い値段のフォントを買った痛みがあるからこそ、フォントに無駄にこだわりが有ったりする。最初はヒラギノ買ったのになんか違う。しまった！と泣いていました。物凄い価格ですよ。なのにWebではうまく表示できない感じで辛かったです。なんだよ千都フォントって！なんか、まがいもんかコレと思ったりした時期もあります。千都フォントシリーズの中のヒラギノなので千都フォントと呼ばれるときのヒラギノも同じものです。千年の都、京都と京都府内にあるにある柊野という地名からそれぞれ命名されています。当時そういう当たり前のことが簡単には調べれないような時代でした。

Windows10のフォントファイルの仕組み

　10年以上前からWindowsを使っている人はフォントファイルなんてC:\Windows\Fontsにコピペするだけだと思っている人もいるかもしれませんが、単純にFontsフォルダで貼り付けをした場合は、C:\Windows\Fontsフォルダの中にファイルが作成されるわけではありません。実際はC:\Windows\Users\[userid 長い場合は5文字の半角英数字になっています。]\\AppData\Local\Microsoft\Windows\Fonts\ の中にファイルが作成されます。管理者権限でない方法でインストールされた場合は、個人ユーザフォルダ用として用意されたFontsフォルダにファイルが貼り付けられます。フォントファイルを開いたときに表示される、いわゆるプレビューウィンドウの左上にあるインストールボタンおしてインストールを実施した場合も同じです。

　ではどうやったら全ユーザ向けにインストールが出来るかというと、フォントファイル(.otf/.ttf/.otc/.ftc/.fon)を右クリックして表示されるコンテクストメニューで「管理者としてインストールを実行する」を選択するとC:\Windows\Fontsにファイルがコピーされて全ユーザが使うことが出来る状態になります。

　間違えてインストールしたけど消したいフォントがあるときに何かのファイルが使っていて消せないというパターンが発生します。実際に自分もかなり困りました。ありがたいことに、こういったケースに対応するためのアプリがありまして、株式会社武蔵システムさんが無償でDelFontというアプリケーションを提供してくれています。

　以下より入手できます。

https://opentype.jp/delfonttool.htm

フォント情報

インストールされているフォントの英語名の調べ方

Windowsパワーシェルで

[reflection.assembly]::loadwithpartialname("system.drawing")

foreach( $ifc in ( new-object System.Drawing.Text.InstalledFontCollection ) ){$ifc.Families|%{$_.Name+"`t:`t"+$_.GetName([System.Globalization.CultureInfo]::GetCultureInfo("en-us").LCID)}}

を実行すれば一覧が得られます。

フォントファミリ

　フォントファミリは例えばヒラギノで言えば「ヒラギノ角ゴ ProN」のような表記です。英語版だと「Hiragino Kaku Gothic ProN」ですね。

　似たものにフルネームというのがあります。ここで太さー等幅、斜体、装飾、のような指定まで含めた名前を付けます。「ヒラギノ角ゴ ProN W3」とかになります。ファイル名・フォント名は通常PostScriptIDと同じ値を付けます。「HiraKakuProN-W3」とかです。ウェイト情報「W3」とかを指定しておくとソフトウェアが太さを選択できる構造になっている場合、この名前が使われます。スタイルは通常は「Regular」日本語では「標準」あるいは太字フォント、700 Bold　というウェイトクラスの場合には「Bold」日本語では「太字」を設定します。これは極太のときとかは「Bold」にはしません。「Regular」にして、特別な太字としておく必要があります。よくアプリケーションなんかにある太字を押したときに極太が太字扱いになってしまいます。斜体文字なら「Italic」日本語では「斜体」を設定します。合わせ技の「Bold Italic」日本語での「太字斜体」とかも設定していいです。これらの情報はOS/2という情報エリアにも設定する必要があります。自分で作る場合にはベンダIDとかは、取得していないはずなので適当な値でよいでしょう。もし本格的に配布する場合は申請をする必要があります。ユニークIDというのもつけますが、これはファイル名・ポストスクリプト名と同じでよいでしょう。あとは商標や著作権情報は必要な時には指定して下さい。言語ロケール毎に同じ情報を設定できますが、UniqueIDは一つの言語だけで英文字の設定をするとよいと思います。

フォントファミリStd/Pro/Pr5/Pr6　StdN/ProN/…

　よく見かけるこのようなフォントファミリにつけられた記号はAdobeが定めた文字セット区分を意味しています。N付きN無しはJIS90とJIS2004字形という区分で、ある同じ文字でも違うカタチになる区分けです。ちなみにNが付いていなくてもN付き扱いになっているフォントも多く

ＭＳＰゴシック
ＭＳゴシック
MS UI Gothic
ＭＳＰ明朝
ＭＳ明朝
メイリオ

では、JIS2004字形になっています。どちらかと言うとJIS90の方が親しみのある漢字字形で、辻のような漢字がJIS2004字形フォントなら2点しんにょうという感じの部首になります。JIS90フォントは普通の1点のしんにょうです。名前にもよく使われる漢字がJIS2004によって改変された人は嫌な思いをしているのかもしれないです。でも本来は2点しんにょうが正しいのがほとんどらしくて、1点しんにょうは、正しくないものの、かなり広く普及したものになりました。でも、そんな実情をしらない大手のフォントは、正しいとされている2点しんにょうをベースにフォント開発をしてしまったために、今更、1点しんにょうが正しいから、こっちに直せとはいいきれなくなってしまってN付きが主流となる方向性になったようです。実はこのような変化を遂げた漢字は多く。168+10文字あるそうです。N無しの方が親しみがある漢字で古くて間違っていると覚えておくといいかもしれません。

　それでStdとかの区分は収録文字数で日本語についてはAdobe-Japan1の後ろに-1～-6(7も作られるとかいう噂も)と区分けがあります。

Std Adobe-Japan1-3　9,354文字
Pro Adobe-Japan1-4　15,444文字
Pr5 Adobe-Japan1-5　20,317文字
Pr6 Adobe-Japan1-6　23,058文字

　こういうことらしいです。Pro以上は名前の通り活字を生業としている世界で必要とされる字体が収録されているだけで、一般人にはあまり関係しないところです。フォントを販売している会社が提供するPro以上のフォントファミリの価格はStdよりも高価です。イメージでいうと1万5千円が3万円になるような感覚です。これが太さ毎に別売りだったりして、全部買うと10万超えというフォントファミリも少なくない印象です。最初からフォントが搭載されているOSのありがたさ。噛みしめてもいいと思います。誰かが大変な思いをして紡いだ文字だから。

フォントファミリのUD/P…

　UDあるいはUが付けられたフォントはユニバーサルデザイン対応を意味しています。視力があまり良くない人でも勘違いしにくいような字体の工夫がされていて6と8の繋がり部分が明らかにずれていて区分けしやすかったりとそういう工夫がされているモノです。健康なうちはあまりありがたみが無いように感じますが、間違いが減らせる工夫がされているという意味においては万人に恩恵をあたえる仕組みです。だからユニバーサルなんだけど…。

　それからPはプロポーショナルのPでProportional、その反対はMでmonospaceいわゆる等幅です。日本語の分野においては、英字などのアルファベット文字が半角で全角の2分の1になっていることも含めて等幅とされていますが、多言語の視点で言えば、そのような2種類の文字の送り幅があるのはmonospaceとは言えないとされています。日本では等幅扱いなのであまり気にする必要もないかもしれません。それからプロポーショナルはVAのような文字がとなり合わせになったときに文字の間隔を文字幅を超えて狭くすることで美しい配置になるパターンがあるのを対応したものです。Webの文章なんかは基本的にプロポーショナルフォントが見やすいと思います。Excelやプログラムといった一定の文字間隔であるほうが可読性が高まる分野で等幅フォントを使います。その中間のSがあったりもします。全角文字が等幅で半角文字だけプロポーショナル。HGリコーの場合は何もなしが等幅、P付きがプロポーショナル/S付きの中間。ダイナコムはGがSの意味だったりします。各社色々なルールがあるようです。

　あとはフォント制作をした社名を現す記号ですね。

MS = マイクロソフト
HG = リコー
DF = ダイナコム(ダイナフォント)※管理人が初めて購入したフォントパック。
A-OTF = モリサワ
BIZ = MORISAWA BIZ
FOT = フォントワークス
I-OTF = イワタ

ウェイト

　フォントの太さの目安としてウェイトが設定されます。ソフトウェアによっては同じフォント名の中にあるウェイト別のフォントをUIで選択できるものがあります。上にあるほど細く、下にあるほど太いです。

EL Extra Light
L Light
R Regular
M Midium (ミディアムメデューム)
DB Demi Bold
B Bold
H Heavy
U Ultra

　どれが何ポイントの太さかとか明確な基準はありません。

　他にも、細W1～W8太、のような分類や太さを横線の幅(縦)と縦線の幅(横)別に数字であらわした510(5、10)、518(5,18)、37(3,7)のような表記もあります。

　上記のような情報をウェイト情報に持たせることでフォントファイル名が異なっても同じファミリ名を指定していれば、それぞれのウェイト別のフォントとして一つにまとめられて扱われ、特定のアプリケーションでは、フォント名を選択した後、このようなウェイト情報毎の選択をするUIが与えられ、そこで切り分けられます。

　このような文字の太さの区分けは似たようなフォント情報に、スタイル名として付与されることもあります。よく見かけるフォント名の後ろについている標準というのがスタイル名です。フォントフォルダではスタイル名もフォント名の後ろに続けて表示されます。言語別にスタイル名が存在していて、Regularに対応するのが標準です。Boldが太字とか太とか、Heavyが極太とかでしょうか。

Ultra Light
Extra Light
Light
Regular
Demi Bold
Bold
Heavy
Black
Extra Bold
Ultra Bold

　のような区分けに斜体を現すItalic、通常書体を現すことを強調するRoman、幅広のCondensed、幅が狭いExtended。

　同じフォントシリーズとして存在するスタイル区分として袋文字のOutline、影付きの文字のShaded、線がフォントの内側が空洞になるように描かれたInlineのような装飾。ウェイトとスタイル名の使われ方は多種多用です。ファイル名は違ってもファミリー名が同じなら一つのフォントとして扱われ、太さやスタイル名ごとに異なるフォントが使えるという感じです。

　こういったフォントウェイトのならわしにに沿った形で、

　実際には、フォント情報の中のウェイトクラスで9段階の分類を指定します。

100 Thin 極細
200 Extra Light 中細
300 Light 細字
400 Regular 標準 (W3 Hiraginoの場合)
500 Medium
600 Semi Bold
700 Bold 太字 (W6 Hiraginoの場合)
800 Extra Bold
900 Black

　FontForgeの場合は「エレメント」ー「フォント情報」の「OS/2」カテゴリのウェイトクラスで指定します。

　OS/2はIBMのオペレーティングシステムで、登場した頃に策定されたフォント規格情報という意味です。

UNICODE Webにおけるフォント一覧サンプル

　フォントにはカラーフォントやアニメーションフォントが登場しています。OpenType SVGやMicrosoftのFontレイヤー概念を導入したOpenTypeにCOLR Color Table、GPOS Table、kern Table、CPAL、DSIG、metaを活用したものがあります。これらはIMEフォント一覧では白黒になってしまうので、実際にはEdgeなどの対応ブラウザで閲覧して確認する必要があります。macOSならカラーフォントを一覧できそうな気がします。持ってないのでわからないです。

　以下のHTMLでSegoe UI EmojiのUnicodeフォントの中身を確認できます。PCにフォントがインストールされていればですが。HTMLをダウンロードして先頭にあるフォントファミリー指定を変更すると自分のPCでフォントを確認することができます。必要であれば使ってください。フォントに存在しない文字がある場合は、システムフォントが使われますので、全部が全部、Sugoe UI Emojiではないことをお忘れなく。フォントマップについてはIMEパッドで確認するといいでしょう。

　開くのにはかなり負荷がかかりますので、創作活動中で保存していないファイルがある状態では開かない方がよいと思います。開こうとしてPCが落ちる場合はマシンスペック的な問題です。対策をとってから再挑戦してみるか、諦めましょう。自分にちょうどいい奴を作るとよいと思います。