A Peek Inside Our Recent Website Redesign

If I said it has been a busy couple of months inside of Web Savvy Marketing, it would be an understatement at best. While summer is traditionally our slow period, we started a website redesign  and it has been a major undertaking for me and my team.

I never do anything half way and this website redesign is a perfect example of my inability to go “minor” in anything I do. Add in the fact that there are client websites builds to manage and it’s summer in Michigan and well, I feel like I’ve been pulled in a billion directions for three straight months.

In May of this year I kicked off graphic design and provided art direction on different website elements I’d like to have designed and/or coded. Design wrapped up in the end of July we began coding immediately. This coding took about a full month because – again – I just can’t do anything that could be considered normal. This applies to both my business and personal life. I tend to follow the go big or go home philosophy for life in general.

Our Graphic designer, Carla, has an amazing ability to take inspiration and purpose and bring it together into a useful and esthetically pleasing manner. An example of this is our forum’s sign up box. A lot of people missed it in the old design and I made sure Carla knew this was an problem so she could design something that would address this issue. And she did and I was thrilled because I know it will eliminate emails from confused users and it will make new theme buyers happy. We like happy.

As Carla worked on wrapping up the design, the coding team began working on creating custom post types. Now that I know what these are and how they can be used, I absolutely love them. I prefer to use these over a third party plugin because we can control the code and updates. My team of coding rock stars add these as custom plugins so they are portable should we decide to upgrade or change our theme in the future, which we will, because I tend to want this every two years.

Staging Equates to Sanity

But all this design and coding doesn’t mean anything unless you have a solid development area for build and testing. Thanks to WP Engine we have just that.

Earlier this year I began feeling a little unsettled about our hosting company. I had that feeling we needed to make a change, but I was afraid of moving our website, 35+ demo sites, and 25+ client dev sites to another host.

Then I had the opportunity to speak in person with some of the WP Engine folks in San Diego. A pool side chat with the WP Engine sales team quickly put away any hesitation I had with the move.

When our next hosting hurdle presented itself, I sent in a generic inquiry into WP Engine. I didn’t want to call on favors so I went the regular old inquiry route. I had a quick reply from the WP Engine rep I had chatted with in San Diego and before I knew it, he had a custom quote prepared for me based on our situation, needs, and traffic stats from the old host.

I cannot say enough positive things about the WP Engine sales team and their support team. Our move was effortless and they have provided exceptional support over the last few months.

I bring up WP Engine because their staging area made the development process easy for us. No need to recreate a development instance for our large website at WP Engine. We just had to ask their server to push our website to staging and from there we were up and running with coding and testing our new WordPress theme. All in a protected environment that was on the same server as our live website.

While WP Engine excels in performance and support, their staging area is what I love most about them and their hosting services.

Creating a Unique Look and Feel

I mentioned previously that we designed a number of custom templates for our usage and I wasn’t exaggerating. To be more precise, this might be the largest number of custom design templates we’ve had for a single website build.

Our website redesign is based on the Genesis Framework and includes the following design templates:

• Home
• Interior
• Blog main
• Blog post
• About/Who we are
• Testimonials
• Industries served main
• Portfolio main
• Portfolio individual project
• Website design
• Persona individual
• Store main
• Store individual product
• Forum main
• Forum individual topic
• Contact
• 404

To be able to support some of this functionality, the team created custom plugins that use a mix of custom post types and custom fields for:

• Industries served
• Testimonials
• Portfolio

Next we had to consider the build out of some of the longer pages like About, Enterprise, or Website Design. These pages were coded to use a modular approach so there are sections of content that I can populate within the regular page editor.

All I have do is select my desired template and more fields magically appear for me to populate and move around. For every day users like me, this is awesome because we can build up a very cool looking page without needing to know any PHP or CSS code.

As with our stock Genesis themes, we also coded out custom widgets that use what our team calls “Rebecca elements” which are really a way to say user-friendly widgets.

This build out focused a lot of emphasis on fonts and images. I wanted to the website to look unique and this meant I had to allocate funds for quality fonts and imagery.

We purchased two different sets of fonts from MyFonts.com. And while I’ve never paid for fonts for our own website before, I’m thrilled that I did this time around. I just wasn’t finding what I wanted in Google fonts and when Carla provided some examples of purchased fonts, I knew it was the only way to go.

Once we had fonts addressed, we needed to move onto images. Carla helped pick out some images for the templates themselves, but when it came down to images for all the pages and posts, I had to step in and spend many hours weeding through multiple websites to find what wanted. We easily spent over $1,000 in stock images from Getty Images, Shutterstock, iStockPhoto, and BigStockPhoto.

It was worth it, because images truly help make a website and a design.

Why Did I Have to Write So Many Blog Posts?

One of the specifications I gave for the website redesign was larger images. This included the blog posts and main blog page. I wanted large visuals, but these came with a cost of both my time and money.

Our blog post featured images went from small squares to large landscape images. While I love the visual presentation, this meant a lot of rework.

I had to sift through 300 blog posts and manually rework or replace images. While many people on Twitter suggested I automate this process, it simply wasn’t an option. You cannot resize images when you scale up by 400%.

I literally spent three days doing this and my eyeballs were about to pop out from boredom. While I could have delegated this, I chose not to. After all, I wrote most of the blog posts and I know best what images would relate to the content. So I did it and there were days where I was up at 3:30 and 5:00 in the morning working on this task.

So we are now live and I am so thankful for our team’s collective effort in making it happen. There were six of us in total that worked on this project and I cannot thank everyone enough for the long hours that were applied to execution while they also worked on client projects and support tickets.

So with this lengthy description, you’ve been brought up to speed on our recent activity and our website redesign. Browse around the site and have a look at our new look. We hope you like it!