さくらインターネットでWebフォントを使ってみる

このブログで利用しているのは、「さくらのレンタルサーバ」です。
月額料金は約500円。

この金額でありながら、昨年、Webフォントを無料で使えるようになりました。
しかも、モリサワのWebフォントです。
ようやく設定を作業しました。

設定は、簡単です。
まだ、どこにどのフォントを指定しようか決めかねていて、以下に見本を作りました。

さくらのレンタルサーバで使えるWebフォント見本

明朝体

リュウミン R-KL

リュウミン R-KL

リュウミン M-KL

リュウミン M-KL

見出しミンMA31

見出しミンMA31

A1明朝

A1明朝

ゴシック体

新ゴ R

新ゴ R

新ゴ M

新ゴ M

ゴシックMB101 B

ゴシックMB101 B

見出しゴMB31

見出しゴMB31

ナウ-GM

ナウ-GM

丸ゴシック体

じゅん 201

じゅん 201

じゅん 501

じゅん 501

新丸ゴ

新丸ゴ

デザイン書体

フォーク R

フォーク R

フォーク M

フォーク M

丸フォーク R

丸フォーク R

丸フォーク M

丸フォーク M

カクミン R

カクミン R

解ミン 宙 B

解ミン 宙 B

シネマレター

シネマレター

トーキング

トーキング

はるひ学園

はるひ学園

すずむし

すずむし

G2サンセリフ-B

G2サンセリフ-B

装飾書体

新丸ゴ 太ライン

新丸ゴ 太ライン

筆書体

正楷書CB1

正楷書CB1

隷書101

隷書101

UD書体

UD新ゴ R

UD新ゴ R

UD新ゴ M

UD新ゴ M

UD新ゴ コンデンス90 L

UD新ゴ コンデンス90 L

UD新ゴ コンデンス90 M

UD新ゴ コンデンス90 M

Webフォント利用の設定

概要は、さくらのレンタルサーバ機能詳細「Webフォント」ページにあります。
使用方法は、さくらのサポート「Webフォント機能」ページに書かれています。

まずは、コントロールパネルで設定

コントロールパネルの「運用に便利なツール」メニューに「Webフォント」が追加されていました。

そして、Webフォントを使用するドメインを選んで、「設定」ボタンを押します。

「Webフォント使える〜♪」と浮かれていますが、さすがに制限があります。
注意書きにあるように、使えるのは一つのドメインに対してだけです。

※ Webフォントは初期ドメイン、さくらの60種類のサブドメイン、独自ドメインの中から1つだけ登録できます。プルダウンからWebフォントを使用したいドメインを選択して、設定ボタンを押してください。

ブログやホームページで使う設定と指定

WordPressだったら、プラグインが提供されています。
詳細は、さくらのサポート「Webフォントプラグイン機能」ページで確認できます。

プラグイン使わなくても、さくらのサポート「Webフォント機能」ページにある通り、HTMLにスクリプトを挿入すれば使えます。
コピー＆ペーストです。
そして、Webフォントを利用したい文字のCSSにfont-familyを指定します。

見出しのフォント（書体）を変えるだけでも、雰囲気変わるんですよね。
物語やエッセイのブログなら、デザイン書体を使うといいかも。
妄想ひろがる、嬉しい機能です。