現在の接続環境は
です

記事内にプロモーションが含まれています。

プロモーションを含みます

webフォントNoto Sans Japaneseがとても綺麗

WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録

所要時間目安：約3分

This session is using　 IPv4 　is established in

今日は2025年5月15日です。

この記事は2016年4月1日のものです。現在は状況が異なる可能性がありますのでご注意ください。

目次に行く･戻る

2025年5月15日 (木曜日)本日の人気記事トップ１０

カーメンテナンスWAKO'S

2025年5月15日 (木曜日)↓における週間月間人気記事トップ３は？↓

  • 本日
  • 週間
  • 月間

  1. 省電源のため自動的に電源をOFFにします 2PV

    車にはバッテリーからの電気が必須になっています。また、そのバッテリー自体をエンジン始動時にはオルタネーターにてアイドリングストップ車などほとんどすべての車は充電しています。エンジンのみかかっていて運行…

    もっと読む

  2. エンジンオイルシーリング剤Plus91

    エンジンオイル漏れ止めのおすすめはPlus91評価レビュー 2PV

    以前、オイル漏れ・オイル滲みが分かりエンジンオイルシーリング剤であるNUTECのOEM版でpitworkのNC81エンジンオイルシーリング剤を使用してみました。 ですが、一時オイル滲み・オイル漏れが止…

    もっと読む

  3. Windowsスポットライト画像

    Windowsスポットライト画像保存場所と方法 1PV

    Windows10においてロック画面の時に表示される画像がとてもきれいになりました。 この機能は、Windows10以前のバージョンの時には単なるロック画面でした。 そんな綺麗な画像が気になったので、…

    もっと読む

  1. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 29PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

  2. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 20PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

  3. キッチンシンクからドブ臭い異臭原因解決方法

    キッチンシンク下がドブ臭い下水臭い原因と解決方法 19PV

    意外と知られていないのが、キッチンシンクからいつもと違う臭いや異臭や下水臭い強烈な匂いが出てくることがあります。いくらシンク内をカビキラーやキッチンハイターなどの塩素系漂白剤などできれいにしても・・・…

    もっと読む

  1. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 29PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

  2. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 20PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

  3. キッチンシンクからドブ臭い異臭原因解決方法

    キッチンシンク下がドブ臭い下水臭い原因と解決方法 19PV

    意外と知られていないのが、キッチンシンクからいつもと違う臭いや異臭や下水臭い強烈な匂いが出てくることがあります。いくらシンク内をカビキラーやキッチンハイターなどの塩素系漂白剤などできれいにしても・・・…

    もっと読む

webフォントNoto Sans Japanese

以前にwebフォントの導入方法を記載しました。

こちらでは、
webフォントのubuntuを使用しています。

しかし、
ひょんなことからwebフォントでNoto Sans Japaneseというとっても綺麗なフォント（webフォント）があるのを知りました。

この記事を読む方へのオススメ

メルカリ招待コード：

それは、RBB TODAYのメルマガでサイトを訪れた時です。

