Thurrott.com: Ongoing Development, Performance and WooCommerce Optimization

Overview

Enlivy was tasked with revitalising Thurrott.com by creating and implementing a new design that would optimise the website’s performance and improve the user experience.

Thurrott.com delivers a wide range of technology-related articles, including news and different types of analysis. The website also provides podcasts created by the editorial team and a premium subscription service that offers members exclusive content.

We were given a detailed set of specifications from the client, BWW Media, which we meticulously executed to guarantee that the final product conformed to their expectations and requirements.

Client Objective & Challenges

The project’s main objective was to transform the website into a faster, more user-friendly platform by implementing new features and functionalities.

We aimed to create a modern website to provide an enhanced user experience for its visitors and subscribers. This project involved a complete overhaul of the website’s design and technical infrastructure to improve the website’s performance, speed, and responsiveness, as well as adding new features and functions to the website that would enhance the user experience.

The client, BWW Media, came to us with the main requirement of modernising and increasing the speed of their website, Thurrott.com. The website was outdated, with poor performance, for example a logged-in experience taking up to 3 seconds.

To meet these requirements, we began by conducting a thorough analysis of the website’s current design and performance. We discovered that the website was using an old theme, which was causing poor performance and several security issues. In addition we found more areas in which the website needed improvements, one example being that the website’s forum was only using text, which was not user-friendly or engaging.

The project requirements for the web development:

• Mobile compatibility for the website, including forums and accessibility
• Implementation of a mobile-specific design and functionality
• Incorporation of search functionality
• Cleanup and removal of retired or outdated features and functions
• Dark mode option for users
• Premium-only access to full RSS feed and Firehose
• Archive of content from Editor’s Desk
• Addition of Read Later and Favorites functionality
• Profile and administration features for members, including Payment and Membership management
• New feature for basic members to have 3 free tokens for premium access
• Basic RSS functionality
• Optimisation of website’s speed and performance on both desktop and mobile

To address these issues and comply with the client’s requirements, we decided to develop and implement a new theme for the website. Since the website had a lot of content around Microsoft and Windows, we suggested implementing a design that will make the website look similar to a Windows App.

What they needed, what we built

We began by conducting a thorough analysis of the website’s current design and performance, then translated the client’s requirements into a new theme, mapping each need to a concrete feature.

1. The need

   “Modernising and increasing the speed of the website, which had a logged-in experience taking up to 3 seconds”

   The solution

   A new theme that took the logged-in experience from 2.5 to 3 seconds down to between 1.2 and 1.6 seconds

2. The need

   “Dark mode option for users”

   The solution

   A new UI/UX design with a modern and minimalistic aesthetic, including a dark mode feature

3. The need

   “Addition of Read Later and Favorites functionality”

   The solution

   A bookmarking feature with personal account view, allowing users to easily save and access articles

4. The need

   “New feature for basic members to have 3 free tokens for premium access”

   The solution

   Free member access to 3 premium content articles and a redemption option for Premium Articles

5. The need

   “The website’s forum was only using text, which was not user-friendly or engaging”

   The solution

   A “What you see is what you get” editor for the forum, which greatly improved the user experience

6. The need

   “Cleanup and removal of retired or outdated features and functions”

   The solution

   Removal of Sidebar for increased content space, creating a more visually pleasing and uncluttered layout

How We Solved the Problems

We executed a comprehensive redesign of the website, implementing a new theme that adheres to the client’s specifications, resulting in a modernised and improved version of Thurrott.com. The website now boasts updated aesthetics, optimised performance, and additional user-centric features.

We also made significant changes to the website’s forum, including the implementation of a “What you see is what you get” editor, which greatly improved the user experience.

We made several changes to Thurrott.com in order to enhance the user experience and provide a more modern and visually appealing website. These changes include:

Overall, these changes aimed to provide a more modern, visually pleasing, and user-friendly website for Thurrott.com’s users. The changes were developed, implemented, and tested to ensure that the website met the client’s requirements and provided a better user experience.

The Process

The creative concept for the website redesign was focused on creating a modern, visually appealing design that emulates the aesthetic of a Windows App. Our goal was to provide a visually pleasing, easy-to-navigate, and user-friendly interface.

