ITエンジニア/デザイナ向けにオープンソースを毎日紹介

CSS1Kは1KBのCSSでどこまでWebサイトを表現できるかをチャレンジするプロジェクト。

CSS1KはCSS製のオープンソース・ソフトウェア。昨今のWebサイト開発ではCSSの存在を欠かすことができない。優れたWebデザイナーの作るCSSはとても美しく、分かりやすい。しかしCSS自体がとても冗長的なマークアップ言語であるために長くなりがちだ。


一例

idやclassの付け方、HTML自体の入れ子の深さによってもCSSはどんどん長くなる。しかし、そんなCSSの現状に甘んじることなくチャレンジするのがCSS1Kだ。

CSS1Kはその名の通り、1KBのCSSでどこまで表現できるかをチャレンジするプロジェクトだ。ルールは幾つかあるが、まず1024 bytesまでに収まることが大前提だ。さらに@font-faceや@importを使って外部CSSを読み込むのも禁止だ。


全く違うサイトに見える

元になるHTMLは決まっており、header、article、footerタグに分かれている。ほぼclass指定なしの素のHTMLだ。現在20を越えるCSSが登録されている。それらはまとめて見ることができる。同じHTMLをベースにしているのだが、CSSによって全く別な見え方になるのが面白い。


MOONGIFTはこう見る

CPUやメモリ、HDD、ネットワークといったリソースが溢れている現在ではリソースを節約して使う意味は殆どないかも知れない。だがデスクトップ以外でもリソースの少ないスマートフォンに対応する場合や、さらに組み込み系のWebブラウザなどになればさらにリソースは限られる。

同じ表現をする時にでも省リソースで済めばより高速に動作する。CSS1Kはそんなチャレンジ心溢れるプロジェクトだ。HTML5で向上した表現力を試すのも面白そうだ。たった1024 bytesでどれだけの表現ができるか、ぜひ見てほしい。

via CSS1K: A demonstration of what can be accomplished with only 1k of CSS - The Changelog - Open Source moves fast. Keep up.

CSS1K

jacobrask/CSS1K - GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2