Rebuilding Fortune

The main page of Fortune with navigation, featured article, and additional content

 Fortune gets faster, cleaner, and more reliable.

On July 1st, 2019, we migrated and replatformed Fortune.com, as well as two of their microsites, onto WordPress VIP Go. While staying true to their brand and existing design, the site has been rebuilt from scratch, and provides users and editors alike a faster, cleaner, and more reliable experience.

The Context

While Fortune.com was a strong site to begin with, there was room for improvement. There were many places in the codebase where inconsistencies had built up over time, both seen (such as variances in  headers and footers on different pages) and unseen (multiple front-end applications with duplicative code) by the average site visitor. After the property was sold to an independent owner in late 2018, they came to Alley to take a look and make a change.

The Ask

Fortune was looking to extract itself from its older technology stack after its purchase, and the easiest way to approach this was to rebuild it fully. This had many additional effects, such as increased site speed, a cleaner code base, and a more consistent and accessible UI experience both for Fortune’s reporters, as well as their readers. This would lead to increased engagement, interest, and ultimately dedication to the outlet.

The Solution

After reviewing the technology stack, it was clear that the site would benefit from a decoupled architecture, and the team would repurpose what they could, and rearchitect the rest. The design would remain largely unchanged, but would implement atomic design patterns to remove one-off UX patterns that had emerged over time (except for a few quick fixes), but we would build out a new headless backend, upgrade their infrastructure to VIP’s latest offerings, clean up content, and seamlessly swap to the new build without interruption in service.

The biggest part of our work was to remove or consolidate the majority of front- and back-end applications that were redundant, unused, broken, or not needed for some other reason. This massive effort simplified the code drastically, speeding up the site and allowing for easier maintenance down the road. All the code is now in a consistent predictable structure, organized and detailed. Due to the complexity of the stack and no single development team owning the product, no one person or team really understood the codebase from top to bottom, but the developers for Fortune are now able to fully visualize the site’s architecture and maintain patterns for the development experience.. Finally, on the editorial side, the interface is also cleaned up and made simpler to engage with and understand. Fortune is now taking a Gutenberg-first approach to their editorial strategy.

The Fortune 500 page, with a picture of a woman gesturing in a blue shirt next to the large numerals 500 and a brief description. Underneath are multiple buttons to filter the list, such as "Most profitable", "Newcomers," and "Biggest Employers."

We also recreated their franchise applications from scratch – these are lists like the Fortune 500, Fortune Future 50, 40 Under 40, and so forth. Publishing a new franchise list was previously a massive production and feat of coordination between editorial, developers, stakeholders, and more. In the rebuilt version, editorial can own the creation of franchises from start to finish. They can preview and schedule them to publish without needing to go back and forth with other teams. And, the applications are much more performant for the reader as well. Our team worked very closely with Fortune to migrate older franchise lists to the new format, giving classic content a much needed face-lift.

The new site is built in our open-source framework for headless WordPress, Irving. Throughout this project, we were able to make many incremental improvements and add new features to Irving, such as asynchronous data loading, which will benefit future projects and developers.. Both the frontend node application and backend WordPress install are hosted and served by VIP Go as part of their comprehensive solution.

The Results

In just the first few days, Fortune saw a 60+% drop in load speeds and a 12% drop in bounce rate, so users appeared to appreciate the changes. The site also receives very high ranks when it comes to web accessibility, according to tools like Lighthouse. The Fortune team said “We walked through fire to rebuild our websites, and we couldn’t be happier that Alley was by our side. The team found creative solutions to our problems and hit its marks every time.” We can’t wait to watch Fortune grow even stronger in the future.