Thoughts on creating great user experiences, content and web sites

Anatomy of a new website, circa 2012

Over the past month or so, I’ve pushed two websites out to the web. First, an updated look to www.kohl.ca and now this new site for myself. As I’ve been telling a few friends and colleagues about they process, I hear things like: “I’ve got to get around to doing that for myself,” and “I’ve had that domain name for years and haven’t done anything with it.” So, this post is for all those friends who just need a little encouragement.

The sites I’ve pulled together are really easy to create. With the today’s user-friendly blog engines and improvements to administration panels offered by hosting providers, setting up a new website can boil down to a little courage and a lot of point and click.  For someone like me, who is a bit of a purist about writing her own HTML and CSS from scratch, I almost feel guilty at how I’ve leveraged templates, blog engines and online services. But I’m happy with the results, and have been able to start blogging again weeks sooner than I would have otherwise.

I’ve not done anything that thousands of others haven’t already done before me. There are hundreds of posts on the web to walk you through what I’ve set up, so I don’t imagine I’m saying anything new. Really, I’m writing to encourage those who have yet to take the leap.  If you’re one of them, I hope it helps.

Choosing hosting providers…

A website that doesn’t drive you crazy is one that you understand how to maintain. Our old hosting provider offered good, affordable service when we started with them eight years ago, but nowadays they just didn’t cut it. When we compared the usability dashboard and up-time to current competitors, the service just wasn’t living up. So, redesigning www.kohl.ca included moving the website and email to new hosts.

I’d used Google Apps for Business for email and calendars at work in the past. The price and service is right for small business and the configuration and support is understandable by average techies like me. Google provides good documentation and wizzards to get you through the switch, so the hardest part was configuring the DNS on the old provider. So, our  first step was to move email over to them.

For domain hosting, we ended up choosing DreamHost for a few reasons:

  • We could do a free two-week trial to test out the system and dashboard, which gave us a chance to map out the transition plan.
  • They have one-click WordPress install.
  • They have a quick set-up for configuring the use of Google apps email.
  • The pricing for hosting our domains was reasonable and comparable to what we were already paying.
  • It came recommended by a friend.

Going with WordPress

I knew we needed a blog engine, and wanted to go with WordPress. Since both sites are primarily blogs with a few other static pages, they were essentially what WordPress is designed for. I also thought we could leverage its engine for other content management features.  And, I like the billions of themes and template options out there that would make it easy to get going.

Of course there are some drawbacks to using WordPress. Take a read of WordPress: Advantages and Disadvantages of Choosing WordPress as Your CMS Solution for a pretty decent list. Knowing what you’re dealing with is half the battle, though. So, I figured most of the concerns could be mitigated by some smart planning, regular updating and judicious use of plug-ins (like Quick Cache to help mitigate any latency issues that may occur if/when the site gets lots of hits).

As I was putting this together, a colleague also reminded me of some of the vulnerabilities of PHP-based websites like WordPress. Just in time, the Kuno Creative came out with a recent post Simple Steps to Safeguard your WordPress Website.

Converting the old blog

The old  www.kohl.ca ran on an outdated version of Moveable Type. With over 200 posts, many followers and a nine years of Google juice, I had to find a solution to keep all that great content and properly redirect the urls.

This is where plugins have come in really handy.

  • I used the Movable Type and TypePad Importer plugin  to import the old posts. It did a great job of getting the content in there. However, I did need to review each imported page individually to make sure the formatting was okay and fix any broken images.
  • For the urls, I needed a way to redirect the old urls to the new urls so that the search results and any referring links would still work. Quick Page/Post Redirect let me redirect all the old blog urls over to the new locations. It took a bit of work to set up (there wasn’t a quick way to set up the 200+ redirects I needed), but works well once I have it going.

Choosing a design

Lately, I’ve been reading a lot about how to develop mobile-friendly websites. I really believe that Ethan Marcotte‘s take on responsive design is an elegant solution to creating a site that works well on both desktop and mobile devices. So, I went in search of responsive WordPress themes.

Someday, I’d like to take the time to develop my own responsive site or theme from scratch, but in the interest of speed, I decided to leverage what was already available on the web. There are a few free templates out there, but I wanted something a little different, so for both sites, I ended up buy responsive templates from ThemeForest. (I’ll leave you to see whether you can guess which ones…)

What I’ve learned after doing two WordPress sites that each theme works a little differently. It is worth reading the documentation and digging through the samples to see what’s possible with each theme. The biggest thing I had to get my head around in each theme was how the pages, posts and theme all work together to give the results I wanted in navigation and display.

How long did it really take?

This was a labour of love–or at least of learning–so I didn’t count the precise hours. But, I moved to a new domain, set up Google Apps, bought templates  and created the WordPress site within the space of a month, in my spare time. All told, I probably spent about five full-time days working on the whole deal (and that may be generous). This includes all the learning and research I had to do to figure out moving the DNS around, searching for the right theme, converting the old blog posts over, setting up redirects, testing and configuring WordPress.

The second site didn’t take nearly as long. Because I had the hosting set up already, it was a matter of buying a new domain, installing WordPress, choosing and configuring a theme. Maybe a couple of days at the most, with most of the work in fiddling to make the site look the way I wanted it to.

Am I happy with the end results?

So far so good. Ask me again in a few months and I’ll tell you whether this holds. (Hopefully, I’ll do a follow-up with any new discoveries or concerns.)

For those of you waiting around to get your website up and running, I hope this has inspired you that it can be done with relatively little effort. Let me know if you do end up getting out there with your own site and what you learn as you do it (it’d make an easy first blog post…) Good luck!