Webデザイナーのためのタイポグラフィ入門

Webデザインにおけるタイポグラフィの考察

タイポグラフィについて学べるおすすめのスライド、記事を紹介します。

2015年のフォント総括

最近のWeb周りのフォントのトレンドが分かります。日本語のWebフォントについても紹介されています。

Webデザイナーのためのタイポグラフィと文字組版

Webでの文字組版の考え方が学べます。「5分で把握する和文フォント20年弱の歴史」が面白いです。スライドで紹介されているMacのフォント管理ツール、「FontExplorer X Pro Mac」はおすすめです。

デザインに自信がつく、タイポグラフィの基本

ちょっとした工夫で、「普通のテキスト」を「デザインされたテキスト」に変える方法が紹介されています。

Webデザイナーのためのタイポグラフィ入門1

タイポグラフィとレイアウト、要素と空間のバランスについて学ぶことができます。

テキスト周りのスタイリングに使えるCSSプロパティやスニペット

テキスト周りのスタイリングに使えるCSSプロパティやスニペット
テキスト周りのスタイリングに使えるCSSプロパティやスニペット

文字間隔を調整する、先頭の文字を字下げする、2行目以降を字下げするなど、実践で使えるテキストまわりのCSSがまとめられています。コピペで使えます。

Webデザイナーが知っておきたい美しく表現力のあるタイポグラフィの基本原則

Webデザイナーが知っておきたい美しく表現力のあるタイポグラフィの基本原則
Webデザイナーが知っておきたい美しく表現力のあるタイポグラフィの基本原則

タイポグラフィの基本、フォントの選び方、いますぐ使える12の小技が紹介されています。タイポグラフィ初心者におすすめの記事です。

Webデザインにおけるタイポグラフィの考察

Webデザインにおけるタイポグラフィの考察
Webデザインにおけるタイポグラフィの考察

行間(line-height)、字間(letter-spacing)についての考察にはじまり、テキストが中央寄せの時の工夫、均等配置(行頭行末揃え/ジャスティファイ)など、深い考察が参考になります。

Font−familyのベストな書き方 2015年版

Font−familyのベストな書き方 2015年版
Font−familyのベストな書き方 2015年版

font-familyの書き方は、人によって結構こだわりがあったりします。基本は覚えておきたいところです。

デバイスフォントを使うなら絶対取り入れたい!フォントをきれいに見せる小技まとめ

デバイスフォントを使うなら絶対取り入れたい!フォントをきれいに見せる小技まとめ
デバイスフォントを使うなら絶対取り入れたい!フォントをきれいに見せる小技まとめ

CSSを使ったフォントスタイルの基本的な設定についての解説です。

有名サイトのフォントまわりのCSS指定状況

有名サイトのフォントまわりのCSS指定状況
有名サイトのフォントまわりのCSS指定状況

朝日新聞、産経新聞などの大手新聞社、VOGUE、ELLEなどのファッション系サイト、東洋経済オンライン、ダイヤモンド・オンラインなどのビジネス系メディアなど、大手メディアサイトのフォント周りのCSS指定状況についてまとめられています。

ブラウザにおける縦書き最新事情 第1回 縦書き実装の今

ブラウザにおける縦書き最新事情 第1回 縦書き実装の今
ブラウザにおける縦書き最新事情 第1回 縦書き実装の今

縦書きデザインのサイトを考えている人は、一読の価値があります。

[最新版] Noto Sans JapaneseをWebフォントとして使う方法

[最新版] Noto Sans JapaneseをWebフォントとして使う方法
[最新版] Noto Sans JapaneseをWebフォントとして使う方法

NotoフォントはGoogleとAdobeが共同開発したフォントです。「世界中の言語を1つのフォントセットで表現する」という野心的なコンセプロのもと、漢字の収録文字数もかなり多いです。ただし、デフォルトでは、日・中・台・韓のフォントが一緒になっているので、10MBを超えてしまいます。軽量化・高速化の対策は必須です。

Windows 10 によってインストールされるフォント

Windows 10 によってインストールされるフォント
Windows 10 によってインストールされるフォント

Windows 10に標準搭載されているフォントが一覧で紹介されています。

iOS Fonts A Place for Happy Typograph

iOS Fonts A Place for Happy Typograph
iOS Fonts A Place for Happy Typograph

iPhone、iPad、Apple Watch、Apple TVなどiOS端末に標準搭載されているフォントが一覧で紹介されています。

El Capitanで追加された日本語フォントをCSSで指定する

03
El Capitanで追加された日本語フォントをCSSで指定する

OS X El Capitanに追加された日本語フォントをCSSで指定する方法が紹介されています。

関連記事

フォントの人気記事

無料でダウンロードできる英語の筆記体フリーフォント102選(商用明記)
無料でダウンロードできる英語の筆記体フリーフォント102選(商用明記)
商用可の日本語フリーフォント100選【2016年版】
商用可の日本語フリーフォント100選【2016年版】
同人誌に使えるフリーフォント21選
同人誌に使えるフリーフォント21選

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

コメント

  • Posted on
  • Updated on
  • Views 719