Skip to content

Meritum Retirement Funds

I've recently finished work on the Meritum Retirement Funds web site and have added it to my portfolio. I want to highlight a few of the more technical bits here.

The CSS was written in SASS, specifically Compass, to make writing and updating the styles easier and quicker. This was my first project where I've dived in properly to using a pre-processor (rather than just tinkering) and I'm now a convert. The output is a little larger, but that can still be managed with careful writing and using of mixins (just as it can with regular CSS). I find that the trade-off in terms of time and ease of use is worth it. I also tried to take a more SMACSS approach and aimed to use as few id-based rules as possible, and element selectors only where necessary. Not that easy to do! ID attributes in the HTML were only used for locations in the document, classes for everything else.

Behind the scenes, the Theme began as the excellent HTML5 Boilerplate, which I've forked to include SASS folders. Since the Meritum site is powered by WordPress, I pulled in many elements of underscores to handle the Post and Page bits.

I also leaned strongly towards vanilla Javascript rather than jQuery. I really like jQuery, but loading the whole library when you're building Mobile First just feels wrong, especially when the JS needed was short and sweet.