ネットフォントの中国語の使い方(一)
8488 ワード
ネットフォントの中国語の使い方(一)
2014年6月10日 首をかしげるハッカー1つのコメント
9
Windows XPオペレーティングシステムを使用すると、中国語のWebページを閲覧すると、Webページの漢字はほとんど宋体であることがわかります.これは、あなたのオペレーティングシステムに中国語の宋体字庫がインストールされ、デフォルトのフォントに設定されているからです.ブラウザには、Webページの漢字がデフォルトのフォントで表示されます.Windows 7/8時代に入ると、Windowsシステムのデフォルトフォントがマイクロソフトの黒に変わり、すべての中国語サイトの漢字で使われているフォントがマイクロソフトの黒になった.
例えば、マイクロソフトのブラックが好きではありません.あなたのパソコンにはもう一つのフォントがインストールされています.「徐静蕾手書き体」と呼ばれています.このフォントであなたのページの漢字を表示したいのですが、CSSでこのように書くことができます.
そこで、あなたのパソコンであなたのこのホームページを閲覧すると、ホームページの漢字はあなたの望むように「徐静蕾手書き体」のフォントで表示されます.注意してください.私は「あなた」と「あなたの」という字に太字を使って、重点的な注意を表しています.もう一人の人なら、あなたのパソコンではなく、自分のパソコンを使っているのに、彼のパソコンにはあなたの大好きな「徐静蕾手書き体」がインストールされていないので、彼のパソコンのブラウザは「徐静蕾手書き体」を認識できず、パソコンのデフォルトのフォントでホームページ上のこれらの漢字を表示するしかありません.
どのようにあなたのウェブサイトの閲覧者もあなたのように幸せに「徐静蕾手書き体」を使ってホームページの漢字を表示することができますか?方法は2つあります.第一に、これらの閲覧者に、自分のパソコンにも「徐静蕾手書き体」のフォントをインストールさせるように伝えます.これにより、ブラウザはこのフォントをページにロードして表示することができます.2つ目の方法は、Web font、すなわちネットワークフォントを使用することです.
最初の方法は、最も簡単なようですが、ページにヒントを加えるだけで、閲覧者に「徐静蕾手書き体」をダウンロードしてインストールすると、最適な閲覧体験が得られます.しかし、実際には、これは現実的ではありません.あなたのサイトの閲覧者の中にどれだけの「パソコンの白」があるかは言いません.「フォント」とは何か、インストール方法も分かりません.彼がパソコンの知識を知っていても、彼らはあなたと同じように「徐静蕾手写体」のファンではありません.もっと致命的な点は、私の知っている限りでは、「徐静蕾手書き体」は無料のフォントではなく、有料です.この字庫は方正電子が徐静蕾を招待して硬筆で書いたもので、ネットユーザーは10元でダウンロードしてインストールすることができる.
第2の方法は、いわゆるWeb fontネットワークフォントである.まずその基本原理を話す必要があります.CSSには
あなたのウェブサイトの閲覧者が使用しているブラウザが上記のCSSコードを見た後、地元のシステムのフォントライブラリから「徐静蕾手書き体」のフォントを探すのではなく、
これは理想的な方法だが、あいにく神様は漢字と通れない.この方法は英語のウェブページの中で非常に流行している.英語は26文字しかないので、英語のワードライブラリは全部で数十KBで、リモートサーバからこのような小さなボリュームのワードライブラリをダウンロードするのは非常に便利だ.しかし、普通の中国語の字庫の体積は少なくとも2-3 MBあります.中には数千の常用漢字が含まれているからです.数百KBしかないページを見るために、2~3メガのフォントライブラリをダウンロードするには、まずダウンロードを待つ時間が耐えられない.2つ目は、本当に必要ない.
フォントの著作権という問題もあります.英語のフォントの作成は簡単で、26文字しかないので、自分で半日かけて描くことができるので、英語のフォントの多くはopen source無料です.しかし、一つの中国語フォントライブラリは一人の力で完成できるものではありません.基本的にすべての中国語フォントは商業会社が開発したもので、例えばすべての正のフォントです.徐静蕾は2ヶ月以上かけて6763の漢字を書いた.これらの手書きフォントは方正社が作成した「方正静蕾簡体」のライブラリで、10元セットで販売されています.発売された翌日、盗用があった.回り道ができないので、次の内容ではこの質問はしません:-(.
ここまで言うと、あなたは私と同じように、がっかりしていると思います.
Webプログラマーにとって、Webページは自分の子供であり、どのWebプログラマーも自分の子供をきれいにしたいと思っています.きれいなフォントを見て使えないのは悲しいことです.
実は使えないわけではありませんが、やはり方法があります.ただ面倒です.次は2つの実行可能なWeb Font中国語のネットフォントの使い方を話します.
全体的な考え方.
重要な問題は体積が大きいことです(著作権の問題を回避します).では、問題の出路は体積を減らすことです.体積を減らす方法は、フォントライブラリから現在のページで使用されている字を選び、使用されていない字を捨てて、新しい、小さなフォントライブラリファイルにマージすることです.
例を挙げると、ページに文章のタイトルを強調したいのですが、本文のタイトルは「ネットフォント(Web Font)の中国語用法(一)」で、全部で19文字です.それでは、「徐静蕾手書き体」フォントライブラリからこの19文字を抽出して、新しい小さなフォントライブラリを構成し、とりあえず「小徐静蕾ネットフォント」と呼びます.では、CSSでこう書くことができます.
このような十数字しかないライブラリは、体積が十数KBにすぎず、ネットフォントにぴったりです.
技術者が最も関心を持っているのは技術的な問題だと信じています.プログラマーは、これらの個別の字をフォントライブラリからどのように抽出するか、そしてどのように新しいフォントライブラリファイルを構成するかと聞くかもしれません.本稿の紙面を考えると、ここでこの問題を詳しく話すつもりはありませんが、興味深いプログラマーはまずFontForgeというオープンソースソフトウェアを研究することができます.私は次の文章でPHPを使用して個々の文字を動的に抽出して小さなフォントファイルにまとめる方法について詳しく説明します.ここでは、この方法ではなく、2つ目の方法に重点を置きます.
上記の方法では、
まず、この使い方の効果を感じてみましょう.
徐静蕾手書きフォント:
私たちの微博@歪首ホラーに注目してください.
漢儀雪峰フォント:
私たちの微博@歪首ホラーに注目してください.
太った頭の魚のフォント:
私たちの微博@歪首ホラーに注目してください.
とてもきれいではありません!画像ではありませんよ.マウスで中国語の漢字を選ぶことができます.
まず、フォントライブラリから「私たちのマイクロブログ@歪首ホラーに注目してください」という14文字を抽出し、新しい
この使い方の利点は、すべての現代ブラウザが互換性のあるフォントフォーマットが必要であり、フォントライブラリ全体(数十KBしかない)がCSSファイルに保存され、ブラウザがこれらのフォントファイルをダウンロードするためにHTTP接続を単独で確立する必要がないことです.
小結
Linuxシステムで使用されている中国語フォントは、フォント会社が自主的に無料で提供している中国語フォントです.次の文章では、PHPプログラミングで単一の中国語漢字をフォントライブラリから抽出し、新しい小さなフォントファイルに統合する方法を紹介します.WebページでもWeb fontのWebフォントを簡単に使いこなすことができます.@歪曲ハッカーに注目して、当駅の最新動向を入手してください.
変換元:http://www.webhek.com/web-font-chinese/
転載先:https://www.cnblogs.com/fxair/p/3867141.html
2014年6月10日 首をかしげるハッカー1つのコメント
9
Windows XPオペレーティングシステムを使用すると、中国語のWebページを閲覧すると、Webページの漢字はほとんど宋体であることがわかります.これは、あなたのオペレーティングシステムに中国語の宋体字庫がインストールされ、デフォルトのフォントに設定されているからです.ブラウザには、Webページの漢字がデフォルトのフォントで表示されます.Windows 7/8時代に入ると、Windowsシステムのデフォルトフォントがマイクロソフトの黒に変わり、すべての中国語サイトの漢字で使われているフォントがマイクロソフトの黒になった.
例えば、マイクロソフトのブラックが好きではありません.あなたのパソコンにはもう一つのフォントがインストールされています.「徐静蕾手書き体」と呼ばれています.このフォントであなたのページの漢字を表示したいのですが、CSSでこのように書くことができます.
body {
font-family: ' '; }
そこで、あなたのパソコンであなたのこのホームページを閲覧すると、ホームページの漢字はあなたの望むように「徐静蕾手書き体」のフォントで表示されます.注意してください.私は「あなた」と「あなたの」という字に太字を使って、重点的な注意を表しています.もう一人の人なら、あなたのパソコンではなく、自分のパソコンを使っているのに、彼のパソコンにはあなたの大好きな「徐静蕾手書き体」がインストールされていないので、彼のパソコンのブラウザは「徐静蕾手書き体」を認識できず、パソコンのデフォルトのフォントでホームページ上のこれらの漢字を表示するしかありません.
どのようにあなたのウェブサイトの閲覧者もあなたのように幸せに「徐静蕾手書き体」を使ってホームページの漢字を表示することができますか?方法は2つあります.第一に、これらの閲覧者に、自分のパソコンにも「徐静蕾手書き体」のフォントをインストールさせるように伝えます.これにより、ブラウザはこのフォントをページにロードして表示することができます.2つ目の方法は、Web font、すなわちネットワークフォントを使用することです.
最初の方法は、最も簡単なようですが、ページにヒントを加えるだけで、閲覧者に「徐静蕾手書き体」をダウンロードしてインストールすると、最適な閲覧体験が得られます.しかし、実際には、これは現実的ではありません.あなたのサイトの閲覧者の中にどれだけの「パソコンの白」があるかは言いません.「フォント」とは何か、インストール方法も分かりません.彼がパソコンの知識を知っていても、彼らはあなたと同じように「徐静蕾手写体」のファンではありません.もっと致命的な点は、私の知っている限りでは、「徐静蕾手書き体」は無料のフォントではなく、有料です.この字庫は方正電子が徐静蕾を招待して硬筆で書いたもので、ネットユーザーは10元でダウンロードしてインストールすることができる.
第2の方法は、いわゆるWeb fontネットワークフォントである.まずその基本原理を話す必要があります.CSSには
font-family
というマークがあります.@font-face
の宣言では、このフォントフォントライブラリファイルがネットワークのどこかからダウンロードされることを指定するフォントを宣言することができます.具体的な書き方は以下の通りです.@font-face {
font-family: ' '; src: url('http://www.webhek.com/ .eot'); /* IE9 Compat Modes */ src: url('http://www.webhek.com/ .eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('http://www.webhek.com/ .woff') format('woff'), /* */ url('http://www.webhek.com/ .ttf') format('truetype'), /* Safari, Android, iOS */ url('http://www.webhek.com/ .svg#svgFontName') format('svg'); /* Legacy iOS */ }
あなたのウェブサイトの閲覧者が使用しているブラウザが上記のCSSコードを見た後、地元のシステムのフォントライブラリから「徐静蕾手書き体」のフォントを探すのではなく、
@font-face
までフォントをダウンロードして使用します(一時的に使用し、ユーザーのシステムにインストールされません).これは理想的な方法だが、あいにく神様は漢字と通れない.この方法は英語のウェブページの中で非常に流行している.英語は26文字しかないので、英語のワードライブラリは全部で数十KBで、リモートサーバからこのような小さなボリュームのワードライブラリをダウンロードするのは非常に便利だ.しかし、普通の中国語の字庫の体積は少なくとも2-3 MBあります.中には数千の常用漢字が含まれているからです.数百KBしかないページを見るために、2~3メガのフォントライブラリをダウンロードするには、まずダウンロードを待つ時間が耐えられない.2つ目は、本当に必要ない.
フォントの著作権という問題もあります.英語のフォントの作成は簡単で、26文字しかないので、自分で半日かけて描くことができるので、英語のフォントの多くはopen source無料です.しかし、一つの中国語フォントライブラリは一人の力で完成できるものではありません.基本的にすべての中国語フォントは商業会社が開発したもので、例えばすべての正のフォントです.徐静蕾は2ヶ月以上かけて6763の漢字を書いた.これらの手書きフォントは方正社が作成した「方正静蕾簡体」のライブラリで、10元セットで販売されています.発売された翌日、盗用があった.回り道ができないので、次の内容ではこの質問はしません:-(.
ここまで言うと、あなたは私と同じように、がっかりしていると思います.
Webプログラマーにとって、Webページは自分の子供であり、どのWebプログラマーも自分の子供をきれいにしたいと思っています.きれいなフォントを見て使えないのは悲しいことです.
実は使えないわけではありませんが、やはり方法があります.ただ面倒です.次は2つの実行可能なWeb Font中国語のネットフォントの使い方を話します.
全体的な考え方.
重要な問題は体積が大きいことです(著作権の問題を回避します).では、問題の出路は体積を減らすことです.体積を減らす方法は、フォントライブラリから現在のページで使用されている字を選び、使用されていない字を捨てて、新しい、小さなフォントライブラリファイルにマージすることです.
例を挙げると、ページに文章のタイトルを強調したいのですが、本文のタイトルは「ネットフォント(Web Font)の中国語用法(一)」で、全部で19文字です.それでは、「徐静蕾手書き体」フォントライブラリからこの19文字を抽出して、新しい小さなフォントライブラリを構成し、とりあえず「小徐静蕾ネットフォント」と呼びます.では、CSSでこう書くことができます.
@font-face {
font-family: ' '; src: url('http://www.webhek.com/ .eot'); /* IE9 Compat Modes */ src: url('http://www.webhek.com/ .eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('http://www.webhek.com/ .woff') format('woff'), /* */ url('http://www.webhek.com/ .ttf') format('truetype'), /* Safari, Android, iOS */ url('http://www.webhek.com/ .svg#svgFontName') format('svg'); /* Legacy iOS */ }
このような十数字しかないライブラリは、体積が十数KBにすぎず、ネットフォントにぴったりです.
技術者が最も関心を持っているのは技術的な問題だと信じています.プログラマーは、これらの個別の字をフォントライブラリからどのように抽出するか、そしてどのように新しいフォントライブラリファイルを構成するかと聞くかもしれません.本稿の紙面を考えると、ここでこの問題を詳しく話すつもりはありませんが、興味深いプログラマーはまずFontForgeというオープンソースソフトウェアを研究することができます.私は次の文章でPHPを使用して個々の文字を動的に抽出して小さなフォントファイルにまとめる方法について詳しく説明します.ここでは、この方法ではなく、2つ目の方法に重点を置きます.
上記の方法では、
http://www.webhek.com/ .eot
、.eot
、.woff
、.ttf
、.svg
形式の中国語フォントファイルをそれぞれ生成します.最古のIE 6でもこの書き方がサポートされているのが強みです.しかし、ブラウザの進歩に伴い、現代のブラウザが登場し、この使い方は徐々に淘汰されると信じられています.(@font-faceの使い方)この記事では、Googleブラウザ、火狐ブラウザ、Safariブラウザ、IE 9は.woff
形式のフォントをサポートし、Data URLをサポートしています.そこで、もしあなたのサイトが現代ブラウザと互換性があるだけであれば、CSSの@font-face
の書き方はこのようにする必要があります.@font-face {
font-family: ' '; src: url(data:application/font-woff;charset=utf-8;base64, ... ) format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ }
まず、この使い方の効果を感じてみましょう.
徐静蕾手書きフォント:
私たちの微博@歪首ホラーに注目してください.
漢儀雪峰フォント:
私たちの微博@歪首ホラーに注目してください.
太った頭の魚のフォント:
私たちの微博@歪首ホラーに注目してください.
とてもきれいではありません!画像ではありませんよ.マウスで中国語の漢字を選ぶことができます.
まず、フォントライブラリから「私たちのマイクロブログ@歪首ホラーに注目してください」という14文字を抽出し、新しい
.woff
形式のネットワークフォントファイルを統合し、この.woff
フォントファイルをbase 64符号化文字列を生成し、これらの文字列をCSSに貼り付けます.私は『SVGの使い方』でこの記事では、base 64符号化をオンラインで生成できるツールをいくつか紹介していますが、興味のある方は試してみてください.この使い方の利点は、すべての現代ブラウザが互換性のあるフォントフォーマットが必要であり、フォントライブラリ全体(数十KBしかない)がCSSファイルに保存され、ブラウザがこれらのフォントファイルをダウンロードするためにHTTP接続を単独で確立する必要がないことです.
小結
Linuxシステムで使用されている中国語フォントは、フォント会社が自主的に無料で提供している中国語フォントです.次の文章では、PHPプログラミングで単一の中国語漢字をフォントライブラリから抽出し、新しい小さなフォントファイルに統合する方法を紹介します.WebページでもWeb fontのWebフォントを簡単に使いこなすことができます.@歪曲ハッカーに注目して、当駅の最新動向を入手してください.
変換元:http://www.webhek.com/web-font-chinese/
転載先:https://www.cnblogs.com/fxair/p/3867141.html