なんかやけにフォント（文字）が綺麗だなぁ…。(・・;

と思いソースを拝見させていただきました、。

そしたら、
見たことのないフォント名がありました。

 

それが、
Noto Sans Japaneseというwebフォントです。

もうwebフォントに関してはどのようなものなのか説明は不要かと思いますのでしませんが、

アドセンス336pxPC閲覧記事下表示1つ目コード

Noto Sans Japaneseに関しての説明はWikipediaのものを以下に引用させていただきます。

 

世界中の言語をサポートすることを目標に、Apache License 2.0 のライセンスで配布が開始された。2015年9月29日に、SIL Open Font License 1.1 にライセンス変更。 コンピューターで表示できない文字がある場合、文字の代わりに小さい四角(□)が表示されることが多いが、Googleではそれを"豆腐"と呼んでおり、Webから取り除くためにNoto(no more tofu)フォントを作った

ということですが、

具体的な使い方（方法）は以前の記事と同様です。

ただ、
まだ正式版？ではないようで、
Early Access!にて公開されています。

Thumbnail
GoogleFont Early Access!
Google FontのNoto Sans Japanese
Early Access!

正規版は、
GoogleFontsに現在2016年4月1日時点で708種類のフォントがあります。

Thumbnail
webフォントのGoogleFonts
708 font families shown
GoogleFonts

 

しかし、
ほんとに綺麗です！！

当サイトでも導入してみようと思い導入してみたのですが、
今までのwebフォントのubuntuに慣れたせいかNoto Sans Japaneseはとっても綺麗なのですが、
inline-heightが若干違ったのでちょっと元に戻してしまいました。

^^;

でも、
明日にはNoto Sans Japaneseにしちゃっているかもしれません。

だって、
本当にとっても綺麗なんだもん！！

びっくりしました。

当サイトでNoto Sans Japaneseを導入した際のスクリーンショットです。

webフォントNoto Sans Japanese

そして、
以下がwebフォントubuntuでのスクリーンショットです。

webフォントubuntu

この画像を見ていただくと一目瞭然ですが、
明らかにNoto Sans Japaneseの方が綺麗です。

しかし、
CSSで調整すれば良いのですが…。

横幅がちょっとだけ広く感じてしまいました。

時間のある時にNoto Sans Japaneseにしたいと思っています。

 

一応具体的な導入方法です。

 

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
 * {
 font-family: "Noto Sans Japanese",sans-serif;
 }

上記コードを、
CSSに追加するだけです。

 

この場合だと、
font-familyにNoto Sans Japanese以外にsans-serifしかないので、

最悪の場合はMSゴシップとかになっちゃうこともあるようです。

なので、
一応、ローカル内にもあるフォントも指定しておいた方が良いのかと思われます。

* {
 font-family: "Noto Sans Japanese","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
 }

といった具合にです。

そうすれば、
Macではヒラギノ角ゴが、
Windows7（WindowsXPでもメイリオ導入済み）以降はメイリオにて表示されます。

 

唯一、
webフォントのデメリットとして良く多くのサイトで書かれていますが、
私がこれまでwebフォントのubuntuを使用してきてページ表示速度が遅いなぁ。

とは感じたことはありません。
（鈍いだけかなぁ…。）

 

参考サイト）

Thumbnail
グーグルが日本語Webフォントを提供してた。これはWebフォントの大転換になるかも？
今日は、Webフォントの話題を。日本語Webフォントは、「使いたい、でも重くなるからちょっと」という人が多いと思います。でも、グーグルがクラウド上でWebフォントを提供し始めたことで……。
impress

Windows10サポート終了まで

Multiplex 広告

あなたにおすすめな関連記事

attachment_idページ非表示か404

WordPress カスタマイズ

WordPressコンテンツのないattachment_idを404or表示しない方法

  えーと、えーと、 ちょっとだけ不安な所（部分）がありましたので、 一応投稿していきます。 不安な材料というのは…。 他でもないアドセンスの規約違反に関することです。   どのテ…

もっと読む

インフィード広告アドセンス

CSSファイル圧縮

カスタマイズ ツール 伝えたいこと 備忘録 時事ネタ

サイト表示速度を高速化とAMPの為にCSSファイルをMinify圧縮する方法

えー、ブログやホームページを運用されている方であれば、一度は気にしたことのあるはずのファイル圧縮についてです。英語ですと、「Minify」と言います。中でもAMP対応する場合には、CSSのファイルサイ…

もっと読む

インフィード広告アドセンス

自動車税納税通知書

メンテナンス 伝えたいこと 時事ネタ 車

自動車税納税通知書が来ない…。再発行してもらった方法と自動車税一覧

新年度も始まり1ヶ月が過ぎました。 5月と言えば自動車税の納税通知書が来る月でもあります。そして、納付期限も同じ5月末日までです。ゴールデンウィークも明けて通常通りの営業や運行・運用に戻った世の中です…

もっと読む

インフィード広告アドセンス

パルスオキシメーター酸素飽和度測定

伝えたいこと 治療

パルスオキシメーター酸素飽和度測定おすすめ

今年に入ってから新型コロナの報道や情報ばかりで辟易してしまいますね。でも、軽症者や無症状者もいる中で重症者やお亡くなりになられた方もいらっしゃる事実・・・。この報道されている数字をどう考えるのかはさて…

もっと読む

インフィード広告アドセンス

年賀状ソフト筆ぐるめ

PC Windows10 ツール 伝えたいこと

年賀状ソフトおすすめ筆王、筆まめ、筆ぐるめ最新版で年賀状作成

もう12月です。早いものですね。年賀状の準備や喪中はがきの準備などに追われ始めていることかと思います。以前にWindows10でもWindows7やWindows8.1などにバンドルされていた筆ぐるめ…

もっと読む

インフィード広告アドセンス

スマホファースト

Stinger6 Stinger7 WordPress カスタマイズ スマホ 伝えたいこと 備忘録

スマホファースト用にStinger6Stinger7をカスタマイズ

WordPressはカスタマイズ性が優れているのは周知の事実だと思います。function.php内にしていする関数？などによっていろいろな事が出来るようになります。 また、テーマによってカスタマイズ…

もっと読む

【AmazonタイムセールSALE車＆バイク】！


人気の商品が日替わりで登場。毎日お得なタイムセール「Amazonタイムセール全体」

出展：Amazonタイムセール

人気の商品が日替わりで登場。毎日お得なタイムセール

年金倍増で日本経済は大復活する!デフレの終わり、第二の「高度成長」の始まり
¥2,070 （2025/05/15 06:05時点 | Amazon調べ）
Amazon
＼楽天ポイント4倍セール！／
楽天市場
＼ポイント5%還元！／
Yahooショッピング
メルカリ

あなたが訪問してから

⏰ 0 秒経過 🎉

入学入社まであと…入学入社祝いはどんなPresent（プレゼント）でどのように過ごされますか？

ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。

ブログサービスが始まってから:


カウントダウンタイマー

おすすめの記事一部広告


Total736


アドセンス336pxPC閲覧記事下表示1つ目コード

目次に戻る

よろしかったらシェアよろしくお願いします。

この記事タイトルとURLをコピー

-WordPress, カスタマイズ, カスタマイズ, 伝えたいこと, 備忘録
-,

目次に戻る

目次に戻る

コメントを閉じる

comment

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です


This site uses Akismet to reduce spam. Learn how your comment data is processed.