追記 20180416

最近のChromeのバージョンでは、以下サイトの方法が最良です。

• Windowsの游ゴシックをfont-weightを使わずにMacに合わせる方法 – わたしと納豆ごはん

必要な時はしばらくこんな具合で使ってみます。

font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", Meiryo, Verdana, sans-serif;

※ここから下は現在参考になりませんのでご留意ください。

参考サイト

• font-familyにChromeでも読みやすい游ゴシックを指定する方法
• 2020年まで使えるはずだったfont-familyおすすめゴシック体

以外と厄介なんですね…

妥協案

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium"),local("Yu Gothic");
  font-weight: 500;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold"),local("Yu Gothic");
  font-weight: bold;
}
body {
	font-family: "Yu Gothic", YuGothic, sans-serif;
}

たまにこんな塩梅で使っています。

body {
	font-family: "Yu Gothic", YuGothic, "Lucida Grande", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, Osaka, Verdana, sans-serif;
	font-feature-settings: 'pkna';
	letter-spacing: 0.5px;
}

比較画像を作ってみました。

• 游ゴシックとメイリオの比較

游ゴシックは16px未満だと本文書体としては厳しそう。