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, 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