バリアブルフォント
(Variable Font から転送)
出典: フリー百科事典『ウィキペディア（Wikipedia）』 (2026/04/03 13:08 UTC 版)
バリアブルフォント (variable font) は、OpenType 1.8で追加された仕様拡張である[2][3]。2016年9月14日にアドビ、Apple、Google、マイクロソフトによって発表された技術であり、単一のフォントファイルでほぼ無限のスタイルを利用可能とする[4][5][6][7]。デザイナーが字幅、傾斜、太さ、セリフの形状などの各種パラメータを設定すると、その指定に応じて描画エンジンがテキストを生成する仕組みとなっている。
本技術は、AppleのTrueType GXをOpenType向けに適応したものであり、OpenTypeレイアウトテーブルや、TrueTypeおよびCFF形式のグリフアウトラインなど、OpenTypeフォーマットの主要機能が統合されている。
歴史
バリアブルフォント技術の開発は1990年代に始まった。1991年にアドビがマルチプルマスターフォント (multiple master fonts) を発表し、後にAppleがTrueType GXを発表したが、両社を含む諸企業間の競争やその他の要因により、これらの技術が広く普及することはなかった[8][9]。
2013年頃、マイクロソフトが独自の開発に乗り出した。同社は2015年にAppleの協力を得て、TrueType GXの技術をOpenTypeに統合する作業を進めた。2016年1月、Googleの開発者であるベーダッド・エスファーボッドが独自に「OpenType GX」の提案を公開したことで、後にマイクロソフトとAppleの開発チームが彼に接触した。同年2月にはアドビもこの企画に参加し、結果としてマイクロソフト、Apple、Google、アドビによる共同開発が開始された[8]。
2016年9月14日、ワルシャワで開催された第60回国際タイポグラフィ協会 (ATypI) シンポジウムにて、OpenTypeバリアブルフォントはOpenType 1.8の一部として正式に発表された[10]。
技術
本技術は、フォント開発ツールで長年サポートされ、書体デザイナーによって利用されてきた補間 (interpolation) および外挿 (extrapolation) のメカニズムを用いている[11]。従来の設計手法では、書体デザイナーがバリエーションのセットを作成したのち、そこから特定のインスタンス（個別のフォント）を抽出して静的フォントを生成し、それをユーザーに提供していた。しかし、バリアブルフォントにおいては、デザイナーが作成・配布するフォント自体に可変性を組み込むことができる。補間メカニズムはオペレーティングシステムやウェブブラウザ、その他のアプリケーションに直接組み込まれるようになり、ユーザーの使用時にスタイルが動的に生成・選択される仕組みとなっている。
本技術の主要な利点の一つは、複数のスタイルを使用する際に、ファイル全体のデータサイズを大幅に削減できる点である。これにより、ウェブサイトにおいてはページの読み込み時間を短縮しつつ、より多くのスタイルを使用することが可能となる。また、レスポンシブデザインに有用な、多種多様なスタイルのバリエーションを利用できることも大きな利点である[12]。
この技術は、1990年代に登場したアドビのマルチプルマスターフォント（multiple master fonts、MMフォント）技術としばしば比較される。MMフォントも同様に、マスターファイルから補間と外挿によってフォントスタイルをオンザフライで生成するものであった[13][14][15][16]。しかし、MMフォントを使用するには、ユーザーが事前にAdobe Type Managerなどのソフトウェアを用いて、特定のバリエーション軸値に対応するインスタンスを生成する必要があった。OpenTypeバリアブルフォントではこの事前作業は不要であり、指定された、あるいは任意のフォントスタイルが必要に応じて即座に選択・使用される。
バリエーション軸
バリアブルフォントの仕様に組み込まれた標準のバリエーション軸 (variation axis) は次の5種類である[17][18]。
| タグ | 機能 |
|---|---|
wght |
太さ (weight) |
wdth |
字幅 (width) |
slnt |
傾斜角 (slant) |
ital |
イタリック (italic) |
opsz |
オプティカルサイズ (optical size) |
これらの登録済み軸 (registered axis) に加え、フォントデザイナーは独自のカスタム軸 (custom axis) を作成・実装できる。これによりセリフの長さ、大文字や小文字の高さ（エックスハイト）、アセンダーやディセンダーの高さ、コントラスト、あるいは装飾要素全般を変化させることが可能である。例えば、長文の本文組版には低コントラストのバリエーションを用い、大きな見出しには高コントラストで細部を強調した書体を適用するといった調整が可能となる。特にAppleは、自社のOSやウェブサイトにおいて自社書体「New York」でこの特性を活用している[19]。
対応状況
オペレーティングシステム
マイクロソフトは、Windows 10 バージョン1709（通称Fall Creators Update）において、Windows初のバリアブルフォントとしてDIN 1451をデジタル化した「Bahnschrift」を導入した[20][21]。しかし、OpenTypeアウトラインを用いたCFF2フォントのサポートによりWindowsのテキストレンダリングエンジンに不具合が生じ、ユーザーインターフェースのテキストが表示されなくなる問題が一部で発生した。この問題は、2023年の更新プログラム (KB5032278) により修正された[22]。
Androidは、Android Oreo[23]（APIレベル26[24]）においてモバイルアプリ開発者向けのバリアブルフォントサポートを追加した。
Appleは、自社のオペレーティングシステムにおいてMac OS X v10.5およびiPhone OS 3.2[25]からバリアブルフォントをサポートしているが、WebKitを介したSafariでの利用に対応したのは、macOS High Sierra (10.13) およびiOS 11 (Safari 11) 以降である[26][27]。
Linuxをはじめとする多くのUnix系システムで採用されているフォントレンダリングエンジンFreeTypeは、2017年5月 (FreeType 2.8) にバリアブルフォントのサポートを追加した[28]。
エディタ
2017年10月18日にリリースされたAdobe Creative Cloud 2018では、Photoshop[29]およびIllustrator[30]でバリアブルフォントがサポートされ、Acumin、Minion、Myriad、Source Code、Source Sans、Source Serifの各バリアブルコンセプト版フォントが同梱されている。Creative Cloud 2020では、InDesignでのバリアブルフォントのサポートが追加された[31]。
Inkscapeでは、バージョン1.0でバリアブルフォントのサポートが追加された[32]。
LibreOfficeでは、バージョン7.5でバリアブルフォントのサポートが追加された[33]。
Sketchでは、バージョン59よりバリアブルフォントが利用可能となっている[34]。
ブラウザとその他のプログラム
ウェブブラウザにおけるバリアブルフォントの制御には、ウェイトのような既知のパラメータに対する既存のプロパティと、基本となるプロパティfont-variation-settingsの両方が用いられる。CSSプロパティのサポート状況の履歴については、MDNのウェブサイトを参照のこと[35]。
Qtフレームワークおよび統合開発環境 (IDE) であるQt Creatorは、それぞれバージョン6.7および13以降でバリアブルフォントをサポートしている[36]。
脚注
- ^ ArrowType. “Recursive Sans & Mono” (英語). recursive.design. 2024年4月26日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ Phinney, Thomas. “Variable Fonts Are the Next Generation”. Communication Arts (英語). 2017年9月21日時点のオリジナルよりアーカイブ. 2017年9月20日閲覧.
- ^ Phinney, Thomas. “The Lesson of Color Fonts for Variable Fonts”. thomasphinney.com (英語). 2017年9月21日時点のオリジナルよりアーカイブ. 2017年9月20日閲覧.
- ^ “Introducing OpenType Font Variations” (英語). www.microsoft.com. 2017年11月5日時点のオリジナルよりアーカイブ。2017年11月9日閲覧。
- ^ “CSS Fonts Module Level 4” (英語). drafts.csswg.org. 2017年11月7日時点のオリジナルよりアーカイブ。2017年11月9日閲覧。
- ^ Nieskens, Roel. “Variable Fonts: the Future of (Web) Type”. Typographica (英語). 2021年1月15日時点のオリジナルよりアーカイブ. 2016年10月31日閲覧.
- ^ Hudson, John. “Introducing OpenType Variable Fonts”. Medium (英語). Tiro Typeworks. 2018年1月30日時点のオリジナルよりアーカイブ. 2016年10月31日閲覧.
- ^ a b “The Type — 参数化设计与字体战争：从 OpenType 1.8 说起” (中国語). The Type. 2021年2月23日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Part 1: from TrueType GX to Variable Fonts. | Monotype.” (英語). www.monotype.com (2016年11月29日). 2024年4月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “The Typekit Blog | Variable fonts, a new kind of font for flexible design” (英語). blog.typekit.com. 2020年10月27日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ Griscti, Jessica (2012年11月9日). “Jess Loves Interpolation | Alphabettes” (英語). 2024年4月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Optimizing typographic space with variable fonts – Fonts Knowledge” (英語). Google Fonts. 2024年4月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ Designing Multiple Master Typefaces. San José: Adobe Systems. (1997). オリジナルの2005-01-28時点におけるアーカイブ。 2017年9月20日閲覧。 アーカイブ 2015年7月6日 - ウェイバックマシン
- ^ Riggs, Tamye. “The Adobe Originals Silver Anniversary Story”. Typekit blog (英語). Adobe. 2015年7月13日時点のオリジナルよりアーカイブ. 2015年7月2日閲覧.
- ^ “The Adobe Originals Silver Anniversary Story: Expanding the Originals” (英語). Typekit. Adobe Systems. 2015年12月17日時点のオリジナルよりアーカイブ。2016年1月8日閲覧。
- ^ Phinney, Thomas (2010年3月18日). “Font Remix Tools (RMX) and Multiple Master Fonts in type design” (英語). Phinney. 2021年2月24日時点のオリジナルよりアーカイブ. 2015年7月4日閲覧.
- ^ “Вариативные шрифты: что это и как использовать?” (ロシア語). 2021年11月17日時点のオリジナルよりアーカイブ。2021年11月17日閲覧。
- ^ “registered-axis-tags” (ロシア語). 2021年11月17日時点のオリジナルよりアーカイブ。2021年11月17日閲覧。
- ^ “Typography” (英語). Apple Developer Documentation. 2024年4月22日閲覧。
- ^ “Introducing the Bahnschrift font” (英語). Windows Blog. Microsoft. 2017年9月5日時点のオリジナルよりアーカイブ。2017年8月28日閲覧。
- ^ Protalinski, Emil. “Microsoft releases new Windows 10 preview with shell, Edge, and input improvements”. VentureBeat (英語). 2017年8月28日閲覧.
- ^ “Source Han Sans CFF2 VF (or any CFF2 font) causes Windows text rendering to blank out (Windows 10 and 11) · Issue #290 · adobe-fonts/source-han-sans” (英語). GitHub. 2024年3月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Using Built-in Variable Font on Android - 回音的博客” (英語). echo.moe. 2024年4月21日閲覧。
- ^ Franks, Rebecca (2018年5月2日). “Variable Fonts in Android O 🖍” (英語). Over Engineering. 2024年3月27日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Variable Fonts – Support” (英語). v-fonts.com. 2024年5月24日時点のオリジナルよりアーカイブ。2024年3月21日閲覧。
- ^ “CTFontDescriptorCreateCopyWithVariation” (英語). Apple Developer Documentation. 2024年3月21日時点のオリジナルよりアーカイブ。2024年3月21日閲覧。
- ^ “New WebKit Features in Safari 11” (英語). WebKit (2017年9月22日). 2017年9月30日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “FreeType 2.8 Completes OpenType Variation Fonts Support - Phoronix” (英語). www.phoronix.com. 2022年6月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “New features summary | October 2017 release of Photoshop CC” (英語). 2020年6月19日時点のオリジナルよりアーカイブ。2017年10月19日閲覧。
- ^ “New features summary | October 2017 release of Illustrator CC” (英語). 2012年10月20日時点のオリジナルよりアーカイブ。2017年10月19日閲覧。
- ^ “What's New with InDesign 2020? | CreativePro Network” (英語) (2019年11月4日). 2020年8月9日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Introducing Inkscape 1.0” (英語). inkscape.org. 2020年5月5日時点のオリジナルよりアーカイブ。2020年7月1日閲覧。
- ^ “LibreOffice 7.5: Release Notes” (英語). The Document Foundation's Wiki. 2023年2月5日時点のオリジナルよりアーカイブ。2023年2月3日閲覧。
- ^ “Sketch — Variable Fonts, improved OpenType support, and a new Data plugin — What’s new in Sketch?” (英語). web.archive.org (2021年4月19日). 2021年4月19日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Variable fonts guide - CSS: Cascading Style Sheets | MDN” (英語). developer.mozilla.org (2023年11月16日). 2024年4月21日時点のオリジナルよりアーカイブ。2024年4月21日閲覧。
- ^ “Future text improvements in Qt 6.7” (英語). www.qt.io. 2024年4月22日時点のオリジナルよりアーカイブ。2024年4月22日閲覧。
外部リンク
- Variable Fontのページへのリンク
