約物専用Webフォント（約組フォント）

概要

約物専用のWebフォントの約組フォント/Yaku Kumi Fontsを公開しました。全角の約物（句読点や括弧のこと。）が連続したときのアキを調整するWebフォントです。AndroidのNoto CJK Fontsをサブセットすることで作成されているので、シェア率が非常に高いNoto Sans JPとの組み合わせが良いです。

CDNで公開しているので利用方法を参考にして、自分のブログで使ってみてください。ちなみに、このブログでも使っていました。今は、Catalpaでも使われてる方法で、無理やりアキを調整しています。

はじめに

Webページを作るとき、下の表みたいに、括弧や句読点などの約物が連続したときのアキ（空白）が気になりませんか？Yaku Kumi Fontsを使えばこの問題が解決できます。

Family
Noto Sans JP
Yaku Kumi Sans, Noto Sans JP

このようなフォントはFONTPLUSにもありますが、有料なのでブログなどで手軽に使うのは難しいです。約味フォントは無料で公開されていますが、オリジナルグリフであるため、Noto Sans JPとの相性がいまいちです¹。

Yaku Kumi Fontsはもちろん無料で使えて、見ての通りNoto CJK Fontsと同じグリフになっています。Noto Sans JPを利用している人にはすごくオススメできます。

Noto CJK Fontsと同じグリフで、約物のアキを詰めるYaku Han JPはすべてのアキが無くなるので、組版要件を考えるといまいちです。それに約物を半角にするだけなら

font-feature-settings: 'halt' 1;

すればいいです。

ということで、Yaku Kumi Fontsを使いましょう！

対応文字

Yaku Kumi FontsはSansとSerifがあります。また、Google FontsのNoto Sans/Serif Japaneseと同じWeightがあります。収録フォントは以下の通りです。

、，。．・：；（）｟｠「」『』［］〚〛｛｝【】〖〗〈〉《》〔〕〘〙

利用方法

下の表の7つのCSSを用意しました。このブログでは基本的にSansのNormal/Regular–400とBold–700しか使わないので、yakukumi-sans-rb.min.cssを読み込んでいます。

CDNを使う場合は、次のようにCSSを読み込んでください。利用したいCSSに合わせてyakukumi-sans-rb.min.cssを編集してください。

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/daiji256/yaku-kumi-fonts@v1.1/css/yakukumi-sans-rb.min.css"
/>

CSSはfont-familyを設定し、chwsをオンにしてください。フォント名はSansを使うなら"Yaku Kumi Sans"、Serifを使うなら"Yaku Kumi Serif"とします。

font-family: 'Yaku Kumi Sans', 'Noto Sans JP', sans-serif;
font-feature-settings: 'chws' 1;

ライセンス

Yaku Kumi FontsはNoto CJK Fontsを元に作成されているので、ライセンスはSIL OFL 1.1です。CSSなどはMITライセンスです。

バージョン履歴

• v1.0: 初公開（ウェイトが足りていないため現在非公開）
• v1.1: ウェイトの修正
• v1.2: 収録フォントを追加

文献

1. 約組フォント/Yaku Kumi Fonts
2. Noto Sans JP
3. Noto CJK full weight patch for Android devices
4. FONTPLUS
5. 約物Webフォント「約味」（YakuAdj）
6. Yaku Han JP
7. Catalpa
8. 約組フォント/Yaku Kumi Fonts-約物専用Webフォント