Versions

Posted 3 days ago

After redesigning my site last year, I had the idea to keep an archive of my previous designs. You can click on the screenshots for a full image of the homepage of these designs.

Blogspot – February 2005

Version 1 – October 2005

I took an existing WordPress theme and modified it. We had spent the summer in Hungary so images from that trip dominate the header image. I also reused the idea of ripped paper on the sidebar that I had used on our family website which I designed before this one.

Version 1b – 2005 or 2006

The only change was that I updated the banner image. It harkens back to the idea of a “rutter” from my Blogspot theme. A rutter is a mariner’s handbook.

Version 2 – March/April 2006

I was inspired by the colors of the Final Four logo in 2006 (see below)

Version 3 (thirtyonethree) – October 2006

I was thinking a lot about craftsmanship at this point in my life. It is reflected in the Twitter handle, “webcraftsman”, I created a couple of months before. The inspiration for this design came from Exodus 31:3. Bezalel was a craftsman filled with the Holy Spirit to make “artistic designs” in the building of the Tabernacle. Craftsman is the word I would use to describe myself. And I hope that as I do my job, I am trusting in God and living out the Spirit-filled life as I work on designs or work out Web solutions for the many sites that I maintain and evolve. Read my article from October 2006 when I launched the design.

I was still tied down to the two column layout from the original WordPress theme I had modified in 2005. This design was mostly a reskin.

Version 4 (Chocolate) – 2009

I was inspired by some of the textures I was seeing in Web designs at the time. I had been particularly inspired by Jonathan Longnecker’s design for Sarah Longnecker. I had painted my kids room a chocolate color and decided to use that as the basis for my design.

Version 4b – 2010

I added an introduction with a link to my portfolio and my about page. I was looking to make a career change. Up until this point, the homepage had just featured all the text of my latest blog posts and a lifestream in the right column.

Version 5 – April 2012

I was tiring of the chocolate design but was not overly inspired with a new design. I decided to do something very simple using the basic colors which would randomly change the banner background and the heading text. The site build was my opportunity to put to practice the Sass skills I was gaining at the time. This was the first project I built with Sass. My intention was to replace this basic design in the future when I felt more inspired. That new design did not come until 2024.

This version of the site was still fixed width. I converted it to a responsive design in November 2013.

Version 6 – July 2016

I wanted to refresh my site but still did not have a fresh design idea to redesign the site. I stuck with the same random color scheme. I decided to add an angled shape for the header and footer. I had built some sites that had these types of elements and wanted to add some more visual interest. I also decided to change the layout on my homepage. I added back an introduction section and then used a Grid to show my latest published articles. I also added a simple tagline to explain what I did. I found it much easier to tell people that “I build websites” rather than say that I was a “front-end developer.”

Version 7 – January 2024

Since I moved from being a designer to a developer, I just have not had the itch to redesign my site like I did before. I looked at a lot more site design inspirational sites earlier in my career and would get ideas that I wanted to try from that.

I was recently inspired by several different personal sites–Ethan Marcotte (his 2020 redesign), Michelle Barker, and Robb Knight. (By the way, I love Ethan’s 2025 redesign.)

I played around with some ideas for a couple of months and then finally started building those ideas out at the beginning of 2024. I decided to built the site with a light and dark theme. I also made use of a Grid to experiment with some different layouts (mostly just positioning of some elements as full width or two column spans). The new design evolved a bit in the first month to what you would see today.

Read more about the design of version 7