Refreshing responsive redesign with Pelican and Zurb Foundation

The times they are a-changin'

Like any busy solo developer, I often put the needs of my clients' websites before my own. When I have free time, I like to be free of computers and putter around the garden, go for a bicycle ride, or wander amongst the redwoods and beaches with my wife and dog in beautiful Santa Cruz County.

My previous site was a dinosaur. The layout used <table> and spacer.gif. The doctype was HTML 4. Ugly color scheme. Difficult to read. Useless navigation.

Web technology is a rapidly changing field, and it will continue to accelerate. It's impossible to keep up with everything and the new "shiny". Instead I look first to evaluate whether new technology has the potential benefit which exceeds the cost and risk. For the relaunch of my own website, I considered many options and ultimately decided upon the following.

Is server side processing really necessary?

When I first created my site, I used server-side includes (.shtml) for common elements, which I continued using in Lasso. And it was good.

Yet for the longest time I wanted to publish a blog. But my experience with managing WordPress as well as its verbose, bloated, slow architecture was a real turn-off. I also wanted to bring together all of my projects, my resume, and a few other bits and pieces into a cohesive collection.

Then there was PyCon 2011 in Atlanta. Brandon Rhodes inspired me with his tutorial of Sphinx. I could use a simple markup called reStructuredText and output beautiful, searchable HTML. Or PDF. Or epub.

A few years later while in the #pyramid channel in IRC, folks mentioned Pelican, a Python application that converts .rst and other source file formats to plain old HTML files. I would no longer need to be bogged down with a server-side dependency. I played around with it, but never took the initiative to rework my website. I still needed a design.

I am not a designer, I am a decorator

I had been using Twitter Bootstrap for a lot of my work. But it includes way more stuff than I could ever possibly want or need, and I feel that it is overused on the web. I wanted something small, fast, basic, and would give me flexibility to do what I wanted easily.

Then I started going to the Zurb Foundation meetups, just a short 30-minute drive over twisty Highway 17 to their offices in Campbell, CA. They led folks through a quick start at we started hacking away on designs in ten minutes. Foundation is fast and simple to use, and it uses SASS.

All the pieces came together at once. I wanted to reduce my dependency on Lasso and have a fast website. My experience with .rst, Pelican's plain old HTML output from .rst, and Zurb Foundation were the perfect combination. I found that Pelican has lots of themes. I chose the theme foundation-default-colours by Kenton Hamaluik, and modified it with FontAwesome icons and other tweaks to the Jinja2 templates and a nifty plugin written in Python that adds permalinks to section headers. I also added search capability with the Pelican plugin tipue_search.

I still have a little more work to do, including optimizing page speed and writing a Pyramid application that will send me email through a "contact me" web form. All in good time.

I am very happy with the new look.

Did you like this article? Please send me a Gratipay, as little as 25¢ per week!

Updates, suggestions and comments regarding this article may be sent to Steve Piercy, [email protected] or comment using Disqus.

Written by Steve Piercy in design on Sun, May 25, 2014.
Last modified: Thu, Dec 25, 2014
Tags: Python, Pelican, Zurb Foundation, responsive design, Lasso


comments powered by Disqus