Compass and Slicy Will Make Your Sprites and Write Your CSS

Making sprites sucks. They’re incredibly useful for web development since they keep assets minimal and HTTP requests (and thus loading times) low, but they are a huge time sink: somebody has to Tetris together a bunch of tiny images into one file so that they fit in as little space as possible, then figure out all the dimensions and coordinates of every little icon, make up class names for every single one, then write a bunch of verbose CSS so you can actually use the individual icons in the sprite. What a pain.

I used to argue with our designers about who should build sprites. But even if I escaped the burden of creating one, writing the related CSS was painful too. Adding a new icon to a sprite was regularly a source of mental anguish. Our main sprites can easily have over 50 different images and icons in it — when you run a huge website like the Behance Network or a complex web application like Action Method, it’s not unusual to be dealing with that many different icons. So we changed our spriting process completely.

Read more →

How We Used Sass to Build 17 Websites in Five Days

On Wednesday, April 4 we launched 17 websites all at once. They were our 17 Served sites, which included 12 previously existing ones and 5 brand new ones, all with a fresh new makeover. Development was completed two days prior to launch, and started five days prior to that, with a team of only three front-end developers.

Five days to build 17 websites?! You heard right! With heavy utilization of some advanced Sass’ techniques, we built 17 websites in 5 days, a feat we almost definitely could not have accomplished without the power of Sass variables, partials, logic and imports.

Read more →

The New Behance: Better, Faster, Stronger with Sass

The new Behance features a multitude of new ways to explore and discover creative work. But what about the code that powers everything you see and interact with? What’s making everything look so good and feel so smooth?

A big part of the answer is CSS. There have been a lot of advancements in web development recently, not only in terms of the HTML5 and CSS specs but also in the multitude of tools that have been created to assist in CSS development. We can build cooler websites in less time, and the rapid release schedules of popular browsers like Firefox and Chrome mean that web developers can deliver more awesome faster than ever before.

Read more →