A New Year, A New Design for rachelbrandon.com

At a New Year’s gathering I was asked (forced) to put a resolution into a bottle to be revisited next year. Not wanting to fail and having a desire to accomplish something in 2011, I decided on the following approach:

Complete one of the following in 2011:

  1. Go to South America & Antarctica. They are the only continents that I have yet to grace. I have the trip planned in my head, both in one shot, but I know the PTO days just aren’t there this year. I’ll get there eventually.
  2. Write a book, TV show, or movie. Before you laugh, I have two good ideas that need to go into production. However, I haven’t been in the writing mode this winter. It’s February and this is first blog post of the year for crying out loud.
  3. Redesign rachelbrandon.com. You know how sometimes you just want to have resolution for something you have an inkling you are going to do anyway? This is it. Mission Accomplished. Bring on 2012.

Motivation

With the resolution out of the way, I thought I would share my motivations behind the redesign. Honestly, I got tired of the now defunct design. I got bored with my font choices and font styles and the empty space above a blog post bothered me. Other issues included that it took too long to load, and wasn’t very mobile friendly.

I may be being a bit harsh on myself. The old Design wasn’t by any means a bad design and I still think its an unique concept for a blog. It’s just that things change, and they change a much faster rate in the web world then they do elsewhere. To paraphrase a saying I hear frequently in my office: Ten years ago on the web is like a hundred years in history.

Therefore, I felt it necessary to continue to hone in on my chosen trade and create something new.

Improvements

Here are a few improvements that you will be able to experience and take advantage of. Just a note, the following should meet a nerd and a novice halfway. Meaning, there probably won’t be enough technical talk to make the nerd completely happy, erstwhile being too technical for the novice. Either way, there is something in here for you!

Responsive Design / Mobile Friendly

The site is now responsive, meaning that if you decrease the size of your browser window the site will scale from 1140px wide all the way down to a single column site. Try it. It is kind of amusing.

This is good news for mobile and iPad/tablet users as this site will scale to fit your screen width without the need to side-scroll or squint too much.

Responsive design was a hot topic in late 2010, and I used the code structure available on cssgrid.net. The structure was fairly easy to implement and this is definitely the direction the web is/should be heading. If you are a developer type, I highly recommend checking this out.

Readability / Typography

When coming up with this design, I put the largest emphasis on readability. All this means is that I started with the text in a post and worked backwards to create the remainder of the site. I want to make sure that when you read a post you don’t have to strain and can read without realizing you are reading.

It is now possible for designers to be a bit more creative in our font choices. Therefore, I matched a sans-serif heading (League Gothic) with a serif font (Georgia) to create a nice contrast with a thick sans-serif font & a thin serif font in the body copy.

This is because in 2010, improvements were made that now allow for designers & developers to use fonts that are loaded onto a server. Meaning the possibilities far outweigh the days when the only options were Arial, Verdana, Courier New, Times New Roman, Georgia, and Comic Sans.

For the nerds, I use and prefer a service called Font Squirrel for my font replacements. Others I know use Typekit among others. Simply put, as long as you have the license to use a specific font on the web, you can use it. Yea.

Other Improvements

Outside of the previously mentioned improvements, I made a few other minor adjustments, like integrating social media (feel free to share this site), seeing an excerpt of the comment in the sidebar instead of just the name of the commenter, and the ability to have a thumbnail (upload one at Gravatar). I also implemented the Featured Images available within the WordPress3 default install, allow for more imagery throughout the site!

Wrapping it up

Alright nerds and novices, that wasn’t so bad now was it? Thanks for hanging in there. Feel free to suggest things that you feel would make reading this site more enjoyable, and Rachel and I will take them into consideration. Especially with 2012 and a possible redesign right around the corner.

5 Responses to A New Year, A New Design for rachelbrandon.com

  1. Beth

    I like the new look. Well done on both the redesign and completing your resolution so quickly! Now, get your wife to blog to! I miss her writings!!!
    :)

  2. Ben Coyour

    Nice work Brandon! It’s awesome to see how far you’ve come in your web design and development skills. Keep it up!

  3. Nice new look! I’m excited to hear a bit more about the writing once it gets “into production” too.

  4. Well done. I like the homepage concept, and keeping with the his/her theme.

    Not sure about the colors, but put it all together and it works. Now let’s see some sports commentary!

  5. Brandon

    All,

    Thanks for the compliments. I also appreciate that most of you just come for the writing, which is a good thing considering this is a blog, and does encourage us to write more.

Submit a comment:

Your email address will not be published. Required fields are marked *