エックスサーバーでWEBフォントの提供開始
私が愛用しているエックスサーバー http://www.xserver.ne.jp/ で、ウェブフォントの提供が開始になったという嬉しいニュースが飛び込んできました。
ウェブフォントって何?
ホームページのテキストって限られていますよね、そもそも、見るパソコンや、スマホなどにそのフォントが入ってないと表示できません。
なので、何も指定しないと、パソコンに入ってるフォントの普通のフォントが使われます。(デバイスフォントと言います)
デザインにこだわりがあり、特定のフォントで表示させたい場合は、スタイルシートで、入っている可能性の高いフォントを優先順位で指定します。
でも、すべてのデバイスに、きれいなフォントが入っているとは限らないので、人によっては、あまり美しくないWEBページが出てしまってる場合もあり、仕方ないことでした。
しかも、日本語フォントで指定できるのは、メイリオか、ゴシック程度、明朝もあまり美しくない明朝体のみで、美しいフォントで表示させたい見出しなどは、わざわざ画像加工ソフトで制作し、画像で見出しを置いていました。
ところが、ウェブフォントをつかえば、HPを設置するサーバーの方に、そのフォントをインストールしておいて、そちらを指定することで、おしゃれなフォントで、ウェブページのテキストが表示できる・・というわけです。
ウェブフォントのデメリット
今までいろんなデメリットが合って、ウェブフォントを使うのを諦めていることも多かったので、その代表的なものを記述します。
- 費用がかかる
ウェブフォントはそのサービスを利用するのに課金製のことがほとんどで、別途費用がかかります。webの森にサイト作成を発注していただいた場合でも、それを設置する技術手数料も発生してしまいます。 - 表示速度が遅くなることが多い
英数だけのフォントならまだ良いのですが、日本語はひらがな・カタカナ・漢字など膨大なデータ量になるので、これまで「重くなるから使うのやめましょう」と諦めることが多かったです。
ウェブフォントのメリット
- きれいでおしゃれ・差別化
デザイナーの意図した雰囲気で表現できるので、ブランド力をアップさせることが可能 - 見出しにフォントが使える
大きな見出しなどを画像で作成しなくても良いので、軽いデータにできる - スマホ対応しやすい
見出しフォントなのに、PCではこのサイズ、スマホではこのサイズ・・と細かく指定できるので、スマホ対応がやりやすく、美しいフォントで、しかも軽いデータで表現できる
ウェブフォントを体験
こちらのサービスで、ウェブフォントにしてみたところを体験できます。
URLを上の窓に貼り付けしてTryoutをクリックします
下記は、このブログをデフォルトで見た状態です
見出しをリュウミン(モリサワの明朝体できれいと有名なフォントです)にしてみると
今度は見出しを新ゴRにして、本文をリュウミンにしてみました。
というようなことができますので、自分のホームページなどで試してみてはどうでしょうか。
ウェブフォントの意味がわかると思います。
エックスサーバーのウェブフォントの説明
http://www.xserver.ne.jp/ ここへ行って、表紙からこちらのバナーをクリック
このような仕様になっています
明朝体 | リュウミン R-KL / リュウミン B-KL / 黎ミン M / A1明朝 |
---|---|
ゴシック体 | 新ゴ R / 新ゴ B / ゴシックMB101 B / 見出ゴMB31 |
丸ゴシック体 | じゅん 201 / じゅん 501 |
デザイン書体 | 丸フォーク M / フォーク M / シネマレター / はるひ学園 / G2サンセリフ-B / 那欽 / 竹 B / ぶらっしゅ / トーキング |
装飾書体 | 新ゴ シャドウ |
筆書体 | 教科書ICA M / 陸隷 / TB古印体 |
UD書体 | TBUDゴシック R / TBUDゴシック E / UD新ゴ コンデンス90 L / UD新ゴ コンデンス90 M |
仕様
ご利用料金 | 無料 |
---|---|
対象サーバープラン | X10プラン・X20プラン・X30プラン |
利用可能ドメイン数※1 | 1ドメイン |
月間基本PV※2 | 25,000PV/月 |
webの森ではエックスサーバーを使うことを推奨していますので、ご利用になりたい方はご相談くださいね。
ひとつのプランに対して1ドメインなので、WEBフォントの費用が発生してしまいますが、他のサーバーで設置するより、ライセンス費がかからないのでずっと安くできます。
(すでに完成したホームページに、WEBフォント導入の改造をする場合はサーバー移転もしないといけないですし、さらに費用が発生します)
関連記事
-
-
阿智村商工会主催 ホームページ勉強会と相談会
「WEBサイトを作ったけど、自己流なのでどうしたら良いかわからない。 効果を上げられるホームページっ ≫続きを読む
-
-
【Q】ウィルスに感染したために、サイトが改ざんされたというニュースを読んで不安です
「××社のホームページが改ざんされ訪れた人にウィルス感染の危険」こんな言葉でニュースになっているので ≫続きを読む
-
-
Dreamweaverで携帯サイトを作る方法
携帯(ガラケー)サイトの作り方なんてもう不要な技術なのかもしれませんが、自分でも、この記事の中身をも ≫続きを読む
-
-
画像のファイルサイズ、小さくしていますか?
webの森からお客様にウェブサイトを納品した後、お客様ご自身で更新している場合、画像の容量のことを考 ≫続きを読む
-
-
Canvaを使ってみました。「イラレやフォトショがなくても、簡単な画像くらいなら自分で作成したい」方のための….
私はEC実践会の自主勉強会や、お客様の指導で、HPの作り方をレッスンすることもあるのですが、そんなと ≫続きを読む
-
-
【Q】ホームページが大きくなるにつれてナビゲーションの管理(?)に困っています。ページを増やすたびにたくさんのファイルを変更しなくてはいけません・・
ナビゲーションは、ホームページによっては、サイトのヘッダーにあったり、サイドナビにあったりして、目次 ≫続きを読む
-
-
無料ツールや素材をダウンロードするときに気をつけよう
無料ソフトの紹介とか、無料素材配布などのサイトで、便利なものをお持ち帰りさせてもらおうとすると、知ら ≫続きを読む
-
-
【ホームページの作り方】スクールサイト・教室・教育機関のホームページ作成
学校のホームページを作る時、何を目的につくるか、誰が対象か、更新は誰がどんな方法で行うか、この点が大 ≫続きを読む
-
-
Q:ハッシュタグとカテゴリーの違いとは?
ハッシュタグ #SEO対策 とか #SNS入門 とか #サポート備忘録 とか。 ハッシュタグ流行って ≫続きを読む
-
-
【Q】SEO対策しませんか?という電話がありました。どこで調べたのか私の個人情報も結構知っていて不安です。
●●グループから電話がかかってきましたか? しつこい営業でけっこう悪名高いところなので無視していただ ≫続きを読む