横浜市の中小企業向けホームページ制作やパンフレットのデザインは株式会社横浜デザイン

株式会社横浜デザイン

メールでご相談 メールでご相談
メールでご相談

ハマデザブログ

BLOG

  • わたしたちについて
  • どうしてWebサイトは必要なの?
  • 写真撮影について
  • 効果の出るWebサイトとは?
  • 成功するWebサイト制作
  • 制作コストを抑える方法とは?
  • Webサイト集客の仕組み
デザイン

日本語WEBフォントが無料で使えるって本当!?

お久しぶりのみどりです!


今日はWEBフォントの世界を、共に垣間見ましょう。

グーグルが日本語フォントを無料で提供しました

以前からグーグルさんのWEBフォントにはお世話になっていましたが、それは英語を使うときのみ。

なぜでしょう?それは日本語フォントがないからです。
本当に使いたいのは日本語・・・もう画像になんてしたくない・・・

そう思っていた矢先にグーグルさんから素敵な発表が。

グーグルがWEBフォントをクラウド上で無料で提供を開始

その名は「Noto Sans Japanese」

2014年7月から提供されていたらしいのですが、つい最近我が社のハイパーメディアクリエイターから教えてもらいました。w

見本 ↓↓
スクリーンショット 2015-06-18 13.33.47

なんと、7weightもあるみたいです。

早速導入です!

導入の仕方はいたって簡単2ステップ。

①スタイルシートの一番上に@import urlを記述。

@import url(http://fonts.googleapis.com/earlyaccess/notosansarmenian.css); 

②font-familyは変更したい要素のセレクタに記述。(例:全体を変えたい場合はbody内)

fontfamily: ‘Noto Sans Armenian’, serif;

思ったより簡単ですよね?
日本語は英語より文字数多くファイルサイズが大きくなりがちです。その為、導入すると読み込みに少々時間がかかるというマイナス要素もあるみたいですが、見た目が統一できるので良いですよね。

今回は無料でのご紹介ですが、銭を積めばこんなサービスもあります。

 有料WEBフォントが使えます!

無料があれば有料もあります。しかも有料は種類豊富です。

月額制で、”1フォントいくら”というものや、PV数で上限が決められているものもあります。
提供しているサイトがたくさんあるのでご紹介〜

TypeSquare [タイプスクウェア]

スクリーンショット 2015-06-18 13.16.34

http://typesquare.com/

FONTPLUS|フォントプラス

スクリーンショット 2015-06-18 13.20.54

http://webfont.fontplus.jp/

WEBフォント|アマナイメージズ

スクリーンショット 2015-06-18 13.22.45

http://amanaimages.com/font/web/index.aspx


奥深いWEBフォントの世界。
SEO対策にも、画像をテキストにすることは良いことだし、こういう最新の技術をどんどん取り入れていきたいですね。

今回のまとめ

進化していくWEBフォント。

限りなく広がるWEBの可能性に

興奮冷めやらないみどりなのでした!

この記事を書いた人

他にこんな記事書いてます

みどりの記事一覧

無料相談・お問合せはこちらからお気軽にどうぞ045-628-9844

お問い合わせフォームからのご相談は
24時間365日受け付けております。
お気軽にご相談ください

お気軽にご相談ください

© 横浜のホームページ制作 / デザイン 株式会社横浜デザイン

× 閉じる

ホームページについて何かお悩みをお持ちですか?

メールでのお問い合わせは24時間受け付けております。

お気軽にご相談ください