Our design decisions included incorporating a minimalist layout emphasising large, high-resolution images and integrating user-friendly filtering options and streamlined navigation to enhance the user experience. We implemented a WYSIWYG editor to improve the user’s interaction on the website’s forum.

The design phase of the Thurrott.com project began with the creation of wireframes and mockups utilising Figma. This phase covered all pages of the website and all scenarios to ensure all requirements were met.

Once the initial design was completed, usability testing was conducted to gather feedback and identify areas for improvement. Based on the feedback received, design iterations were made to optimise elements such as layout, navigation, and filtering options to enhance the user experience.

We used Figma to create a modern and visually pleasing design for the website, while also solving the security issues and increasing the website’s overall speed. This was done by covering all the pages of the website and all the scenarios, such as a free member’s access to 3 premium content articles and the ability to redeem tokens.

Our development process started by creating the general brand guidelines for the website, then planning the new design in Figma.

Creating the new theme was a multi-step effort that required both design and implementation phases. The initial design phase, which involved the conceptualisation and development of new features, took approximately one month to complete.

We spent an additional two months working on implementing those designs, then we continued to polish all the elements that lead to the final redesign of Thurrott.com.

Challenges

Overall, developing the new theme was a complex task that required extensive planning, development, and testing to ensure it met client requirements and provided a better user experience.

When developing the new theme for Thurrott.com, we faced several challenges, including:

• Outdated infrastructure requiring significant changes and upgrades to meet new design and performance requirements.
• Security vulnerabilities that needed to be addressed and adherence to industry best practices for website security.
• Complex task of migrating existing content and creating a custom utility to import them.
• Optimisation for speed and performance on both desktop and mobile.
• Integration of new features and functionality such as dark mode and filtering options.
• Preserve SEO ranking by maintaining URLs and avoiding broken links.

Results

Enlivy developed and implemented a new theme and other changes to Thurrott.com’s website to increase website speed and performance, improve visual aesthetics, and enhance overall user experience.

The new theme was optimized for speed and performance and included a modern, minimalistic design and dark mode feature. Changes to the website’s user interface and user experience were also developed to make the website more intuitive and user-friendly for visitors.

Result of our redesign, the logged-in experience on the website went from taking 2.5 to 3 seconds to taking between 1.2 and 1.6 seconds, a significant improvement.

Results and impact

Enlivy developed and implemented a new theme and other changes to Thurrott.com’s website to increase website speed and performance, improve visual aesthetics, and enhance overall user experience.

Before

• Outdated theme causing poor performance and several security issues
• Logged-in experience taking 2.5 to 3 seconds (PHP load 3.2s, full page 7.1s)
• Forum only using text, which was not user-friendly or engaging
• No dark mode option, and no Read Later or Favorites functionality
• Sidebar reducing available content space

After

• Modernised theme with updated aesthetics, optimised performance, and additional user-centric features
• Logged-in experience between 1.2 and 1.6 seconds (PHP load 0.7s, full page 2.7s)
• Security issues solved and the website’s overall speed increased
• A “What you see is what you get” editor that greatly improved the forum user experience
• Modern, minimalistic design with a dark mode feature and a bookmarking feature to save and access articles
• Sidebar removed for increased content space and an uncluttered layout

We are thrilled to report that our client is delighted with the development work we have done for their website. They have said that the new design and features we have implemented have significantly improved their website’s overall look and feel and have received positive feedback from their users.

The client has reported that the new theme, which includes a modern and minimalistic aesthetic and a dark mode feature, has dramatically enhanced the visual appeal of their website.

The new design has also been well received by their users, who have found it more visually appealing and easy to navigate.

The redesign of Thurrott.com required extensive development efforts, with a total of 34,000 lines of code. However, due to our adherence to the DRY (Don’t Repeat Yourself) coding standard, the line count was significantly lower than it would have been without it, reducing the codebase by a factor of 5.

Throughout the redesign process, we closely collaborated with the client to ensure that we met their requirements and delivered a website that was modern, fast, and easy to use for their audience. We are confident that the new design and improvements we made will greatly enhance the user experience on Thurrott.com, and provide a better platform for BWW Media to reach their audience and deliver their content.