Chromeでフォントに青と赤の影ができる

まず画像の説明を。
左側が問題が起きている状態のスクリーンショットで、右側上部は単純に拡大したものです。そして右側下部は、Chrome側で拡大をかけたものです。

起きるサイトはいつも起きていて、全ての文字というわけではなく、おそらくこの症状が出てるのは太字のみです。画像ではわかりにくいですが、文字の右側に青い影、左側に赤い影ができていて遠目では紫に見えます。また、画像右側下部のようにChrome側で拡大をかけると影は消えます。倍率は文字の大きさによって違うようです。
いつからか分からないのですが、原因は何でしょうか。

質問者からの補足コメント

• 回答ありがとうございます。
  Chromeでこの症状の起きるサイトをIEで開いてもその症状は起きず、問題なく表示されました。
  ClearTypeテキストチューナー等、教えていただいたことを試してみましたが改善しませんでした。
  画像は縮小されてしまうのですね。改めて貼ってみます。

  
  No.2の回答に寄せられた補足コメントです。 補足日時：2015/09/06 17:14

No.3 ベストアンサー 回答者： SortaNerd 回答日時： 2015/09/09 01:47

再現しました。

(45.0.2454.85 m、Windows8.1)
ちょっと不可解な現象ですね。おそらくバグです。
ClearTypeに限らずアンチエイリアス一般はアウトラインフォントに対して行うものですが、これはビットマップフォントなので本来ならアンチエイリアスは掛からないはずです。
しかし、おそらくChromeはWindowsの標準のClearTypeではなく独自のアンチエイリアスをしているのだと思いますが、それがビットマップフォントに対しても(太字の場合のみ?)アンチエイリアスを掛けてしまっているようです。
ビットマップは普通ならば画面のピクセルに合わせて表示するものですが、非整数の中途半端な位置に表示しようとしてそうなっていると考えられます。
ただし、1/3ピクセルづつずらすよう指示して表示させてみましたが、1/3づつずれるのではなくずれは1ピクセル単位なのに、なぜか全てが中途半端な位置に置かれています。ですので、中途半端な位置に表示するつもりはないのにそのように表示されていると考えられます。つまりバグです。

余談ですが、このサイトはいつの間にか画像サイズが大きくなってpngも使えるようになって進歩したと思っていたんですが、小さい画像も無理やり500pxにまで拡大するという馬鹿をやらかしていたんですね。相変わらずです。

この回答へのお礼

なるほど、バグですか。いつか直ると期待しておきます。
ありがとうございました。

お礼日時：2015/09/09 22:11

No.2 回答者： SortaNerd 回答日時： 2015/09/05 22:17

画像が縮小されているようで参考になりませんが、とりあえずClearTypeのことでしょうね。

Chromeに限らないはずですが、フォントの種類によって印象が違うのでしょう。
WindowsXP以降ではClearTypeという、文字の左右に色を付けることで文字を滑らかにする手法が導入されました。
詳しくはサブピクセルアンチエイリアスで検索してください。
Windows7くらいからは「ClearTypeテキストチューナー」でClearTypeの掛かり方を調整できます。色が見えるのが気になるならこれで調整すると良いと思います。もしくは色の調整からガンマ値を変えると良いかもしれません。

No.1 回答者： Nisson 回答日時： 2015/09/05 16:48

スクリーンショットがなんで、ボケてるんですか？

この回答へのお礼

わかりにくくて申し訳ありません。

お礼日時：2015/09/06 17:10