» www.Giftbox.Az - Bir birindən gözəl hədiyyə satışı
ウィキペディアランダム
毎日カテゴリ
共有: WhatsappFacebookTwitterVK

Webフォント

WebフォントWWWのコンテンツ側がフォントデータを持ち、コンテンツ側から提供されるフォントデータに従って、Webブラウザなどの可視化(レンダリング)をともなうクライアントが文字表示((カーニング))を行うシステムおよびそのフォントである。CSS3.0 fonts moduleで、この機能の標準が提供された。

概要

元来、Webブラウザは端末にインストールされているフォントを呼び出し文字を表示する。端末のフォント如何では、Webデザイナーが意図しないWeb表示がなされてしまい、またフォントに関するWebデザインに制約が生じてしまう。フォントを画像にして表示するという手はあったが、文章修正のメンテナンス、文章の検索といった点で問題がある。そこでWebサーバー上にフォントファイルを置き、Webデザイナーの意図するフォントを表示できるようにした技術がWebフォントである。またはWebサーバー上に置かれるフォント自体をWebフォントと指し、フォントをWebで利用するよう提供するサービスをWebフォントサービスとして区別する。

漢字は膨大な数であり、Webフォントのダウンロード量など、ラテン文字と比較して課題がある。 しかし2010年、2011年頃から日本語に対応したWebフォントサービスが開設されている[1][2][3]。また、Google Fontsも2014年頃から日本語フォントが追加されている[4]

Webフォント

歴史

ファイルフォーマット

TrueDoc

Embedded OpenType

Scalable Vector Graphics

TrueType/OpenType

Web Open Font Format

Web Open Font Format をサポートするブラウザは、Mozilla Firefox 3.6+、[5] Google Chrome 5+、[6][7]Opera Presto,[8]Internet Explorer 9 (2011年5月14日)[9]Mac OS X LionSafari 5.1。

Webフォント対応ブラウザ

  • IE (eotのみ)
  • Firefox
  • Chrome
  • Android標準ブラウザ
  • Opera
  • Safari

サブセット化とダイナミック・サブセッティング

サブセット化

ページの読み込みを高速化するためには、フォントのファイルサイズを小さくする必要があるため、必要な字だけを含むフォントのサブセット(フォントを一部の文字数にしたもの)を作ることがある。これをサブセット化という。

ダイナミック・サブセッティング

日本語や中国語のような言語では、文字が多いため元のフォントに収録される文字全てを合わせると、数メガバイトの容量に至ってしまう。このため、サブセット作成を動的に行う技術が用いられ、ダイナミック・サブセッティングとよばれる。Webサイトで実行されるJavaScriptで、ページ内で使用される全ての文字を検出し、必要となる文字をサブセットとしてサーバーから呼び出す仕組みである。

(Adobe Typekit)やTypeSquareではこの技術が採用されている[10]

問題点

ブラウザー側で「ウェブサイトで指定したフォントを使用しない」設定を有効にしたり、ユーザースタイルシートを使用している場合、Webフォントが表示されなくなる場合がある。特にこの問題は、アイコンフォントのような、閲覧環境に代替するフォントが存在しない場合に顕著である。

Webフォント提供サービス

  • Google Fonts
  • (Adobe Fonts)
  • (Adobe Edge Web Fonts)
  • TypeSquare - モリサワと(タイプバンク)の和文Webフォントが有料で提供されている。MORISAWA PASSPORTにも利用権が付属している。
  • (FONTPLUS) - フォントワークスイワタモトヤ、(白舟書体)、モリサワの和文Webフォントが有料で提供されている。
  • DynaFont Online - ダイナコムウェアが提供する有料和文Webフォントサービス。和文以外に中国語簡体字・繁体字も提供されている。2019年4月以降は同社の「DynaSmart」シリーズに利用権が付随する形となっている。
  • (REALTYPE) - 自作のフォントを登録してWebフォントとして販売、利用できるWebフォントプラットフォーム。
  • FontStream - タイプラボ、欣喜堂などの和文Webフォントが有料で提供されている。
  • (ウェブフォントファン) - 和文Webフォント、Wordpress用フォントプラグインが有料で提供されている。
  • (もじでぱ)
  • (WebLiFEサーバー)
  • (Fontdeck)
  • (Fonts.com)
  • (Fontspring)
  • (Font Squirrel)

関連項目

  • (カーニング)

脚注

[脚注の使い方]
  1. ^ “国内初の日本語対応ウェブフォントサービス「デコもじ」を開始ウェブフォント関連事業に本格参入”. Ascii.jp (2010年5月10日). 2013年4月10日閲覧。
  2. ^ “ソフトバンク・テクノロジー社の「フォントプラス」がフォントワークス書体に対応”. フォントワークス (2011年7月27日). 2013年2月11日閲覧。
  3. ^ “クラウドフォントサービス「TypeSquare(仮称)」を発表”. モリサワ (2011年8月10日). 2013年2月11日閲覧。
  4. ^ 安田英久 (2015年3月10日). “Web担当者Forum 編集長ブログ グーグルが日本語Webフォントを提供してた。これはWebフォントの大転換になるかも?”. 2017年4月24日閲覧。
  5. ^ Shapiro, Melissa (2009-10-20), Mozilla Supports Web Open Font Format, Mozilla, http://blog.mozilla.com/blog/2009/10/20/mozilla-supports-web-open-font-format/ 2010年2月5日閲覧。 
  6. ^ Gilbertson, Scott (2010-04-26), Google Chrome to Support the Web Open Font Format, webmonkey, http://www.webmonkey.com/2010/04/google-chrome-to-support-the-web-open-font-format 
  7. ^ Bug 38217 - [chromium] Add WOFF support, WebKit, https://bugs.webkit.org/show_bug.cgi?id=38217 
  8. ^ Web specifications support in Opera Presto 2.7, Opera, http://www.opera.com/docs/specs/presto27/ 
  9. ^ Galineau, Sylvain (2010-04-23), Meet WOFF, The Standard Web Font Format, Microsoft, http://blogs.msdn.com/ie/archive/2010/04/23/meet-woff-the-standard-web-font-format.aspx 
  10. ^ Kaplan, Gregor (2015年6月16日). “日本のお客様へ。日本および東アジアのWebフォントへの対応と新しいフォント選択ツールに関するお知らせ。” (英語). The Typekit Blog. 2020年1月12日閲覧。

外部リンク

  • WebフォントのCSSとライセンス記載例 - Qiita
  • Google Fonts
  • 【簡単】Webフォントの使い方!Google web fontsを使ってみよう - FASTCODING BLOG
  • Google が提供する日本語 Web フォント - Qiita
  • 外字Web Server - ダイナコムウェア株式会社
  • Webフォントの設定【サーバにフォントをインストール】 - SEO白書
ウィキペディア、ウィキ、本、library、論文、読んだ、ダウンロード、自由、無料ダウンロード、mp3、video、mp4、3gp、 jpg、jpeg、gif、png、画像、音楽、歌、映画、本、ゲーム、ゲーム。