【Noto + YakuHanJP】日本語WEBフォント2018｜株式会社クインテット
こんにちは。 今回のテーマは「日本語WEBフォント2018」としています。 なぜこのタイトルなのかと申しますと、この記事の内容は2018年時点で、日本語WEBフォントを運用するベストプラクティスではないかと思い、WEBフォント導入を考えているみなさんの参考になればと思い執筆しました。 異論は認めます・・・ Windowsの日本語をなんとかしたい・・・Windowsの標準ブラウザフォントは、游ゴシックやメイリオになります。 しかし、Mac標準のヒラギノと見比べると、全体的に丸っこく子供っぽい印象です。 フォントの印象はそのままWEBデザインの印象に繋がるので、デザイナーとしてはフォントも制御下に置きたいところ。 そこで試していきたい「WEBフォント」。 その運用に至るまでにぶつかった壁と、その乗り越え方をご紹介します。 そもそもWEBフォントは何を使う？ファイルサイズの肥大化フォントレンダリ
Noto Sans の Web Font 対応とサブセットによる最適化 | blog.jxck.io
Intro このサイトのフォントに Web Font を適用することにした。 フォントには Google と Adobe が協同で開発した Noto Sans CJK JP を採用した。 また、このサイトでは使用しないだろう文字を削除したサブセットを作ることで、フォントサイズを最適化した。 フォントサイズの最適化 Noto font は、そもそも豆腐(フォントがなかった場合に代替表示される四角)が出ないように(No-豆腐)することをコンセプトにしているため、フォントの網羅率は非常に高い。 そのため Web Font として利用する場合は、全体だとサイズが大きすぎるため、言語毎に提供されるフォントセットの中から、必要なフォントのみを適用することになる。 本サイトでは、 ASCII 、記号、日本語のフォントを用いる。 しかし、特に網羅された漢字の中には、日常では使わない文字が多々ある。 加えて
無料で使える明朝体の日本語WEBフォント | Web技術Tips | ホームページ制作のDOE【横浜】
これまではホームページで明朝体を使いたいときは、従来のようにWindows用、Mac用と別のフォントを指定して、別のフォントとして表示させてきた気がします。（例えばWindowsではHGS明朝E、Macではヒラギノ明朝 Pro W6など） WEBフォントを使うとこういった異なるフォントを表示させるということもないのですが、筆者が知っている実践で使えそうな日本語WEBフォントといえばGoogleが提供しているNoto Sansフォントくらいで明朝体のWEBフォントは知りませんでした。 ということで明朝体の日本語WEBフォントについて調べてみます。 WEBフォントを探してみる 以下はいくつかの明朝体フォントをまとめて提供しているサイトです。 TypeSquare 明朝体だけでも19種類から選ぶことができます。 無料で登録ができ、月間1万PV、ドメイン1つ、フォント1つという制限はありますが、通
Webフォントを滑らかに表示させるCSS 2016年版 IE 11/Edge/Chrome/Firefox（Windows）
目次 ブラウザーによってWebフォントの見え方が違う 各ブラウザーの実際の画面で見え方をチェック font-smooth -webkit-font-smoothing transform: rotate(0.001deg) text-shadow: 0 0 0.1px rgba(0,0,0,0.5) CSSを適用した状態で各ブラウザーの実際の画面でチェック このブログ内の関連ページ 参考にしたページ サンプル画面として使ったサイト この記事へのネットの反応まとめ ●ブラウザーによってWebフォントの見え方が違う 今更ですが、日本語のWebフォントを会社のサイトで使い始めました。 元来、Webブラウザは端末にインストールされているフォントを呼び出し文字を表示する。端末のフォント如何では、Webデザイナーが意図しないWeb表示がなされてしまい、またフォントに関するWebデザインに制約が生じてし
游ゴシック？ Noto Sans？ 久々に日本語フォント指定について考える - やっぱりWebが好き - Writing Mode
少しパラパラと文字間が開いた感じがするけれど、個人的に游ゴシックはとても好きな書体です。 游ゴシックはWindows 8.1とMac OS X 10.9（Marvericks）以降に標準搭載されており、このまま普及が進めばWebデザイナーにとってファーストチョイスのデバイスフォントとなるのでは。 というわけで、Writing ModeもこれまでのWebフォント使用をやめて、游ゴシックを基本書体にしてみました。 2014年もまもなく師走ですが、久々のWeb制作ネタです。 Writing Modeはリリース以来、モリサワのTypeSquareを利用してゴシックMB101を基本書体にしてきました。 TypeSquare［タイプスクウェア］ 日本語フォントは欧文フォントと違って、文字数が多くファイルサイズがとても大きくなります。そのため、TypeSquareのようなWebフォント配信サービスは、フ
Noto Sans (源の角ゴシック) をWebフォントで使えるように軽量化する方法 - あなたのスイッチを押すブログ
ウェブフォントにハマりすぎて、かなり泥沼化していたのですが…。この度ようやく1つのゴールに辿り着くことができました。 その結果が「Noto Sans CJK JP」の採用です。 しかしこのフォント、Webフォントとして使用するには些かサイズが大きすぎるのが問題。そのまま使ってはページの読込速度に大きく影響してしまいます。 そこで必要なのが、フォントの軽量化。具体的にはこれを「サブセット化」と言います。 Noto Sans とは？ 最初にちょっと「Noto Sans」というフォントについてご紹介しましょうか。 これは、 Google が、Adobe と共同開発した無料かつオープンソースのフォントファミリーNoto Sans CJK をリリースしました。 via: Google、オープンソースの日中韓フォントNoto Sans CJK を無料配信。Adobe と共同開発 - Engadget
アドビ―Dreamweaverデベロッパーセンター
Enhance and extend DreamweaverDreamweaver provides its own API as well as the Common Extensibility Platform (CEP), and offers you the flexibility of using C++, HTML, CSS, and JS to build extensions for Dreamweaver. You can extend the Dreamweaver UI, add powerful features for building web apps and automate entire cross-application workflows. Build custom web development toolsImport database data in
【保存版】Webフォントの使い方と無料のおすすめサイト一覧（日本語・欧文） | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
先週、新婚旅行という人生最大級の贅沢を楽しんできたため、日本に帰ってきて放心状態になっている野田です。 もう少し逃げていたかった……現実から……。 という話は置いておいて。最近LIGのブログではフォントネタが頻繁に登場するようになってきたので、それに僕も便乗しようと思います。 Webに関わっている人でも、「フォントが大事なのはわかるけどWebフォントは設定していない……」 という人も多いんじゃないですか？ 今日はWebフォントの使い方とおすすめの無料で使えるWebフォントサービスをご紹介します。 「わからないこと」が一瞬で解決するかも？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGのスクールでは、現役デザイナーがマンツーマンで指導します！ ▼少しでも気になる方は、ぜひ公式サイトをご覧ください！
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【2019年版】Google Fontsの使い方：初心者向けに解説！
深夜、ピグモをWEBフォントにして遊ぶ。 – モジワク毎日
deform.jp - このウェブサイトは販売用です！ - 日本 アート デザイン デジタル ブランド ユニーク ヶ月 地図 リソースおよび情報
webフォントの使い方＆日本語対応webフォントまとめ