I’ve been moaning about bloated web pages for some time now. Despite my protests, web page weights are rapidly approaching 1MB.
The CSS1K project illustrates what you can do with a single kilobyte of slim-lined stylesheet code. It’s been influenced by galleries such as Zen Garden and JavaScript competitions such as js1k.com but, to my knowledge, there’s never been a CSS challenge.
The rules are simple:
- You must style the HTML5 page at css1k.com.
- Submissions must be in a single CSS file up to 1,024 bytes in size (minification is permitted).
- Vendor prefixes do not count toward the total. You should submit non-prefixed code and css1k.com will add the browser prefixes for you.
- External resources such as images, fonts and @imports are forbidden. You can’t use data URIs either — shame!
- Cross-browser compatibility is preferable, but you can use graceful degradation if necessary.
- Your code must be released under the open source MIT license.
There are a few dozen entries so far. I particularly liked:
- Skewed — clever, although not a great user experience!
- Bbubles — great demonstration of CSS transitions
- Bookshelf — what did you expect?
- Desktop — Windows XP in 1K!
- Geocities — ahh, the nostalgia!
There are relatively few impressive examples so this is your chance to show off your ninja-like CSS skills! If you decide to post an entry, please leave your link in the comments below…