• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:Webに使用するFONTについて)

Webに使用するFONTについて

このQ&Aのポイント
  • Webのフォントについての選定について困っています。ブラウザやOSによって表示が異なることは分かっていますが、どのフォントを選ぶべきか悩んでいます。
  • 現在、Webのリニューアルをしています。しかし、フォントの選定に困っています。多くのブラウザやOSが存在するため、全てにおいて同じ表示ができるフォントを選ぶことは難しいです。
  • Webのリニューアルを進めていますが、フォントの選定に悩んでいます。ブラウザやOSの種類によって表示が異なるため、一番無難なフォントを選ぶべきか迷っています。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.4

 こんばんは。素人ですが文字が好きで、ブログをつくってみたら想像以上に表示が崩れてしまい、ウェブって試行錯誤の連続だなぁ――と思っている者です。 * { font-family: メイリオ, Meiryo, 'MS Pゴシック', sans-serif; }  さて、ウェブの書体は CSS で指定していきますが、必ずしも一種類に絞る必要はありません。たとえば上記の CSS では、メイリオがあればメイリオで、メイリオがなければMS Pゴシックで、MS Pゴシックがなければ sans-serif(何らかのゴシック体)で表示されます。このように複数書体を順番に並べておけば、Vista 以降ならメイリオ、XP 以前ならMS Pゴシックと振りわけられます。 * { font-family: メイリオ, Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', HiraKakuProN-W3, 'MS ゴシック', monospace; }  ただし、メイリオとMS Pゴシックとでは字幅が異なるため、見た目が崩れるかもしれません。また、アップル製品には【ヒラギノ】という書体がついてくるため、メイリオを指定しても無意味です。このような点も考慮した結果、私は上記のような CSS を書いています。もちろん、拡大・縮小などでズレますが、何もしないよりはマシかと。逆にいえば、少しくらい拡大されても平気なように、ゆとりのあるレイアウトが必要なのかな――と思います。  なお、世間的には「ウェブの字なんて読めれば何でもいい」という意見が多く、質問者さんのようにこだわる方は滅多にいません。これは非常に残念なことで、ウェブが出版に追いつけない原因のひとつだと考えています。  そこで昨今では、Web フォント(下記のフォントプラスなど)や、CSS3 といった新しいレイアウト技術も始まりつつあります。もっとも、日本語は複雑なことばであるため、これらの技術は発展途上です。しかしながら、将来的には紙の書籍と同等の見た目がウェブでも保証されてほしいし、ウェブだからズレて当然といった考えも、過去のものになってほしいなと願っています。  ◆標準の日本語フォント / もうパンツはかない   http://rinrin.saiin.net/~aor/fonts/fonts  ◆font-family-スタイルシートリファレンス   http://htmq.com/style/font-family.shtml  ◆FONTPLUS|フォントプラス   http://webfont.fontplus.jp/

heron-griffin
質問者

お礼

はじめまして。このたびは非常に貴重な知識をご教授下さり。誠に有りがたく感謝しています。書いて頂いた内容は全て私にとって参考、勉強になりました。 ご自分の努力で試行錯誤しながらも生きた知識を身につけていっておられる様子が伝わります。見習いたいと思うばかりです。どうもありがとうございました。

その他の回答 (3)

  • Moonsan
  • ベストアンサー率84% (11/13)
回答No.3

ご存知の情報かもしれませんが、念のため。 モリサワ「TypeSquare」(クラウドフォント) http://www.morisawa.co.jp/font/products/typesquare/ グラフィックデザインのイメージが強い方や文字へのこだわり (ブランディング)がある会社は導入するかな、と思い一応 デモなどで見た製品です(確か今年リリ-スしたものです)。 わかりやすい解説 http://web-tan.forum.impressrd.jp/e/2012/09/03/13383 個人的には(お金を払ってまでなぁ)と思うのですが、 上記のようなこだわりがある企業さんで予算的に問題 がないなら良いのかな、と思います。 (技術的には悪くないと思うので、上記URLにあるように 今後普及していく可能性もあるとは思います) 以上、参考まで。

  • naokita
  • ベストアンサー率57% (1008/1745)
回答No.2

サーバーへインストールするウェブフォントという手段もありますが、表示が遅くなります・・・ ----------------- 一般的には、 無指定が一番多く、正攻法です。 次にメイリオ+複数指定で、MS Pゴシックのみ(単独)の指定はアマちゃんです。 CSSフォント指定では、複数フォントを順に指定できますので、 環境に無いフォントがあれば、次順のフォントを表示する仕様です。 なので、macユーザー用フォントも絡めて羅列すればよいです。 最後に、ゴシック指定の(sans-serif)を入れます。 但し、 メイリオ指定で、旧OSのClear Type(アンチエイリアシング)問題もありますが、 仰る通り、 メイリオをインストールするような人なのに、この問題を知らない方が少ないです。 (まあ、XPは2014年迄に一気に減るでしょうが) また、 「メイリオ 悩ましい問題」があります。 ↑↑語句で検索するとわかるでしょうから割愛しますが、 MS Pゴシック以外の問題もあり、正解はありません。 当方でのメイリオ指定の場合は、 ~~~{ font-family: "メイリオ",~,~,~,~,~,~,~,sans-serif} * html ~~~{ font-family: "MS Pゴシック";} としています。1つの手段です。 因みに、改行位置がずれる問題は、ウェブでの改行の認識が間違っています・・・ #1さんもご指摘の通り、文字サイズ変更の問題があるので、何処で改行されるかは貴方が決める問題ではないのです。 ユーザーが見やすいように変更するのです。 >只今試行錯誤、判断に苦しんでおり、 この辺の話は、その業者が十分検証しているはずですので、お任せすれば良いです。 (知らなければ、その業者への依頼は辞めましょう) 悩む必要があるのでしょうか? 悩み処が間違っています・・・ 貴方の知らないレンダリング問題でもこのような差異問題が多々あってフォント程度で悩んでいたら、これらの全ての差異を知ったら過労死しますよ。 コンテンツで悩んでください。

heron-griffin
質問者

お礼

こんにちは。早々に的確且つ詳細なコメント頂きまして誠にありがとうございます。 とても勉強、参考になる内容です。 そうですね、大げさに執拗に拘る部分でもないのかも知れませんね。プロがすべき領域にまで素人クライアントが絡んでくると、お互いにとってろくな事がありませんよね。仰る通りコンテンツが大事ですので私はそこに集中していきたいと思います。良いコメントどうもありがとうございます。

回答No.1

WEBサイトでは、OS別に利用するフォントをCSSなどでフォント指定をすれば可能なのですが、ブラウザでの「拡大」「縮小」によって横幅などがずれてしまいますので、ずれることを前提に設計をしたほうがいいと思います。 また、どうしてもフォントがもつイメージなどからフォント指定をしたい場合には、文字をPNGにて表示し、ALTタグに文字を設定するのが通常の使われ方です。

heron-griffin
質問者

お礼

御世話になります。早速のコメント、誠にありがとうございました。 なるほどユ-ザ-側での設定(拡大縮小)でも横幅がずれたりしますよね。 仰る通り「ずれることを前提に」設計をという事ですね。そうします。  全文とても参考になりました。どうもありがとうございました。