Building a Shopify Theme

Shopify is an ecommerce platform that offers themeable store fronts online. I worked alongside the wonderful folks at Studio Tangerine to develop a Shopify theme. I’ve documented interesting aspects of the process below. Getting started If you’re familiar with my workflow it will be no surprised that I first translated the design into static HTML & CSS […]

Colour Accessibility

“Accessiblity” isn’t a scary word but many web folks shy away from it. Perhaps because the W3C guidelines are a little scary. The reality is website accessibility affects us all. Not just those of us who cross the threshold into a medically diagnosed condition. “I want to see like the colour blind” is a Chrome plugin […]

Building a WordPress Theme

I was delighted when Base Creative asked me to help build a beautifully designed website on WordPress. It’s always a joy to work with Base Creative knowing that my role is made easier by the care and attention they deliver. In this review I’ll showcase a few of the defining techniques and challenges that made this […]

New Origins

Greetings! It’s been a while, hasn’t it? The last few months were busy for me. That’s a good thing I suppose, I certainly need to earn a living. The only real downside of plentiful client work is the lack of time for my own projects. One of those, codename: “Origin”, is my personal front-end starter kit. […]

CSS only Responsive Tables

Four years ago I shared an idea to make tabular data responsive. Browser support was experimental and the workarounds were extremely hacky. I revisited the technique this week, cleaned it up, and I am pleased to say all modern browsers work perfectly. See the full demo on CodePen Here’s what basic overflow looks like: And if you want […]

Be careful with your viewBox

In Sara Soueidan’s article: SVG Style Inheritance and the ‘Flash of Unstyled SVG’, Sara explains the importance of having width, height, and viewBox attributes on SVG elements. This reminded me of two issues I ran into last week building my new design. I have an SVG sprite for social icons: .svg-icon { […]

A Bit of a New Look

I redesigned my website! This iteration has taken longer than usual because the visual changes are much more dramatic. I’m really pleased with the results: It’s been two years since I last updated the design. That is a record because it’s usually an annual tradition. Past updates include: 2014, 2013, 2012, and 2011. Last year I improved […]