• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• FrontPage/web へ行く。
  • 1 (2015-08-11 (火) 17:46:23)
  • 2 (2015-08-11 (火) 18:11:46)
  • 3 (2015-08-11 (火) 22:08:27)
  • 4 (2015-08-15 (土) 14:47:44)
  • 5 (2015-08-17 (月) 21:36:08)
  • 6 (2016-02-22 (月) 13:25:37)
  • 7 (2016-03-01 (火) 20:44:28)
  • 8 (2016-03-20 (日) 20:30:13)
  • 9 (2016-06-08 (水) 13:45:35)

---

Web †

webフォント 「Noto Snas Japanese」 †

→無料の日本語フォント【Noto Sans Japanese】があまりにも美しいので、ブログに使ってみた

→【Noto Sans Japanese】ブログの記事を綺麗なフォントで表示したいので最軽量化してみた

cssファイルにgoogleからフォントをインポートします style.cssに以下を追加

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

各要素にフォントを適応します(cssの最後に呼び出すとすべてに有効になると思います←確認様までに)

*{
 font-family: 'Noto Sans Japanese', sans-serif;
 }

Noto Sans Japanesは細いとさらにカッコ良いので、適度にfont-weightを設定しておきます。

 *{
  font-weight: 100;
  font-weight: 200;
  font-weight: 300;
  font-weight: 400;
  font-weight: 500;
  font-weight: 600;
  font-weight: 700;
  font-weight: 800;
  font-weight: 900;
 }

webフォント 「Source Code Pro」 †

https://www.google.com/fonts#UsePlace:use/Collection:Source+Code+Pro

@import url(http://fonts.googleapis.com/css?family=Source+Code+Pro);

*{ 
   font-family: 'Source Code Pro';
 }

Webフォントの軽量化 †

1. サブセットフォントメーカーのインストール
2. 第一水準漢字 のダウンロード
   第一水準漢字.txt

サブセットメーカーを使って、フォントサイズを小さくする

元の16MBから、圧縮後の-compだと、700KB程度に

使い方。(/fonts配下に設置した場合)

@font-face {
   font-family: 'NotoSansCJKjp-Light';
   src: url('./fonts/noto.woff'),url('./fonts/noto.eot');
}

body {
   font-family: 'NotoSansCJKjp-Light';
}