Q&A
「文字の感じ」もスクリーンショットで提示してみてはいかがでしょう。また、可能なら両方のURLを提示したほうが早いかもしれません。
いつもお世話になっております。
質問は表題の通りです。
サイト１とサイト２のある文字について、
検証で見るとfomt-size、font-color、font-family、line-height、letter-spacing(設定なし)、font-weight(設定なし)が同じなのですが、文字の太さが微妙に違うように見えます。
下記、サイト１とサイト２のコードなのですが、この場合、文字の表示のされ方に
差が出ることはあるのでしょうか？
本当に微妙な差なので、錯覚と言われれば錯覚のようにも見えるのですが、、
コードの問題なのか、コード上は同じ表示で、何か他の要因で太く見えているのか、、
サイト１
サイト２
その他必要なことがあれば追記致しましすので仰ってください。
よろしくお願いします。
追記
実際の表示のスクショです。
サイト１
サイト２
うーん、並べてみると一緒ですかね、、？
片方が作成中の為URLを提示できなくてすいません。
作成中のサイトであれば、文字列と背景色もあわせて確認してみてはいかがでしょう。
「font-weight(設定なし)」とのことですが、3つ目のスクリーンショットで、font-weight: normal が打ち消されているようです。一括指定とかで消えているんでしょうか？
当該箇所のHTML要素は同じものですか?
できれば構造が分かる程度にHTML構造を抜き出して書いてください。
回答2件
0
実際に適用されているスタイルは「computed」のほうを見たほうが良いのですが。
OSはWindowsですね。
であれば、双方の文字の見た目が微妙に異なるのは「ClearType」の影響と推測されます。
スクリーンショットを拡大してよく見てみると、文字のエッジが微妙に赤みがかっていたり青がかっていたりしているのが確認できると思います。これはClearTypeがRGB単位でピクセルのアンチエイリアスをコントロールしているからです。
ClearTypeのかかり方に違いがあるのは、背景色が影響していると考えられます。
また、異なるブラウザ間でもかかり方が異なると思います。レンダリング時のガンマ値が影響していると考えられます（特に游シリーズは違いが顕著に出やすいそうな）
投稿2020/05/28 06:13
総合スコア4447
ご回答ありがとうございます！
知識不足で申し訳ないのですが、、結局のところ、背景色を同じにしないと、文字の表示のされかたは同じにはならないという認識でいいのでしょうか？
「厳密に同じ表示」は、WebのHTMLに求めるものではありません。
と言いますと、、
すいません、自身でも調べてみたのですが、あまり知識がなく読み解くのが難しいのですが、
背景色、、うーん、、
html、cssではなく、PCやブラウザでコントロールされるものということでしょうか？
> html、cssではなく、PCやブラウザでコントロールされるものということでしょうか？
はい、OSやブラウザが異なれば表示は異なります。
0
「時間」と「民間」が同じ文字だったので、比較（暗）で重ねてみました。
だいたい同じように見えます。
もしかしたら、背景色の影響かもしれませんね。
投稿2020/05/28 06:04
編集2020/05/28 06:15総合スコア36074
ご回答ありがとうございます！
ちなみに背景色が違うと見え方が異なるというのはなぜなのでしょうか？
自分でも調べたのですがいまいちよく分からなかったので、お時間ありましたら教えて頂けると幸いです。
あなたの回答
tips
プレビュー
