I Can Has Web

About a year ago, S.B.LattinDesign posted a really cool infographic named More Than Supplemental.

I found it about a month ago, and I really liked it! In fact, I liked it so much I wanted to make an interactive version of it, and Supplemental Interactive is the result. It isn’t quite finished yet (e.g. I want to include icons instead of abbreviations), but I believe my vision is communicated. It is available in multiple screen sizes (using RWD), but in my opinion is best utilized on wide screens.

I used a set of tools to make it: D3.js to visualize the data, jQuery to ease DOM-handling, Underscore for utility functions, Sass as CSS-preprocessor, Compass for extra mixins, Bootstrap for some good markup-handling, and Buster.JS to test the JavaScript. All of the code is available at GitHub.

Hope you like it! ^_^

Structuring CSS is not a trivial task, especially in large projects. Even smaller systems may become complex and hard to maintain when introduced to RWD. In this post I’ll describe how I approach implementing larger sets of CSS rules.

Continue reading →