Google Fontsの Noto Sans JP を使用しているウェブサイトで、濁点文字と句読点が重なって表示されるバグ？に遭遇したのでメモ。
発生状況
- 文字コード：UTF-8
- スタイルシートからNoto Sans JPを読み込んで指定
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
※Noto Sans CJKでは発生せず - 「じ」「ぼ」と「句読点（、。・）」が連続した場合に発生
※下記画像を参照![]()
- Google Chromeで閲覧
※IEでは正常に表示される
2018年中旬ごろには起きていたかと思いますが、記事掲載時の最新版でも同様の現象が起きました。
なお、line-heightやletter-spacingは影響していません。
Noto Sans JP – Google Fonts
Google Fonts
Making the web more beautiful, fast, and open through great typography
fonts.google.com
上記の公式デモサイトに反映させた場合も同じように重なって表示されました。
回避方法（とりあえず）
いろいろ弄ってみたのですが、濁点文字と句読点の間に別の文字を挿入するのがお手軽でした。
下のようにhtmlソース中にコメントを入れる方法なら見た目に影響しないです。
じ<!-- コメント -->、
2018/12/7時点 バグ修正された？
数日前に職場PCで試したときはまだダメでしたが、先程デモサイトで試したら正常に表示されました（なお、バグはFeedbackから報告済でした。）