きれいなフォントが使えるようになったPosterous

PosterousのブログでTypekitを使ってきれいなフォントが利用できるとアナウンスがあったので、ぼくのPosterousにも設定してみました。

» Add beautiful fonts to your site with Typekit – The Official Posterous Posterous

デフォルトではタイトルはこのような感じのフォントですが

Posterous Font

 

設定後はこんな感じに

Posterous Font

 

SETTING内の「Theme and custimize my site」より設定します。

Posterous Font

 

「Advanced」の「Typekit」を選択。こちらからTypekitへサインアップ。

Posterous Font

 

登録が完了するとKitIDが発行。このまま「Cofigure Posterous」をクリックすると自動的にPosterousへこのKitIDが登録されています。

Posterous Typekit

 

これでPosterousでTypekitを利用するための事前準備が完了。次に「Edit your kit」よりフォントの選択へと進んでいきます。

Posterous Font

 

たくさんあるフォントの中から好みのフォントを選んでいきます。

Posterous Font

 

フォントを選ぶとTypekitのエディタが起動するので、こちらでTypekitのフォントを反映させたいCSSのセレクターを登録していきます。今回はPosterousのタイトルを変更させたかったのでh1を加えてみました。

Posterous Font

 

TypekitとPosterousがうまく連携してしているので、PosterousのHTMLやCSSに直接、手をいれることなくフォントを変更させることができました。他のサービスをうまく自分のサービスに取り込むという柔軟性に脱帽ものです。

はじめてTypekitを使ってみましたが、PCにインストールされているフォントに制限されることがなく、自分好みフォントを表示できるようになるというのは魅力ですね。

スポンサーリンク