How we built the new MailChannels web site

After more than two months of hard work, I’m pleased to announce the launch of the new MailChannels web site. The new site highlights what we do best, and tries to answer the most common questions visitors have within 30 seconds or less.

Here’s how we built the new MailChannels web site:

Step 1: Content Creation

95% of the inbound sales leads we get come straight from our web site. For this reason, we knew it was extremely important to optimize our site to provide relevant information in an easy to read format. To develop the new site, we started with several Friday-afternoon brainstorming sessions, during which we distilled down the small number of concepts we would focus on. What came out of this session was the decision to focus on outbound spam filtering, and to emphasize our unique, highly scalable transparent spam filtering technology.

We generated a skeleton set of content internally, with input from each department and team member, and then fed this skeleton to a skilled copy writer who worked what I can only describe as “magic” to make the content readable, and jargon-free.

Step 2: Layout and Chopping

In parallel with the copy writing phase, our talented graphic designer laid out each page using Adobe Photoshop, with each page component separated out onto its own layer. Once complete, the PSD file was transmitted to the excellent team at PSD2HTML, whose CSS gurus transformed it into “semantic CSS+HTML”, ready for upload. Semantic layout means separating the appearance of the content as much as possible from the content itself, so that search engines can extract meaning from the content as easily as possible, without being confused by bizarre HTML tricks. Semantic layout also makes it easy to change the site’s appearance in future, without having to make changes to the content.

Step 3: Templatizing and Deployment

With CSS and HTML in hand, we proceeded to “templatize” (this word isn’t yet in the OED) the layout using Template Toolkit (our ancient template library of choice). Template Toolkit may be old, but it works well, and by using Template Toolkit we were able to re-use a bunch of components from our old site. For instance, the press release list is generated using a Perl script that dumps out reams of template code. Some JavaScript and CSS tweaks followed, and we were ready for launch within 24 hours.

New Web Site Features

While we’re certainly proud of the content and appearance of the new site, I’d like to highlight a few things that really kick ass:

1. The new support page – We’ve integrated with Zendesk to provide a knowledge base, ticket submission form, and queue-based telephone support system.
2. Our customers page highlights how we have helped specific customers deal with outbound spam and other messaging abuse related problems.
3. The new MailChannels sales contact form is clearer, easier to use, and in every conceivable way better than the old one. We used WuFoo, and you should too.

Lessons Learned

If you don’t have a great web site, you shouldn’t bother having one. We learned this by analyzing years worth of sales leads and determining that the number one way people find us is through the web – and more importantly, through Google. We thought about how we find things – obviously, it’s via the web. Whether it’s an individual working at a tier-1 service provider, or the proprietor of a small VPS hosting company, having a great web site makes it easy for people to understand what we do, and whether it’s right for their needs. This cuts down on miscommunication and misunderstandings, and leads to better qualified prospects.