游ゴシック体/游明朝体をWebで利用する

游ゴシック体/游明朝をWebで使う方法。OSX版。

新しいOSX Mavericks(10.9)には「游ゴシック体」と「游明朝体」が搭載されました。
font-family: の指定でhtmlにも使えます。

(游ゴシック体html表示サンプル|OS 10.9以降で表示)

イオンPBは「責任は全てイオンがもちます」を大前提に、製造元も原産国も記載していなかった筈なのに、いざ食品偽装が起きた途端、納入業者に責任丸投げとかなかなか清々しいクズ

(游明朝体html表示サンプル|OS 10.9以降で表示)

イオンPBは「責任は全てイオンがもちます」を大前提に、製造元も原産国も記載していなかった筈なのに、いざ食品偽装が起きた途端、納入業者に責任丸投げとかなかなか清々しいクズ

css記述時には、游ゴシック体は「YuGothic」、游明朝体は「YuMincho」となります。
英語用の「ファミリーネーム」を利用しています。

游ゴシック体 ミディアム

游明朝体 ミディアム

<strong>タグも機能しますが、游明朝体の太字はデミボールドなので差がわかりづらく、強調表現としては使えないかもしれません。

ちなみに、Windows 8.1にも游ゴシック体/游明朝体が搭載されましたが、ウェイトが微妙に異なるようです。そのようなつぶやきを見つけました。游ゴシック体 ボールドと游明朝体 デミボールドのみ、同じウェイトです。

デバイス文字のMac/Win統一のためにこの書体を利用できるかと思いましたが、ちょっと難しそうです。

131031|追記 Windows環境やブラウザの対応を考慮した記述方法についてはこちらが詳しいです。
131101|追記 Dutch Type LibraryのOTMasterというソフトでフォント情報を調べてcssの指定方法を詳しく解説した記事を見つけました。

「游ゴシック体/游明朝体をWebで利用する」への1件のフィードバック

コメントを残す

メールアドレスが公開されることはありません。