CSSだけで描画したフォント「CSS Sans」IE6とIE10でどれだけ違いが出るの?

2015.03.17Design

0
CSSだけで描画したフォント「CSS Sans」IE6とIE10でどれだけ違いが出るの?

Web表現進化の過程を文字通り “文字” で感じる。元々CSSはグラフィックを描画するためにある技術ではない。それでもCSS3の登場以降、一種の腕自慢として様々なチャレンジが行われてきた。『CSS SANS』はそこからさらに一歩進んだ"CSSだけでフォントを一から作る"というプロジェクトだ。プロジェクトの説明では「CSSはページのレイアウトや文字の調整は行えたが、唯一文字自体を描くことができなかった(だからこのプロジェクトを立ち上げた)」と語っているが、ここでは1文字に対して1つのdiv要素をあてがい、そこにCSSを適用することで無理やり文字を描画している。完全にCSSだけでの描画なためブラウザごとに文字の描画は大きく異なる。IE6で描かれた文字はまるで古代文字のようだ。サイト上では各ブラウザで実行した際のCSS SANSのグリフを確認することができる。また各ブラウザで描画されたグリフをアウトライン化したものを、フォントとして配布している。

ちなみにこれを読んでいる方はもう既にお気付きかと思うが、このフォントの実用的な意味は皆無である。それでも、ブラウザの進化をCSSの自由度に落とし込んだものを確認出来るという意味では意義深い。様々な人の手でWeb上での表現力がここまで向上してきたことに感謝しながら、このフォントが予期した通りに描画できないブラウザが、この地球上から一刻も早くなくなることをWeb製作者の一人として強く願っている。

Via.CSS SANS

TAG

ARCHIVES

SHARE