CSS3 vs. CSS: A Speed Benchmark

Compares the speed of the same design coded twice: once with CSS3, and a second time using CSS background images sliced directly from the PSD…

Why we don’t have a parent selector

With work, I’ve had to do quite a bit of examination of performance. We run a number of tools over an application to determine where the bottlenecks are. One such application is Google Page Speed which provides a number of recommendations to improve JavaScript and rendering performance. Before I get into its recommendations, we need […]

How to Micro-Optimize Your CSS

In this article you’ll learn how to write leaner, cleaner CSS using 10+ micro-optimization techniques. The basic idea behind micro-optimizing your CSS involves writing clean code, eliminating extraneous characters, and reducing overall file size. And you don’t have to rely on an automated script to do everything for you. Instead of writing lazy, sloppy, bloated […]

Efficiently Rendering CSS

I admittedly don’t think about this idea very often… how efficient is the CSS that we write, in terms of how quickly the browser can render it? This is definitely something that browser vendors care about (the faster pages load the happier people are using their products). Mozilla has an article about best practices. Google […]

Detecting unused CSS selectors

An article about optimizing your CSS files. Has a list of tools and resources to help identify CSS classes and IDs that are not used…

15 Ways to Optimize CSS and Reduce CSS File Size

I have gathered a long list of CSS optimization and file size reduction techniques that have been using by most designers/developers. Depend on the complexity of your CSS code, these techniques might greatly reduce your CSS file size, or maybe just a few kilobytes…

Best Practices to optimize CSS – an academic exercise

Many of the tips in this article are tiny micro-optimizations, one thing to keep in mind when going overboard with optimizing. You should never sacrifice maintainability or extensibility for optimization experiments. Consider this article more like an academic exercise rather than real-life optimization tips. It should also be noted that if you need to speed […]

To Sprite Or Not To Sprite

The basic idea of CSS Sprites is to combine a number of images used on your site into a single image, thus reducing the number of HTTP requests that need to be made to your site. The image is rendered using a CSS background and background-position (which, incidentally, means that your markup becomes more complex; […]