We have been the primary development team for the Rough Guides website for over 4 years, which means we are almost constantly building new features, improving current functionality and fixing bugs. However, we recently completed a full, responsive front-end rebuild of their website and ecommerce platform which was launched in January.
The beautiful designs were done in-house by the Rough Guides team and it was our task to build them into the existing WordPress website. Although the project was essentially a front-end rebuild, we took the opportunity to restructure a lot of the back-end code, which was starting to get messy and cumbersome.
We rebuilt the website to take on as much of an MVC structure that WordPress would allow which has resulted in a much more manageable codebase. The new front-end has helped reduce page load times and increase performance, as shown on the graph below.
As well as increasing the transaction speed, we also worked to decrease the error rate on the website. The old website was running a mobile detection (and presenting an m.roughguides.com version of the website. This browser detection was done using a plugin, which contributed to a number of errors – removing this and unused functions resulted in a much lower error rate.
Dealing with legacy content
We were faced with a lot of challenges during the rebuild. One of the toughest was dealing with legacy content particularly for Galleries and ‘Things not to miss’ pages, as they were changed from carousels to scrolling pages.
Due to the new design, the old way that the information was input and stored wasn’t going to give us the freedom to manipulate the data to match the designs. Our solution was to write a simple database script that looped through all of the required fields and restructured it to match the new design. This meant that new galleries could be posted using the updated format, whilst still keeping the old posts.