| 両方とも前のリビジョン 前のリビジョン 次のリビジョン | 前のリビジョン |
| web:web_font [2022/09/23 03:45] – [参考文献] ともやん | web:web_font [2025/04/12 11:14] (現在) – [TrueType(.ttf) から Web Open Font Format(.woff と .woff2) へ変換🤤] ともやん |
|---|
| ===== Web フォントの形式 ===== | ===== Web フォントの形式 ===== |
| ^ 拡張子 ^ 形式 ^ 説明 ^ | ^ 拡張子 ^ 形式 ^ 説明 ^ |
| | .woff2 | [[https://www.w3.org/TR/WOFF2/|Web Open Font Format 2.0]] | [[https://ja.wikipedia.org/wiki/Web_Open_Font_Format|Web Open Font Format (WOFF)]] 2.0 は、Google によるリファレンス実装と共に公開された。フォントの圧縮に [[https://ja.wikipedia.org/wiki/Brotli|Brotli]] を使用するように改善された。 | | | .woff2 | [[https://www.w3.org/TR/WOFF2/|Web Open Font Format 2.0]] | [[wwjp>Web_Open_Font_Format|Web Open Font Format (WOFF)]] 2.0 は、Google によるリファレンス実装と共に公開された。フォントの圧縮に [[wwjp>Brotli|Brotli]] を使用するように改善された。 | |
| | .woff | [[https://www.w3.org/TR/WOFF/|Web Open Font Format 1.0]] | [[https://ja.wikipedia.org/wiki/Web_Open_Font_Format|Web Open Font Format (WOFF)]] は、ウェブページで使用するためのフォント形式である。WOFF は OpenType 又は TrueType 形式のフォントを圧縮し、XMLによるメタデータを追加したものとなっている。 | | | .woff | [[https://www.w3.org/TR/WOFF/|Web Open Font Format 1.0]] | [[wwjp>Web_Open_Font_Format|Web Open Font Format (WOFF)]] は、ウェブページで使用するためのフォント形式である。WOFF は OpenType 又は TrueType 形式のフォントを圧縮し、XMLによるメタデータを追加したものとなっている。 | |
| | .ttf | [[https://ja.wikipedia.org/wiki/TrueType|TrueType - Wikipedia]] | TrueType (トゥルータイプ) はデジタルフォントの規格である。Windows や macOS、Linux で標準的に利用されている。 | | | .ttf | [[wwjp>TrueType|TrueType]] | TrueType (トゥルータイプ) はデジタルフォントの規格である。Windows や macOS、Linux で標準的に利用されている。 | |
| | .eof | [[https://en.wikipedia.org/wiki/Embedded_OpenType|Embedded OpenType]] | Web ページの埋め込みフォントとして使用するために Microsoft が設計したコンパクトな OpenType フォントである。MS IE でのみサポートされる。 | | | .eof | [[wwjp>Embedded_OpenType|Embedded OpenType]] | Web ページの埋め込みフォントとして使用するために Microsoft が設計したコンパクトな OpenType フォントである。MS IE でのみサポートされる。 | |
| |
| * EOT 形式と TTF 形式はデフォルトで圧縮されていない。\\ これらの形式を提供する場合は GZIP 圧縮を適用するように Web サーバーを設定する必要がある。 | * EOT 形式と TTF 形式はデフォルトで圧縮されていない。\\ これらの形式を提供する場合は GZIP 圧縮を適用するように Web サーバーを設定する必要がある。 |
| * WOFF2 では独自の前処理アルゴリズムと圧縮アルゴリズムが使用されており、WOFF 形式よりも約 30% ファイルサイズが削減されている。 | * WOFF2 では独自の前処理アルゴリズムと圧縮アルゴリズムが使用されており、WOFF 形式よりも約 30% ファイルサイズが削減されている。 |
| |
| ===== TrueType(.ttf) から Web Open Font Format(.woff, .woff2) への変換 (Linux) ===== | ===== TrueType(.ttf) から Web Open Font Format(.woff, .woff2) への変換 (Linux)🤤 ===== |
| Linux では sfnt2woff (ttf => woff) と woff2_compress (ttf => woff2) コマンドが必要...🤔\\ | Linux では sfnt2woff (ttf => woff) と woff2_compress (ttf => woff2) コマンドが必要...🤔\\ |
| <WRAP color_term> | <WRAP color_term> |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ dnf provides sfnt2woff woff2_compress | <font color="#0087FF"><b>$</b></font> <font color="#26A269">dnf</font> provides sfnt2woff woff2_compress |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result><html><pre> | <WRAP color_result><html><pre> |
| メタデータの期限切れの最終確認: 5 days, 16:01:19 時間前の 2022年09月03日 11時54分19秒 に実施しました。 | メタデータの期限切れの最終確認: 0:00:07 時間前の 2023年03月13日 16時00分49秒 に実施しました。 |
| woff-0.20091126-25.fc36.x86_64 : Encoding and Decoding for Web Open Font Format(Woff) | woff-0.20091126-26.fc37.x86_64 : Encoding and Decoding for Web Open Font Format(Woff) |
| Repo : fedora | Repo : fedora |
| 一致: | 一致: |
| ファイル名 : /usr/bin/<b class=MAG>sfnt2woff</b> | ファイル名 : /usr/bin/<b class=MAG>sfnt2woff</b> |
| |
| woff2-tools-1.0.2-14.fc36.x86_64 : Web Open Font Format 2.0 tools | woff2-tools-1.0.2-15.fc37.x86_64 : Web Open Font Format 2.0 tools |
| Repo : fedora | Repo : fedora |
| 一致: | 一致: |
| <WRAP color_term> | <WRAP color_term> |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ sudo dnf install woff woff2-tools | <font color="#0087FF"><b>$</b></font> <font color="#26A269"><u style="text-decoration-style:solid">sudo</u></font> <font color="#26A269">dnf</font> install <font color="#A347BA">-y</font> woff woff2-tools |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result_long><html><pre> | <WRAP color_result><html><pre> |
| メタデータの期限切れの最終確認: 1:07:15 時間前の 2022年09月09日 02時50分04秒 に実施しました。 | リポジトリの更新を読み込み中: |
| 依存関係が解決しました。 | リポジトリを読み込みました。 |
| ============================================================================================================== | <b>Package </b> <b>Arch </b> <b>Version </b> <b>Repository </b> <b> Size</b> |
| パッケージ アーキテクチャー バージョン リポジトリー サイズ | Installing: |
| ============================================================================================================== | <font color="#26A269"> woff </font> x86_64 0.20091126-41.fc41 fedora 72.2 KiB |
| インストール: | <font color="#26A269"> woff2-tools </font> x86_64 1.0.2-20.fc41 fedora 51.8 KiB |
| <b class=GRN>woff</b> x86_64 0.20091126-25.fc36 fedora 22 k | |
| <b class=GRN>woff2-tools</b> x86_64 1.0.2-14.fc36 fedora 24 k | |
| |
| トランザクションの概要 | Transaction Summary: |
| ============================================================================================================== | Installing: 2 packages |
| インストール 2 パッケージ | |
| |
| ダウンロードサイズの合計: 45 k | パッケージサイズ 57 KiB 、ダウンロードサイズ 57 KiB 。 |
| インストール後のサイズ: 88 k | 完了後、124 KiB のサイズが利用されます（インストール 124 KiB、削除 0 B）。 |
| これでよろしいですか? [y/N]: y | [1/2] woff-0:0.20091126-41.fc41.x86_64 100% | 37.0 KiB/s | 32.8 KiB | 00m01s |
| パッケージのダウンロード: | [2/2] woff2-tools-0:1.0.2-20.fc41.x86_64 100% | 25.8 KiB/s | 23.7 KiB | 00m01s |
| (1/2): woff-0.20091126-25.fc36.x86_64.rpm 103 kB/s | 22 kB 00:00 | ------------------------------------------------------------------------------------------------------------------ |
| (2/2): woff2-tools-1.0.2-14.fc36.x86_64.rpm 99 kB/s | 24 kB 00:00 | [2/2] Total 100% | 16.5 KiB/s | 56.6 KiB | 00m03s |
| -------------------------------------------------------------------------------------------------------------- | |
| 合計 45 kB/s | 45 kB 00:01 | |
| トランザクションの確認を実行中 | |
| トランザクションの確認に成功しました。 | |
| トランザクションのテストを実行中 | |
| トランザクションのテストに成功しました。 | |
| トランザクションを実行中 | トランザクションを実行中 |
| 準備 : 1/1 | [1/4] パッケージ ファイルを検証 100% | 500.0 B/s | 2.0 B | 00m00s |
| インストール中 : woff2-tools-1.0.2-14.fc36.x86_64 1/2 | [2/4] トランザクションの準備 100% | 1.0 B/s | 2.0 B | 00m01s |
| インストール中 : woff-0.20091126-25.fc36.x86_64 2/2 | [3/4] インストール中 woff2-tools-0:1.0.2-20.fc41.x86_64 100% | 264.3 KiB/s | 53.4 KiB | 00m00s |
| scriptletの実行中: woff-0.20091126-25.fc36.x86_64 2/2 | [4/4] インストール中 woff-0:0.20091126-41.fc41.x86_64 100% | 35.4 KiB/s | 73.9 KiB | 00m02s |
| 検証 : woff-0.20091126-25.fc36.x86_64 1/2 | 完了しました！ |
| 検証 : woff2-tools-1.0.2-14.fc36.x86_64 2/2 | |
| | |
| インストール済み: | |
| woff-0.20091126-25.fc36.x86_64 woff2-tools-1.0.2-14.fc36.x86_64 | |
| | |
| 完了しました! | |
| </pre></html></WRAP> | </pre></html></WRAP> |
| </WRAP> | </WRAP> |
| |
| ==== オープンなライセンスの HackGen さんを Web フォントに変換する ==== | ==== オープンなライセンスの 白源/HackGen さんを Web フォントに変換する🤤 ==== |
| [[https://github.com/yuru7/HackGen|HackGen]] さんをダウンロードする🤤\\ | [[git>yuru7/HackGen|白源/HackGen]] さんをダウンロードする🤔\\ |
| <WRAP color_term> | [[git>yuru7/HackGen/blob/master/LICENSE|Copyright (c) 2019, Yuko OTAWARA. with Reserved Font Name "白源", "HackGen"]]\\ |
| <WRAP color_command><html><pre> | [[wwjp>SIL_Open_Font_License|SIL Open Font License]] Version 1.1.\\ |
| $ curl -LO https://github.com/yuru7/HackGen/releases/download/v2.7.0/HackGen_v2.7.0.zip | {{page>linux:fonts#フォントのダウンロード}} |
| </pre></html></WRAP> | |
| <WRAP color_result><html><pre> | |
| % Total % Received % Xferd Average Speed Time Time Time Current | |
| Dload Upload Total Spent Left Speed | |
| 0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--:-- 0 | |
| 100 38.5M 100 38.5M 0 0 8257k 0 0:00:04 0:00:04 --:--:-- 8983k | |
| </pre></html></WRAP> | |
| | |
| <WRAP color_command><html><pre> | |
| $ curl -LO https://github.com/yuru7/HackGen/releases/download/v2.7.0/HackGen_NF_v2.7.0.zip | |
| </pre></html></WRAP> | |
| <WRAP color_result><html><pre> | |
| % Total % Received % Xferd Average Speed Time Time Time Current | |
| Dload Upload Total Spent Left Speed | |
| 0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--:-- 0 | |
| 100 42.0M 100 42.0M 0 0 2229k 0 0:00:19 0:00:19 --:--:-- 2223k | |
| </pre></html></WRAP> | |
| | |
| <WRAP color_command><html><pre> | |
| $ unzip HackGen_v2.7.0.zip | |
| </pre></html></WRAP> | |
| <WRAP color_result><html><pre> | |
| Archive: HackGen_v2.7.0.zip | |
| creating: HackGen_v2.7.0/ | |
| inflating: HackGen_v2.7.0/HackGen-Bold.ttf | |
| inflating: HackGen_v2.7.0/HackGen-Regular.ttf | |
| inflating: HackGen_v2.7.0/HackGen35-Bold.ttf | |
| inflating: HackGen_v2.7.0/HackGen35-Regular.ttf | |
| inflating: HackGen_v2.7.0/HackGen35Console-Bold.ttf | |
| inflating: HackGen_v2.7.0/HackGen35Console-Regular.ttf | |
| inflating: HackGen_v2.7.0/HackGenConsole-Bold.ttf | |
| inflating: HackGen_v2.7.0/HackGenConsole-Regular.ttf | |
| </pre></html></WRAP> | |
| <WRAP color_command><html><pre> | |
| $ unzip HackGen_NF_v2.7.0.zip | |
| </pre></html></WRAP> | |
| <WRAP color_result><html><pre> | |
| Archive: HackGen_NF_v2.7.0.zip | |
| creating: HackGen_NF_v2.7.0/ | |
| inflating: HackGen_NF_v2.7.0/HackGen35ConsoleNF-Bold.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGen35ConsoleNF-Regular.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGen35ConsoleNFJ-Bold.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGen35ConsoleNFJ-Regular.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGenConsoleNF-Bold.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGenConsoleNF-Regular.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGenConsoleNFJ-Bold.ttf | |
| inflating: HackGen_NF_v2.7.0/HackGenConsoleNFJ-Regular.ttf | |
| </pre></html></WRAP> | |
| </WRAP> | |
| |
| TrueType(.ttf) から Web Open Font Format(.woff と .woff2) へ変換する🤤\\ | ==== TrueType(.ttf) から Web Open Font Format(.woff と .woff2) へ変換🤤 ==== |
| <WRAP color_term> | <WRAP color_term> |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ cd HackGen_v2.7.0 | <font color="#0087FF"><b>$</b></font> <font color="#26A269">cd</font> <u style="text-decoration-style:solid">HackGen_NF_v2.10.0</u> |
| $ ls *.ttf | xargs -i sh -c 'sfnt2woff {} && woff2_compress {}' | <font color="#0087FF"><b>$</b></font> <font color="#26A269">ls</font> <font color="#2A7BDE"><b>*</b></font>.ttf <font color="#2A7BDE"><b>|</b></font> <font color="#26A269">xargs</font> <font color="#A347BA">-i</font> sh <font color="#A347BA">-c</font> <font color="#A2734C">'sfnt2woff </font><font color="#2A7BDE"><b>{}</b></font><font color="#A2734C"> && woff2_compress </font><font color="#2A7BDE"><b>{}</b></font><font color="#A2734C">'</font> |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result><html><pre> | <WRAP color_result><html><pre> |
| Processing HackGen-Bold.ttf => HackGen-Bold.woff2 | Processing HackGen35ConsoleNF-Bold.ttf => HackGen35ConsoleNF-Bold.woff2 |
| Compressed 9101224 to 3603584. | Compressed 10875327 to 4569738. |
| Processing HackGen-Regular.ttf => HackGen-Regular.woff2 | Processing HackGen35ConsoleNF-Regular.ttf => HackGen35ConsoleNF-Regular.woff2 |
| Compressed 8647775 to 3432021. | Compressed 10427620 to 4393224. |
| Processing HackGen35-Bold.ttf => HackGen35-Bold.woff2 | Processing HackGenConsoleNF-Bold.ttf => HackGenConsoleNF-Bold.woff2 |
| Compressed 9099743 to 3604808. | Compressed 10876056 to 4571220. |
| Processing HackGen35-Regular.ttf => HackGen35-Regular.woff2 | Processing HackGenConsoleNF-Regular.ttf => HackGenConsoleNF-Regular.woff2 |
| Compressed 8647249 to 3429783. | Compressed 10426503 to 4395310. |
| Processing HackGen35Console-Bold.ttf => HackGen35Console-Bold.woff2 | |
| Compressed 9119537 to 3612645. | |
| Processing HackGen35Console-Regular.ttf => HackGen35Console-Regular.woff2 | |
| Compressed 8671988 to 3441571. | |
| Processing HackGenConsole-Bold.ttf => HackGenConsole-Bold.woff2 | |
| Compressed 9121961 to 3614896. | |
| Processing HackGenConsole-Regular.ttf => HackGenConsole-Regular.woff2 | |
| Compressed 8673351 to 3442435. | |
| </pre></html></WRAP> | </pre></html></WRAP> |
| |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ ll | <font color="#0087FF"><b>$</b></font> <font color="#26A269">ll</font> |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result><html><pre> | <WRAP color_result><html><pre> |
| 合計 153772 | 合計 94328 |
| -rw-r--r-- 1 tomoyan tomoyan 11241608 8月 12 13:39 HackGen-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 13462380 12月 29 16:04 HackGen35ConsoleNF-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5243896 9月 9 05:41 HackGen-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 6531888 4月 12 10:54 HackGen35ConsoleNF-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3603692 9月 9 05:41 HackGen-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 4569844 4月 12 10:55 HackGen35ConsoleNF-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 10695924 8月 12 13:39 HackGen-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 12922844 12月 29 16:04 HackGen35ConsoleNF-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5106380 9月 9 05:41 HackGen-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 6398440 4月 12 10:55 HackGen35ConsoleNF-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3432128 9月 9 05:42 HackGen-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 4393332 4月 12 10:56 HackGen35ConsoleNF-Regular.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11239408 8月 12 13:39 HackGen35-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 13464288 12月 29 16:04 HackGenConsoleNF-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5243032 9月 9 05:42 HackGen35-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 6534948 4月 12 10:56 HackGenConsoleNF-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3604916 9月 9 05:42 HackGen35-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 4571328 4月 12 10:57 HackGenConsoleNF-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 10694628 8月 12 13:39 HackGen35-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 12922800 12月 29 16:04 HackGenConsoleNF-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5105240 9月 9 05:42 HackGen35-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 6401656 4月 12 10:57 HackGenConsoleNF-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3429888 9月 9 05:43 HackGen35-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 4395416 4月 12 10:58 HackGenConsoleNF-Regular.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11250760 8月 12 13:39 HackGen35Console-Bold.ttf | |
| -rw-r--r-- 1 tomoyan tomoyan 5250112 9月 9 05:43 HackGen35Console-Bold.woff | |
| -rw-r--r-- 1 tomoyan tomoyan 3612752 9月 9 05:43 HackGen35Console-Bold.woff2 | |
| -rw-r--r-- 1 tomoyan tomoyan 10711388 8月 12 13:39 HackGen35Console-Regular.ttf | |
| -rw-r--r-- 1 tomoyan tomoyan 5113044 9月 9 05:43 HackGen35Console-Regular.woff | |
| -rw-r--r-- 1 tomoyan tomoyan 3441676 9月 9 05:44 HackGen35Console-Regular.woff2 | |
| -rw-r--r-- 1 tomoyan tomoyan 11254224 8月 12 13:39 HackGenConsole-Bold.ttf | |
| -rw-r--r-- 1 tomoyan tomoyan 5252392 9月 9 05:44 HackGenConsole-Bold.woff | |
| -rw-r--r-- 1 tomoyan tomoyan 3615004 9月 9 05:44 HackGenConsole-Bold.woff2 | |
| -rw-r--r-- 1 tomoyan tomoyan 10713656 8月 12 13:39 HackGenConsole-Regular.ttf | |
| -rw-r--r-- 1 tomoyan tomoyan 5114584 9月 9 05:44 HackGenConsole-Regular.woff | |
| -rw-r--r-- 1 tomoyan tomoyan 3442540 9月 9 05:44 HackGenConsole-Regular.woff2 | |
| </pre></html></WRAP> | </pre></html></WRAP> |
| |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ cd HackGen_NF_v2.7.0 | <font color="#0087FF"><b>$</b></font> <font color="#26A269">cd</font> <u style="text-decoration-style:solid">../HackGen_v2.10.0</u> |
| $ ls *.ttf | xargs -i sh -c 'sfnt2woff {} && woff2_compress {}' | <font color="#0087FF"><b>$</b></font> <font color="#26A269">ls</font> <font color="#2A7BDE"><b>*</b></font>.ttf <font color="#2A7BDE"><b>|</b></font> <font color="#26A269">xargs</font> <font color="#A347BA">-i</font> sh <font color="#A347BA">-c</font> <font color="#A2734C">'sfnt2woff </font><font color="#2A7BDE"><b>{}</b></font><font color="#A2734C"> && woff2_compress </font><font color="#2A7BDE"><b>{}</b></font><font color="#A2734C">'</font> |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result><html><pre> | <WRAP color_result><html><pre> |
| Processing HackGen35ConsoleNF-Bold.ttf => HackGen35ConsoleNF-Bold.woff2 | Processing HackGen-Bold.ttf => HackGen-Bold.woff2 |
| Compressed 9749308 to 3987578. | Compressed 9098739 to 3604203. |
| Processing HackGen35ConsoleNF-Regular.ttf => HackGen35ConsoleNF-Regular.woff2 | Processing HackGen-Regular.ttf => HackGen-Regular.woff2 |
| Compressed 9301797 to 3812450. | Compressed 8646368 to 3431454. |
| Processing HackGen35ConsoleNFJ-Bold.ttf => HackGen35ConsoleNFJ-Bold.woff2 | Processing HackGen35-Bold.ttf => HackGen35-Bold.woff2 |
| Compressed 9776078 to 3987074. | Compressed 9098354 to 3603655. |
| Processing HackGen35ConsoleNFJ-Regular.ttf => HackGen35ConsoleNFJ-Regular.woff2 | Processing HackGen35-Regular.ttf => HackGen35-Regular.woff2 |
| Compressed 9328505 to 3816237. | Compressed 8645686 to 3430103. |
| Processing HackGenConsoleNF-Bold.ttf => HackGenConsoleNF-Bold.woff2 | Processing HackGen35Console-Bold.ttf => HackGen35Console-Bold.woff2 |
| Compressed 9751604 to 3989577. | Compressed 9118148 to 3611814. |
| Processing HackGenConsoleNF-Regular.ttf => HackGenConsoleNF-Regular.woff2 | Processing HackGen35Console-Regular.ttf => HackGen35Console-Regular.woff2 |
| Compressed 9303032 to 3815936. | Compressed 8670425 to 3441278. |
| Processing HackGenConsoleNFJ-Bold.ttf => HackGenConsoleNFJ-Bold.woff2 | Processing HackGenConsole-Bold.ttf => HackGenConsole-Bold.woff2 |
| Compressed 9778374 to 3988063. | Compressed 9118925 to 3614983. |
| Processing HackGenConsoleNFJ-Regular.ttf => HackGenConsoleNFJ-Regular.woff2 | Processing HackGenConsole-Regular.ttf => HackGenConsole-Regular.woff2 |
| Compressed 9329740 to 3814213. | Compressed 8669356 to 3442626. |
| </pre></html></WRAP> | </pre></html></WRAP> |
| |
| <WRAP color_command><html><pre> | <WRAP color_command><html><pre> |
| $ ll | <font color="#0087FF"><b>$</b></font> <font color="#26A269">ll</font> |
| </pre></html></WRAP> | </pre></html></WRAP> |
| <WRAP color_result><html><pre> | <WRAP color_result><html><pre> |
| 合計 166816 | 合計 154060 |
| -rw-r--r-- 1 tomoyan tomoyan 12054672 8月 12 13:39 HackGen35ConsoleNF-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 11239136 12月 29 16:04 HackGen-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5712460 9月 9 04:37 HackGen35ConsoleNF-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 5282724 4月 12 10:59 HackGen-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3987684 9月 9 04:38 HackGen35ConsoleNF-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3604308 4月 12 11:00 HackGen-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11515332 8月 12 13:39 HackGen35ConsoleNF-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 10694536 12月 29 16:04 HackGen-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5575200 9月 9 04:38 HackGen35ConsoleNF-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 5149508 4月 12 11:00 HackGen-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3812556 9月 9 04:39 HackGen35ConsoleNF-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3431560 4月 12 11:00 HackGen-Regular.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 12081440 8月 12 13:39 HackGen35ConsoleNFJ-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 11238016 12月 29 16:04 HackGen35-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5713384 9月 9 04:39 HackGen35ConsoleNFJ-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 5281588 4月 12 11:01 HackGen35-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3987180 9月 9 04:39 HackGen35ConsoleNFJ-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3603760 4月 12 11:01 HackGen35-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11542040 8月 12 13:39 HackGen35ConsoleNFJ-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 10693068 12月 29 16:04 HackGen35-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5576356 9月 9 04:39 HackGen35ConsoleNFJ-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 5147932 4月 12 11:01 HackGen35-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3816344 9月 9 04:40 HackGen35ConsoleNFJ-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3430208 4月 12 11:02 HackGen35-Regular.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 12058104 8月 12 13:39 HackGenConsoleNF-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 11249376 12月 29 16:04 HackGen35Console-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5715004 9月 9 04:40 HackGenConsoleNF-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 5288700 4月 12 11:02 HackGen35Console-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3989684 9月 9 04:41 HackGenConsoleNF-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3611920 4月 12 11:02 HackGen35Console-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11517568 8月 12 13:39 HackGenConsoleNF-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 10709828 12月 29 16:04 HackGen35Console-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5577036 9月 9 04:41 HackGenConsoleNF-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 5155420 4月 12 11:02 HackGen35Console-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3816044 9月 9 04:41 HackGenConsoleNF-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3441384 4月 12 11:03 HackGen35Console-Regular.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 12084872 8月 12 13:39 HackGenConsoleNFJ-Bold.ttf | -rw-r--r-- 1 tomoyan tomoyan 11251244 12月 29 16:04 HackGenConsole-Bold.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5715760 9月 9 04:41 HackGenConsoleNFJ-Bold.woff | -rw-r--r-- 1 tomoyan tomoyan 5291272 4月 12 11:03 HackGenConsole-Bold.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3988168 9月 9 04:42 HackGenConsoleNFJ-Bold.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3615088 4月 12 11:04 HackGenConsole-Bold.woff2 |
| -rw-r--r-- 1 tomoyan tomoyan 11544276 8月 12 13:39 HackGenConsoleNFJ-Regular.ttf | -rw-r--r-- 1 tomoyan tomoyan 10709744 12月 29 16:04 HackGenConsole-Regular.ttf |
| -rw-r--r-- 1 tomoyan tomoyan 5578188 9月 9 04:42 HackGenConsoleNFJ-Regular.woff | -rw-r--r-- 1 tomoyan tomoyan 5158008 4月 12 11:04 HackGenConsole-Regular.woff |
| -rw-r--r-- 1 tomoyan tomoyan 3814320 9月 9 04:43 HackGenConsoleNFJ-Regular.woff2 | -rw-r--r-- 1 tomoyan tomoyan 3442732 4月 12 11:04 HackGenConsole-Regular.woff2 |
| </pre></html></WRAP> | </pre></html></WRAP> |
| </WRAP> | </WRAP> |
| |
| ===== 参考文献 ===== | ===== 参考文献 ===== |
| | [[https://fonts.google.com|Google Fonts]]\\ |
| [[https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization?hl=ja|ウェブフォントの最適化 | Web Fundamentals | Google Developers]]\\ | [[https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization?hl=ja|ウェブフォントの最適化 | Web Fundamentals | Google Developers]]\\ |
| [[https://01earth.jp/web-create/coding/web-font/|自社サーバーにフォントをアップロードして、Webフォントを使用する方法｜株式会社ゼロワンアース]]\\ | [[https://01earth.jp/web-create/coding/web-font/|自社サーバーにフォントをアップロードして、Webフォントを使用する方法｜株式会社ゼロワンアース]]\\ |
| [[https://en.wikipedia.org/wiki/Web_Open_Font_Format|Web Open Font Format - Wikipedia]]\\ | [[https://en.wikipedia.org/wiki/Web_Open_Font_Format|Web Open Font Format - Wikipedia]]\\ |
| [[https://developer.mozilla.org/ja/docs/Web/Guide/WOFF|WOFF (Web Open Font Format) - 開発者ガイド | MDN]]\\ | [[https://developer.mozilla.org/ja/docs/Web/Guide/WOFF|WOFF (Web Open Font Format) - 開発者ガイド | MDN]]\\ |
| [[https://christina04.hatenablog.com/entry/2017/04/12/002333|]]\\ | [[https://www.willgate.co.jp/promonista/page-speed/|ページ表示速度の計測・改善方法｜Googleが重視する理由と対策 | ウィルゲート]]\\ |
| | [[https://christina04.hatenablog.com/entry/2017/04/12/002333|Webフォントのファイルサイズを小さくする - Carpe Diem]]\\ |
| |
| ==== 付録 ==== | ==== 付録 ==== |
| [[tw>tomoyan596sp/status/1567951237596983296|Linuxでパッケージ化されているので、sfnt2woffとwoff2_compressが含まれるパッケージはこれで良さそうですけど試します🤔 $ sudo dnf install woff woff2-tools]]\\ | [[tw>tomoyan596sp/status/1567951237596983296|Linuxでパッケージ化されているので、sfnt2woffとwoff2_compressが含まれるパッケージはこれで良さそうですけど試します🤔 $ sudo dnf install woff woff2-tools]]\\ |
| |
