Exploring Tile Layouts with Bourbon Neat

Frequently in projects, I find it necessary to lay out a set of tiles (such as logos) on a “grid” system. Invariably different page designs have different requirements for layout: 6 up 5 up centered 4 up but with space on each side 3 up To date, I haven’t come up with a system that […]

Easier SVG Animation with Sass

I was working on a project recently where I needed to animate an SVG seven segment display. I thought that this would be a great place to use CSS animation and @keyframes but there would be a lot of repetition in the CSS so I scripted it with Sass. I’ve put together a Sassmeister example […]

Better Sass through Susy susy-get Function

Today we are continuing our look at Susy internals to get a better understanding of how Sass can be used in more advanced ways by examining the susy-get function. susy-get Function [gist id=”b36ea4d22606bea80c07″ file=”susy-get.scss”] Comments – Lines 1-5 Every Susy function or mixin that I’ve seen starts with a comment block that explains the purpose […]

Using an Image sprite in a Media Query with Compass

I recently revisited some old Sass code and needed to fix it to compile with the latest version of Compass. After I cleaned out the CSS3Pie bits (yes it was that old) I ran into the dreaded You may not @extend an outer selector from within @media. error message. It took me a bit of […]

Better Sass through Susy with-layout mixin

I really like the Susy grid library and it does some pretty intensive things and takes strong advantage of Sass features. Today, we’re going to look at the with-layout mixin (and the supporting _get-layout function and susy-inspect mixin) with the intent that we can learn more about Sass by looking at non-trivial real world usage. […]

Dash Docset for Susy

I’m a big fan of the Dash documentation browser and the Susy CSS grid framework, but it has bugged me that I couldn’t read the Susy docs in Dash. So I decided to fix it. I’ll update this post when my pull request is accepted and the Docset is available at the standard Dash location. If […]

Link Roundup

The stomach flu descended on our family this week and, while I didn’t get sick, I’ve been taking care of others who did. As a result today’s post is a group of links I’ve been reading and thinking about related to webdev and QA rather than something original. http://css-tricks.com/modular-future-web-components/ [Web Components] allow us to bundle […]

Use Google’s jQuery in WordPress for Better Performance

Page load performance is a big deal for retaining visitors and SEO. One of the simplest things you can do to improve performance is to use Google’s CDN-hosted jQuery. There are some good reasons to do this and some arguments against it. I find that while you need to be careful and test your site […]

http://collectiveidea.com/blog/archives/2014/01/21/mocking-html5-apis-using-phantomjs-extensions/ An interesting look at how you can test your code with HTML5 API’s where you can’t mock with something like VCR.

Responsive Design Testing Techniques

Popular screen resolutions from http://www.w3counter.com/globalstats.php Responsive design testing is critical when you’re building a responsive site. However, this testing takes a lot of effort due to the large number of devices and resolutions. Today we’re going to take a brief look at some techniques you can use to make this easier.