|
|
| Hey {{lead.First Name:default=there}}, This is email #2 in the "Marketing Tranformation Series". It highlights the immense amount of change the website has undergone that past 8 months, takes a deep dive into those changes, and shows how those changes have led to the following results:
|
| Introduction | |
|
|
|
| I started at Nexthink in April of this year. After a week I had interviewed about 12 people using a 250 question survey aimed at auditing our systems. I asked those who filled it out to grade the website, to estimate how long it took to make changes / implement a campaign, and a number of other questions pointed at the website and it's viability / performance as a marketing tool. The answers were quite blunt, and I will not include them here, but the important thing to note is that the website, and its associated process received a failing grade (average 4/10). After the interviews I began my own audit of the website and the connected systems / processes. A simplified graphic documenting the results is presented below. |
|
| Based on my findings, the appearance of the website was the least of the website's problems. The more concerning elements of the Nexthink website included:
It was fundamentally broken in that respect. |
| Phase 1: Define the Mission | |
|
|
|
| After about a month, I was given my first mission, and that mission was: "Create a responsive + multilingual website, with a strong architectural foundation to power future growth and evolution of the website. A redesigned homepage would be great by experience'17." AN IMPORTANT DISTINCTION: With the exception of the homepage, the goal of this first phase of the website was never to redo the fundamental DESIGN of the website. We would later adopt a continuous delivery model of change aimed at redoing small portions of the website gradually. |
| Phase 2: Evaluation | |
|
|
|
| As I mentioned before, I did a comprehensive audit of the website, it's codebase, it's design, interconnected systems, plugins, SEO, the marketing workflow, and hundreds of other things. At a VERY high level, here were my biggest findings...
Without an entire architectural redo, the website would never serve as the central marketing tool it needed to be. I will demonstrate this in this email as well as the following ones. |
| Phase 3: Paying off a half decade of technical debt |
|
|
|
|
| When presenting the website to Pedro and Heather at our large group meeting during the summer Pedro asked me, "What was the hardest part?" I gave him the abridged version, but below you can find the unabridged version. If you are not one for reading, here is a 20 minute video documenting the hurdles. While reading this keep in mind that we had about 1,700 nodes on the website. It wasn't a 40 page simple website. Here were the major challenges the "fixing" the website...
Removing the PODS Plugin
At some point in the past 7 years someone installed the
PODs plugin on the website. This plugin was popular before WordPress rolled out custom post types in version 3.0, and many developers used it to extend the capabilities of WordPress. Unfortunately, it uses its own methods, its own DB tables, and essentially serves as a CMS within the construct of WordPress. On top of this, it actively prevents anyone from migrating content out of the plugin resulting in crippling
theme lock.
This plugin sat at the center of almost all of the website's issues.
It was the plugin actively preventing us from enabling search capabilities, using any of the good WordPress plugins, managing media effectively, doing multilingual correctly, and generating a complete sitemap. I wrote 4,000 lines of code to migrate hundreds of pages of PODs content back into our CMS WordPress while maintaining existing node connections using custom post types, taxonomies, and custom post meta. The effort behind this increased exponentially due to our previous implementation of multilingual, which I'll go into later. This was the hardest part of the project.
Killing blog.nexthink.com & discover.nexthink.com & other domains
There was no reason we needed a separate WordPress install for our blog, all of our content isolated to a landing page provider, and our content scattered to the wind. 500+ pages of content (many duplicates) resided outside of our central CMS. Killing these domains brought all of our content under one roof allowing us to programmatically access content and scale our CMS, analytics, and other operations in a responsible way. The coming year the plan is to use the main website, and its strong foundation to power the experience website, and any other pages that would have previously gone on other domains. Migrating, deduping, and consolidating this content was probably the second hardest part of the project. A huge thank you to Guillaume, Chloe, Georgina, and other marketing team members for facilitating the migration of over 300 pages. Our growth the past couple of months is directly fueled by this effort. A thank you to Robin and Francois for cordinating the domain changes. Media Delivery WordPress has a built in media manager that allows users to do a good number of things. This media manager is integrated into all parts of WordPress and can be used programmatically in conjunction with a CDN to deliver content. We weren't using it to manage over 5,000 media assets. At some point we stopped using the media manager, and began storing our content on AWS, out of reach of editors that may have been in WordPress, and this isolated our media delivery. While Renato could access this content, the marketing team could not. On top of this, and building on the last section, our media was fragemented between AWS, the blog, our main site, instapage, and other locations. I wrote a couple thousand more lines of code, and utilized a couple of plugins to migrate every piece of media associated with our sites into our primary CMS, allowing the marketing team to find media, use media, and have it deliver seamlessly via a CDN should we start to use on. Centrally managed media was unheard of up until now. Fixing Multilingual Multilingual on the previous version of the website was implemented undesireably and contributed to many search, sitemap, and other related architectural issues. The main cause of this was the PODs plugin which prevented us from using any of the major WordPress multilingual plugins like WPML, Polylang, or other plugins. These are all plugins with cadres of developers behind them, and can save a company millions of dollars worth of development time for the low price of $50-$250. For every page on our website, the multilingual content was isolated to a single node. This meant splitting the content into seperate nodes, re-programming them into the CMS, and then rebuilding the nodes, connections, and other bits of data programmatically. From Static to Dynamic Much of our content was statically coded into pages and inaccessible to anyone without development credentials. Marketing had the blue screen of death. A major contributing factor to this was the way we implemented multilingual, and our extensive use of gettext functions to output content. For the marketing department this was a huge pain point, as the website is its central tool. Not having access to that tool was crippling. |
| Phase 4: Time to build | |
|
|
|
| After weeks, and thousands of lines of migration code... the content, media, and other web assets had been consolidated and entered into the system in a structured, consistent, reliable, and editable manner. All outstanding debt had been paid off, and we were ready to start working on the website again. Selecting the stack The old website was not responsive which by its very nature necessitated the re-selection of many parts of the development stack. Selecting the new stack was exciting, but, it was also very difficult. For those of you that are interested, here is what the development stack looks like. For everyone else you can skip ahead, or click on some of the links to learn more:
Frameworks
SCSS / CSS
Javascript
Worflow
Methodologies
Creating a Custom Theme After selecting the stack was the process of creating a custom WordPress theme, and supplemental plugins for optional functionality. Creating a custom theme instead of purchasing a prefabricated one was preferential because of the magnitude of the project, need for customizations, and because of the fact that many themes these days are so bloated they run at a snail's pace. In the end our new website theme / framework consisted of 98% new code.
We made extensive use of custom post types, custom taxonomies, shortcodes, hooking / filtering, the built in template heirarchy, and in general obeyed most of WordPress theme development best practices.
|
| Phase 4: Launch and Success | |
|
|
|
|
| We launched the website at 8am Switzerland time, which was 3am EST for me. In the middle of the night I sat on Skype with Robin and flipped the switch on Nexthink's new website. It went off without a hitch, and we had a new website. Here were the results: |
|
| Traffic Increased... Dramatically In the above picture you can see that almost immediately upon launch we saw an increase in pageviews of close to 100%. The single largest increase in traffic in Nexthink's recorded history. This was largely the result of importing the landing pages from Instapage, fixing search, and providing avenues for people to actually find content. Something to note is that when launching a website it is not uncommon to see a slight dip immediately after launch, and a recovery once google re-crawls. We did not experience that which is a testament. A big thank you to Chloe for making sure our site was loaded up with redirects. It was not a fun job. Something else to note is that Nexthink typically experiences dips in the months of Nov / Dec because of vacations. This has been affecting the numbers and the slight decrease since launch will likely increase after January. |
|
| Lead Gen was Measurable, and Increased Before launch it was very hard to guage form fills, conversion, and how our website was performing from a lead gen basis. We can now do that, and according to my best estimations based on SF data we now get more form fills in a day than we previously received in a week, and it's only increasing as we roll out fresher content. |
|
| The Website Was Responsive |
| Every single one of the 1,700 plus pages on the website was now responsive. Not a single page was left behind in this effort. |
| Marketing Had Access, Velocity of Change Increased, Morale Improved One of the biggest problems with the previous website was that it locked marketing out of the content. Marketing is responsible for the website, so it's easy to imagine how frustrating that could be. In marketing we can, and do, make 1000s of changes to the website a day. Whether that is changing grammatical errors, adding copy, categorizing assets, adding media, or a million of other things. That is activity centrally managed in our CMS. Since democratizing the CMS marketing morale has jumped dramatically. |
| Phase 5: Redesigning | |
|
|
|
|
| This past month, after a short respite to pay attention to other systems, we pushed the website again. This launch represented the beginning of the stylistic changes to the website. As you may have noticed, we have an entirely new design paradigm. I will not go into too much depth about it now, but it will be the topic of conversation in one of my next emails. Stay tuned. |
| Special Thanks | |
|
|
|
| Francois + Robin Thanks for working to help configure, secure, and launch the website. It was a lot of work you didn't sign up for, but you helped with nonetheless. Guillaume + Chloe + Georgina Without you the website never would have come together. You're help migrating, consolidating, and repopulating 5 years worth of content on the website was the jet fuel behind the website project. Eduardo + Renato Thank you for working with the tight deadlines around launch, and the frustration of compressing 3 weeks of work down into 3 days. Your work around the brand and development workflow was invaluable. Heather + Patrick + Pedro Thank you for the guidance, patience, and encouragement as we move forward with this slow moving change. |
|
|||||||||||||||||
