CSSでwebフォントの読み込みが遅い問題を改善する方法 - Qiita
💀 Webフォントの問題点 Webフォントに限らず、ブラウザでテキストを表示する過程には、フォントの読み込み作業が存在します。また、フォントを読み終えるまではテキストを表示させない機能1がブラウザには組み込まれています。 ローカル環境下のフォントであれば読み込みに時間はあまりかからないので問題ありませんが、webフォントの場合はローカルフォントと比べると読み込みに多くの時間を要してしまいます。 この機能の影響で、ページのロードをしてからテキストが表示されるまでの間、ユーザーはテキストを読むことができない為、不満や苛立ちを覚え、体験価値の低下やページの離脱を引き起こすと考えられます。 ⚔️ 'font-display'プロパティでこの問題に立ち向かう font-displayというCSSプロパティを用いることで、webフォントを読み終えるまではローカルフォントを代替的にロードし、テキストの
連続する約物の、「←アキ」が解消！ 約物Webフォントが無償公開 ● type.center
webブラウザで記事などを読む際に「かぎかっこ」、（まるかっこ）。そして読点、、、、、句点。。。。。これらいわゆる「約物」が連続して並んだときに、「←このアキとか→」「←このアキ」が気になったりすることありませんか？ （（（（> _ <）））） DTP用のアプリケーションだと、文字組み設定でいろいろと調整可能なのですが、webブラウザで表示される際にはそうはいきません。必然的に全角一文字ぶんの字幅が割り当てられる、いわゆる「ベタ組み」となるため、「←アキ→」「←アキ」がけっこう空いて見えるなー、ということになります。 今回、この約物が連続して並んだときに自動的にそのアキを調整してくれるフォントが開発され、無償配布されています。 特定の約物がふたつ連続すると、それらをひとつの「合字」として表示する「YakuLiga （ヤクリガ）」と、OpenTypeフォントの機能「前後関係に依存する字形（c
よく使うアイコンWebフォントのフォントセットとジェネレーターまとめ
Webページ上でベクターのアイコンを簡単に表示できる憎いアイツ。そう、アイコンWebフォント。 Retinaディスプレイでも綺麗に表示されるし導入は（そんなに）難しくないし至れりつくせり。 セマンティック？なにそれおいしいの？ そんなわけで今回はよく使っておりますアイコンWebフォントのセットと、ジェネレーターをまとめてみました。 ※紹介しているフォントを使用する際は、ライセンスを必ずご確認ください。 Font Awesome とっても有名なアイコンフォント、Font Awesome。600を超えるアイコンを使用できるのが特徴です。ソーシャル系のアイコンも揃っております。線のRは少し強めの印象。 個人・商用利用なのも嬉しい。 Font Awesome, the iconic font and CSS toolkit Entypo キリッとしたアイコンがエレガントなイメージなのがEntypo
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
