New look for heisel.org

This Web site was looking old, [seriously old](http://en.wikipedia.org/wiki/Abe_Vigoda). So I finally sat down and redesigned for the first time since [college](http://www.journalism.missouri.edu/).

I started off by doing some wireframes in [Balsamiq](http://www.balsamiq.com/). It was nice enough, but I feel like it’s targeted more at desktop or mobile application developers than at Web designers. Still, it fit my bill:

* It was relatively cheap
* It ran on Linux and OSX (it’s an Adobe AIR application)
* It output is easily versionable text-based files (in this case XML)

I set up a [repository on GitHub](http://github.com/cmheisel/heisel-org-design), but because I’m obstinate I used [hg-git](http://hg-git.github.com/) to actually check out and modify my repo.

After the wireframes I rolled some HTML mockups by hand and got to know [Blueprint CSS](http://www.blueprintcss.org/) very well. In my case I only ended up writing [70 lines](http://github.com/cmheisel/heisel-org-design/blob/fa3edd07c61785594c711e72a9ed833e673345f1/heisel-minimal/css/master.css) of my own CSS.

The last step was setting up a clone of my WordPress instance and developing the actual theme, which ended up taking most of my time. The WordPress [theme development docs](http://codex.wordpress.org/Theme_Development) are not terribly concise or easy to navigate, but then I’m spoiled by [Django’s documentation](http://docs.djangoproject.com/en/dev/).

Side note: After spending the last three or four years developing in Python, Django and occasionaly Ruby I was surprised to find that I still remembered most of PHP’s syntax. I’d like those brain cells back, please.

About the design itself — the goal was minimal, as bloody well minimal as I could make it.

So minimal is what we’ve got. One, count it, one column – [in this economy](http://www.youtube.com/watch?v=qQ3Sq_dy0g8) who can afford two? I originally had elaborate plans to aggregate activity from the other sites I live at on the Web, but that’s why Sir Lee gave us <a href>. So we’ve got a sparse home page that shows you the latest post, Tweet and bookmarks, plus some links.

Hope you enjoy it — I’m glad to be rid of the [crazy dashed box and the floating ghostly Spirit of St. Louis](http://heisel.org/blog/wp-content/uploads/2009/07/heisel-org-version-3.png).

About Chris

Python developer, Agile practitioner trying desperately not to be a pointy haired boss.
This entry was posted in Site News, Technology, Web design. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s