Recreating TheVirtualHandshake.com

My name is Jason Coward of OpenGeek.com, and webmaster of TheVirtualHandshake. I’ve been invited by David Teten and Scott Allen to post this quick case-study of our recent relaunch of TheVirtualHandshake.com web site, in order to explain what we did, why we did it, and how we did it while spending very little money.

Background
Scott Allen and I have worked together and been friends for many years. We have a shared passion for technology and even some affinities in our political and socio-economic viewpoints. Several start-ups later, Scott started sowing his own seeds of entrepreneurship, and I decided to start my own web design and development business, OpenGeek.com. It was only a matter of time before we started working together again, only this time as individuals exploring our own independent visions, rather than the corporate visions we supported together with relatively little return.

While Scott was writing articles and books, networking with other entrepreneurs, and blogging, I was exploring the world of LAMP development, open source business models, and doing contract work to pay the bills. The contract helped me strengthen my J2EE, XML/XSLT, and my SQL skills, while I worked on graphic design and PHP in my spare time for direct clients. I first got involved with the website because David and Scott asked me to provide hosting services through MultiDomain-Hosting.

Rebuilding TheVirtualHandshake.com
I finally got involved directly with TheVirtualHandshake.com, beyond just supporting the hosting account, in December of last year when David and Scott approached me with a web site rebuild project. The site was at that time a collection of Dreamweaver templates, html pages, php scripts, and a WordPress blog installation. For about $250, they received the following services:

  • Replaced the header with TheVirtualHandshake book graphic, title, and background
  • Cleaned up the HTML, removing TABLE tags used for layout purposes and converting all formatting to CSS
  • Upgraded their WordPress installation (I believe 1.2 was released around this time)
  • Added a plugin called SpamKarma to solve their comment spam problems

This was just the first step in crafting the current TheVirtualHandshake.com, but the new markup and CSS which better isolated the content from the layout, made the next steps much easier to accomplish.

Content Management
The next two months while David and Scott were busy finishing up the book, I spent exploring a new LAMP-based, open source CMS (or Content Management System) I found as part of the constant research and development I do as part of the foundation of my web solutions business. With a strange name, Etomite was the lighweight, flexible, and easy-to-use CMS I had been looking for, and I began a mass migration from the bulky and bloated world of the popular Nuke-based community portals (PHPNuke, PostNuke, MD-Pro), back to the emerging web and design standards I had been getting excited about, but could never use in my ‘Nuked’ sites.

When David and Scott approached me with a proposal for redesigning the entire web site, I immediately thought of how Etomite could help me re-implement and manage this rather large site with a lot less effort than making updates via Dreamweaver. So I proposed that I use it on the project, David and Scott agreed, and the project got underway.

Key Features
The project plan called for some fairly complex features. Here’s a list of those features, and how I approached each one:

  • Easy to Update – It was important that David and Scott have a simple, web-based mechanism to update the site. Etomite provided this out-of-the-box, with each page in the site represented as a document in a tree, editable using a WYSIWYG editor or as HTML directly. And since Etomite allows you to separate templates from documents, changing the layout or look and feel of the site is as easy as editing a single HTML template or the CSS that is attached.
  • Friendly URLs and Old URLs – For maximum search engine exposure, and better interactivity for users, Etomite provided the optimum platform, providing easily configurable URL prefixes, extensions, and document aliases. In addition, internal links within Etomite (in conjunction with Apache’s mod-rewrite module) provided a great way to support old site links, getting users to the appropriate location, no matter which URL variation they used to access the page.
  • Secured Content for Book Readers – Providing extra content for those that purchase the book was another driver in my choice of Etomite, which along with some custom modifications being provided by the Etomite developer community, provided an excellent platform for building the Readers Guide.
  • Turn Social Software Guide into Wiki – Providing a Wiki interface for users to contribute content to the Social Software Guide section of the site was another requirement, which we initially considered deploying MediaWiki (which powers WikiPedia) for. However, I found a very elegant and simple PHP wiki implementation which I converted into a snippet in Etomite (a snippet is a reusable PHP script element). I chose this approach as it allowed me to more closely integrate the Wiki into the site. This was especially useful when securing the Wiki so only Readers of the book could contribute.

The remaining PHP scripts I turned into snippets, and the site content was further cleaned according to XHTML standards and the principles of semantically correct markup. We upgraded WordPress yet again, to the latest 1.5 release, and created a new theme that used the same CSS file as the CMS-managed pages.

The entire project, started in late February, was deployed into production, replacing the existing site, in less than month, including several rounds of design and functional revisions. The initial test site was up within days of the start of the project, and provided a great place for David and Scott to review the new site, exactly as it would be in production. And, since we used free software, we were able to do the entire project for a very reasonable price; way under $1000.

The Future of the Site
There’s still much to do to improve the site, but the core is solid and will grow as the CMS product that powers the site continues to mature. Since the initial deployment, I began using a fork of the Etomite CMS that featured several mods to the core product that led the developers of Etomite to ban these mods from the forums at Etomite, as they prepared to abandon the GPL in favor of a commercial CMS venture. The fork, currently known as MODx, will remain GPL, and will continue to follow the core principles of the original product. The original decision to ban the MODx mods was disheartening at first, but I addressed the issue by joining the core MODx development team. In the upcoming weeks ahead, look for big announcements from the group regarding our new branding and product road map.

In any case, I replaced the Etomite core of TheVirtualHandshake.com with MODx a couple of weeks ago, and completed some more revisions to the wiki and Reader’s Guide this week. We’ll continue to add features, functionality and content. Immediate plans include adding advanced Technorati tag capabilities to both blog posts and other site content, creating dynamic taxonomies of categorized profiles in the Social Software Guide, as well as major improvements to the content manager interface and WYSIWYG editors used when editing the content.

We welcome feedback on the site.