日本語Webフォントの革命
日本語Webフォントに革命がおきた.
詳しくは続きを読んでくれ.
ちょっと大きく出てみた.
実装についての記事はこちら
この記事で言いたいこと
動的に日本語フォントのサブセットを作成してくれるOSSを作りました.
サンプルページはこちら
臨時のサンプルページはこちら
追記 herokuが落ちてる,メモリ不足だな.早い所Dockerfileつくろう.
追追記 herokuで運用は再検討したほうがよさそう.「こういうこともできます」の事例ということでひとつ.
(やっぱり普通のサーバで動かす分には大丈夫そうな気がする.どうだろう)
そんなわけで,どうぞご利用ください。
(ちなみに粗い作りなので,pull-requestやissue投稿をしてくださると嬉しいです.)
何が革命なんだ
革命が起きたというけど,どこが革命なの? 僕には革命が起きたようには思えないけど
そんなこと言わんといて,泣くわ.
革命云々はともかく,今までにないシステムと自信をもってリリースします.
とにかく 導入しやすく,しかも無料 に尽きます.
使い方は,
<script src="//cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.6.0/CustomElements.min.js"></script> <script src="//japont.herokuapp.com/japont.js"></script> <meta is="web-font" src="mplus/mplus-1p-light.woff" selector="article"/>
3行貼り付ける.こんだけ.
Webフォントのサブセット化をやったことある人なら,驚くと思います.(どうですか
もちろんサーバを用意する必要がありますけど,そこは流行りのHerokuさんですよ!
Githubのボタンを押して,ちょっと入力するだけで完了!!
サーバに関する専門的な知識は不要.cliとか何それで全然大丈夫!
フォントのライセンスについて
書き忘れてた.深夜に書くのは良くない
ライセンスについては,配信されるCSSに記載されるようになっています.
改変可能(サブセット化),再配布可能(配信)のフォントのみを収録しています.
フォントについては,各フォントのライセンスに準じます.
IPAフォントライセンスの場合は,同等のフォントが生成できるように案内を付しています.
ちょっと長い駄文(Webフォントの歴史・読まなくていい)
君はWebサイトを作ったことはあるだろうか.
CSSを触ったことある人は,font-family
をいじったりしたことがあるだろう.
font-family
を使えば,自分の好きなフォントを使って文字が表示できる.
ただし,閲覧するPCにインストールされているものに限る
さらに言うと,インストールされたフォントの一覧は取得できない.
こんな機能に意味はあるのだろうか.
これが昔の世界.
いまやCSS3の時代である.
昔の偉人はこう言ったそうです.
インストールされていないなら,インストールすればいいじゃない!
さて,それが真実かはさておき,Webサイトのフォント問題への解決策ができたわけです.
それが,Webフォントです.
これでWebサイトで好きな文字が使えるようになりました.
一応.
実はまだ問題を抱えていました.
みなさん,世界に文字は何種類あるでしょうか.
そうです,膨大に存在するのです.
アルファベット26文字しか使わない海の外の人たちには,気づかないような盲点です.
しかし,我々は日本人.26文字では事足りません.
もちろんフォントデータをすべて送れば表示されます.
ですが,フォントデータのサイズが膨大で表示までに時間がかかりすぎます.
頭のいい人は考えました.
サイズが大きければ,小さくすればいいじゃん!
私でも思いつきます.
使う文字だけ抽出して送ればいいんだよ!
私には思いつきそうにありません.凄いです.
そこで生まれた技術が サブセッティング(サブセット化) です.
こういうツールを使うと,文字を抽出した軽量なフォントデータがつくれます.
これで問題は解決しました.めでたしめでたし.
人というのは,満たされるとさらに欲求が増す生き物です.
もちろんこれでは満足しませんでした.
どうして作らなくてはならないのか.勝手にやってくれればいいのに.
特にブログとかに使う場合は,毎回作るのはとてつもない手間です.
そこでサイトの文字を分析して自動でサブセッティングしてくれる技術が生まれました.
それが,ダイナミックサブセッティングです.
Webフォントをダイナミックサブセッティングで販売している会社もあります.
参考: 国内のWebフォントサービスまとめ - フォントブログ
これですべて解決です.
ところがどっこい,3846masaは満足しませんでした.
3846masaという輩は,とかくケチで無料で済ませたがります.
世の中タダより高いものはないというのにね.
さて,何のことかというと「ダイナミックサブセッティングは企業が有料でやっているのがほとんど」ということです.
もちろん無料のものもあります.
でも,3846masaは満足がいきませんでした.
自分の好きなフォントで好きなようにWebサイトを組みたい.
そこで3846masaは,ダイナミックサブセッティングのOSSを作り始めました.
その結果,完成したのが Japont なのです.
技術のお話
長くなったので,また今度.
追記 書きました.
追伸
夜中のテンションでブログは書いちゃダメだ.長くなるし訳わからん.
このブログ記事は予約投稿です.