itouhiroはてなブログスマートフォン用の表示で見るitouhiroはてなブログこの広告は、90日以上更新していないブログに表示しています。2014-05-11フリーフォントのサブセットを作り、Webフォント化Fontフリーフォントのサブセット(部分集合、つまり特定の文字だけを含むことで軽量化したフォント)を作り、Webフォントにする方法を説明します。FontForgeを使用して、フリーフォントであるM+フォントのサブセットを作るには私は以下の手順を取りました。M+フォント以外のフリーフォントにも、この手順を使うことができます。使用したい文字をすべて含んだテキストファイルをUTF-8で保存。通して、収録文字リストを作成。通して、FontForgeスクリプトを作成。FontForgeでフォントを読み込み、FontForgeスクリプトを実行する。WebOpenFormatFont]でwoff保存。使用したい文字をすべて含んだテキストファイルをUTF-8で保存。Webフォントに含めたい文字の入った文章を用意します。桃園の巻」http://www.aozora.gr.jp/cards/001562/card52410.htmlを使ってみます。ダウンロードして展開。文字コードがShift_JISなので、UTF-8に変換して再保存。通して、収録文字リストを作成。char.txt生成されたchar.txtは割と大きなファイルになってしまった。通して、FontForgeスクリプトを作成。上記のchar.txtをさらにlistCharFF.jsで加工。charFF.txt生成されたcharFF.txtはこんな感じ。SelectWorthOutputting();SelectFewer(0ud7);SelectFewer(0u2015);SelectFewer(0u2026);SelectFewer(0u25cb);SelectFewer(0u3000);SelectFewer(0u3001);SelectFewer(0u3002);SelectFewer(0u3005);SelectFewer(0u300a);....4.FontForgeでフォントを読み込み、FontForgeスクリプトを実行する。mplus-1m-regular.ttf)を読み込みます。スクリプトを実行]で、スクリプト入力画面を出します。[Python]ではなくて[FF]を選択してください。貼り付け]してください。何回かすると貼り付けできます。できたら、[OK]をクリック。30秒ほど待たされました。WebOpenFont]でwoff保存。何か質問されたら以下のように答えます。生成これでwoff出力はOK。ちなみに354KBのファイルになりました。漢字の少ないテキストであれば、woffファイルのサイズが100KB以下になることもあります。画像を用意するよりサイズ小さくてすみますね。テキストファイルに含まれる文字のリストを作る。Webフォントに含める文字をリストアップできる。!′′#$%&′()*+、-。小文字エルを縦棒と区別したい。v0.6をWindowsで使ってみるNode.jsを使ってみたのでその記録。(7)月別アーカイブはてなブログをはじめよう!itouhiroさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。