12周年記念パーティ開催! 2024/5/10(金) 19:00

ピクセルグリッドのフォント選定と実装のプロセス

全3回

OSや端末の進化に伴い、Webサイトで表示されるフォントにも変化が起きています。ピクセルグリッドのコーポレートサイトのリニューアル時を例に、フォント選定と実装のプロセスを紹介します。

最終回 フォントの実装

前回までで、UIデザイナーによる使用フォントの選定が終わりました。今回は、その指定を元に実装した過程を紹介します。font-familyでフォント名を指定するだけと思っていましたが、使用するフォントや表示するブラウザによって、さまざまな違いがあったのです。

第2回 バンドルフォントの調査と選定

今回は、実際の選定のプロセスを紹介します。何よりも先にやらなければならなかったのは、各種OSに標準インストールされているフォントの調査でした。それを踏まえ、今回の選定コンセプトに合ったフォントを選定します。

第1回 フォント選定の準備

OSやブラウザのバージョンアップが進み、サイトで利用できるフォントに変化が出ています。このシリーズでは、ピクセルグリッドのコーポレートサイトリニューアルを例に、フォント選定と実装のプロセスを解説します。まずは、フォントを選定する前に考えておくことを紹介します。