Entries

アイコンを合字Webフォントとして扱うSymbolSetが革新的にステキ

Symbolset teaser from Symbolset on Vimeo.



正直この発想はなかった!

symbolsetは、アイコンに特化したウェブフォント。

このフォントが面白いところは、アイコンを「合字」として割り当てていること。 まずはサイト上部の大きなテキスト部分がエディターになっているので、そこにheartやtweetなどとタイプしてみてほしい。ビックリするはず。

「合字」というのは、特定の文字ペアに特殊文字を割り振れる欧文書体のルール。日本ではなじみのない作法だけど、海外ではftやffなど、スペースが空いてしまう文字を特殊な文字で代替することがある。

SymbolSetはこれ利用して、フォントをアイコンとして活用できる仕組みを発明した。

たとえば、♥のアイコンを「heart」という合字に割り振っている。つまり文章内にheartという文字があれば自動的にハートが、「Twitter」という文字があれば自動的に鳥のマークが表示される。しかもデータ上はただの文字列なのでとてもセマンティック。

SymbolSetの利点

  • ベクターデータなので軽く、スケーラブル。
  • 画像ではなく文字なので、Googleやスクリーンリーダー・フレンドリー。
  • ULタグやLIタグ内にタイトルを列挙するだけで、アイコンメニューが作れる。



Symbolsetを導入すれば、面倒くさいアイコンは細々作ったり整理しなくても、まとめて使えるようになる。
現在はプレオーダーだけれども、これは試してみる価値がありそう!