Image 01 Image 01
3
Blog-Over: Re-designing SimpleHelp

I’m proud to announce the completion of Blog2Life’s first Blog-Over (blog make-over).

This was the first time that Blog2Life had run such a service and although it was quite lengthy it was a very rich and exciting experience. As will all new things comes a large learning curve that must be over-come to reach the final project.

In this post I’d like to talk about the whole design process and show how it progressed.

How did the service come about?

The idea to begin doing blog design make-overs occurred to me one day while investigating blog theme’s and blog design.

After placing an advert on my website for a few weeks I received about 8 people contact me about having their blog redesigned by myself.

Ross found my advert on a bloggers forum and sent me a message via the private messaging feature. After asking a few question on his site, traffic and rankings and after receiving a very detailed response I accepted to redesign his website SimpleHelp.

This is the how the original website looked:

Old SH Layout

The Design Process

The design process commenced with Ross giving me an in-depth email on all the specifications and design aspects he would like to see on the new design along with a list of plug-ins he was currently using. Here is a small section what he was after:

I don’t really have a strong opinion on columns - 2 or 3 is fine with me. I also don’t mind if they’re not arranged the way SH current is (one small column - one main (large) column - one small column). Using 3 like engadget (http://www.engadget.com/) would be OK with me.

I don’t object to using a background colour other than white, but I do NOT want to have a dark background with light text. A light background with dark(er) I have always found easier to read. Eg. http://www.lifehacker.com/

After a short discussion on msn and looking at traffic received to the website over the last year it could be seen that only a small proportion of under 10% of all his visitors were using resolutions under 1024px width, and with a much larger area of web space opened for use with a resolution of 1024px x 768px it was decided that the website layout would be geared towards 1024px by 768px users.

With all this in mind and no specifics around the colour or the logo except it being simple and visually appealing I began work on several different logos for SimpleHelp. Branding power is a strong advertising tool and can be a very helpful tool in helping previous visitors recognise a website they have visited even if they don’t remember the name.

This is what I came up with:

SH Logo Designs
None of these were actually used on the final product but the following logo from above was taken on and developed slightly more, (final logo later on):

SH Logo Forward

The first 3 layout designs that were created were deviations of the original layout of simplehelp.

Design 1

SH Design 1

Design 2

SH Design 2

Design 3

SH Design 3

These was dismissed due to the content area being very thin because of the sidebar taking up lots of space and it was decided that the 2nd sidebar should be reduced right down in size to allow for a larger post area.

After a week of discussion and posting about advertisement placement and further development of the logo it came to my attention that the current designs (above) were just way too complicated and the coding for it was ever increasing in complexity.

So after further research into some different styles of blog design I decided to throw together a new rough design and show it Ross. Using a variation to the colour code and a completely different structure to the site I managed to come up with the following design. And Ross immediately went for it.

SH Design 4

From this point onwards to old designs were dropped and the new one was developed.

I looked into different plugins that could be used on the website to help improve and aid Ross with the running of the site. And Ross mentioned all the current plugins he was using for implementation.

This is a screen shot of the final logo:

SH Logo

Here is a screen shot of the current working site..

SH Current Design

Here is a Link

As you can see it has changed slightly since the picture above due to new advertising systems and habits on the website.

Business Card

I also developed a business card for Ross to help him further advertise his website as follows..

SH Business Card

Did the redesign improve traffic and profits?

Since the implementation of the new design Ross has seen an increase in the number of pageviews per visitor coming to the site which he attributed to the redesign. He also saw an increase in profits from the website based on the new advertising methods we investigated and implemented on the website such as a block advert at the top of his content.

Appraisal

Jamie did a fantastic job redesigning my site. One of the many benefits was that due to his SEO friendly theme, several of my pages became more prominent in Google search results, and the domain itself went from a PageRank of 5 to 6.

Working with Jamie was a genuine pleasure - he was always willing to put up with my constant requests for change, and ended out creating exactly what I wanted. On top of that, he had suggestions along the way that I had never even thought of, much improving my blog.

One my goals for the redesign was to have a higher page view per visit ratio. Prior to the redesign it was 1.47 pages per visit. Now it’s at 1.9 - a significant increase.

I could not give Jamie a higher recommendation.




That new page layout you made for Ross is definitely much more elegant and it looks a lot more professional as well. Good job Jamie! =D



Jamie

Thanks wyvernoid!

It took a good few months to get everything sorted the way it should be. But the end result was good..

I am about to make some more modifications for Ross soon to allow him to place a different advertising scheme on his site. But more on that in a few weeks..



Neat job, Jamie.
Grumps. ;-)



Trackbacks

Leave a reply...