日本語Webフォントの「Noto Sans JP」をサイトで使うための手順をご紹介いたします。
簡単に綺麗なWebフォントが導入できますので、Webフォントの導入を検討されている方は、ぜひお試しください。
Noto Sans JPの導入手順
Noto Sans JPの導入手順は、至って簡単です。CSSで以下のように指定すれば、Noto Sans JPが使えるようになります。
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
body {
font-family: 'Noto Sans JP', sans-serif;
}
@importでフォントを読み込み、font-familyで”Noto Sans JP”を指定するだけです。
@importを使いたくない場合は、HTMLの<head>～</head>内に以下を追加してフォントを読み込みます。
<link rel="stylesheet" href="http://fonts.googleapis.com/earlyaccess/notosansjp.css">
文字の太さを調整したい場合は、以下のようにfont-weightを指定します。
h1 {
font-weight:900;
}
p {
font-weight:100;
}
あとがき
導入手順はとても簡単ですね。GoogleのCDN経由で提供されていますので、自前のサーバーにフォントを設置して読み込むよりも、高速でフォントを表示できます。
見た目も美しいですし、Webフォントを導入する際は、Noto Sans JPはおすすめです。