タグ

2019年11月7日のブックマーク (3件)

  • Noto Sans CJK JP フォントをダウンロードしてサイトに適用する手順 - Qiita

    CSSの埋め込み方まで詳細に説明している所がなかったのでまとめてみました。 デモプレビュー 書き出しサンプル + デモデータ 一式 1. フォントダウンロード 2. アプリインストール サブセットフォントメーカー WOFFコンバータ OTF → WOFF + EOT WOFF → TTF http://opentype.jp/woffconv.htm 3. サブセット化 サブセットフォントメーカーを使用してフォントをサブセット化しファイルサイズを削減します。 以下、アスキー文字 + 非漢字文字 + 第1水準漢字でサブセット化すると 16MB→700KB 位になります アスキー文字 !”#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~¡¢£¤¥¦§¨©ª«¬

    Noto Sans CJK JP フォントをダウンロードしてサイトに適用する手順 - Qiita
  • Noto SansをWeb font化しようとした時にハマった話 - Qiita

    Googleが、Noto SansというFontをOpen Source Licenseで配布を始めました。 Noto Sansの日語/中国語簡体字版のFontをWeb Font化しようとしてハマった時の話と、最終的にWeb Font化した成果物をおいておきます。 Web Font化の全体の流れ & ハマりポイント ttfやotf形式のFontをWeb Font化するには、以下のような流れで処理します 1. 元のFont fileをDownloadする 2. FontをSubset化する 3. Web fontとして使える様に各種形式に変換する (一般的にはeot, ttf, woffの3つを用意しておけばOK) 4. cssでfont指定する が、ここでポイントなのが2です。 ご承知のように日語や中国語などはFontのFile sizeがそもそも大きいです。例えば上記のNoto Sa

    Noto SansをWeb font化しようとした時にハマった話 - Qiita
  • Webにおいて明朝体はNoto Serif CJKを使うべし -IE11対応版|TechRacho by BPS株式会社

    こんにちは。5月に産休育休から復職したデザイナーのニシです。 最近、健康と体力作りのために筋トレを始めました。毎日昼休みにコヤマさんと一緒に10分ほど筋トレしてます。皆さんもいかがですか。 今回は、レスポンシブサイトをデザイン・コーディングする際に明朝体の指定は何にするのが一番いいのか、試行錯誤した結果得た最適解を書きます。 最初に:結論 先に結論をいうと、 Google FontsのNoto Serif CJK(源ノ明朝)を使う IE11対応のためGoogle Fontsの設定で「Japanese」を必ず選択する です。Japaneseを選択しなかったというだけでかなり、右往左往してしまいました(後述)。 Google Fontsとしては他にも明朝体の選択肢はありますが、癖のない良い感じの明朝体というとやっぱりNoto Serif CJKかなーと思います。しかしいずれ、さわらび明朝も使っ

    Webにおいて明朝体はNoto Serif CJKを使うべし -IE11対応版|TechRacho by BPS株式会社