A Major Website Update for Jagged Globe

When is a new website not a new website? We’re not entirely sure, but the latest website update for Jagged Globe is so wide-ranging that it almost feels like a ground-up rebuild.

Proudly different, the Jagged Globe website is pretty distinctive; its layout makes full use of the terrific photo archive that the adventure tours company has built up over the twenty-five or more years that the company has been trading.

But time is not kind to websites. Innovation follows innovation, and in the years since the last launch, many companies have copied and built on the trails Jagged Globe originally blazed. Desktops have got bigger, touch screen devices have got both bigger and smaller and the stylesheets drawn up with the last major update could not support the modern requirements for responsive design.

So when Jagged Globe came to Little Fire and asked them to improve the site menu, we felt up a more profound change was needed. We came up with several ideas which we thought they needed to adopt.

Jagged Globe were good enough to love all of them…

We implemented the structure of the menu as the client requested. But we went one stage further and built it so that it now reads the database and maintains itself. Every single trip is now available within a couple of clicks, every trip can be viewed by date.

The old menu required the user to hover over large areas of the screen to reveal the drop-down panels. These, in turn, had content inconsistently laid out. Even the Jagged Globe staff found it confusing.

It happens. Tweak gets layered over tweak and, eventually, design and user experience deteriorates. Websites need a regular and thorough review.

The main menu on mouse-driven sites now offers strong visual clues. Complex fly-out menus open when clicked and remain so until dispelled. Give it a go – click here.

When the site was last overhauled (in 2018!), old menus were adapted to work on a touchscreen device. It worked, but only just! We implemented one of our favourite code libraries which converts the new main menu into a mobile-friendly burger menu. Chapeau to developer David for getting all that HTML to play nice.

We liked the old site, it stood out to us as one that really made an effort to make the best of the photography. But monitors have got bigger and, as we looked, we became aware that the existing design was also wasting space with large dark bars which never changed.

So we proposed redesigning the masthead entirely. Modern CSS and image formats allow us to create a site without significant change at a huge range of screen sizes. Removing some of the blocks meant the photos and branding are now clearer than before.

We proposed a larger default page width. Screen sizes have grown (the existing page width was suitable for a 17″ monitor). A huge proportion of the screen was unused for content. Much of the site’s administration pages uses the same template so the team’s work was being hampered.

The site used an external search provider. On-site search is seldom cheap and the one we used on the site was providing results which didn’t really help.

We reviewed what the client’s competitors had done and, like e-commerce anywhere, each was largely driven by a big search bar in the middle of the homepage. “What the heck?” we thought, we’ve saved a load of space – we can do better.

We’re not normally fans of custom-built search, but in this case it’s appropriate – it is there solely to help clients find trips. And it does, fast.

Because the search is self-hosted. This newer website will actually be cheaper to run.

Because the site now references many trips by country, we created additional pages where trips are grouped by country. The client has the editors to make each of those into a distinct, inspiring landing page. We look forward to seeing what they do with it.

Jagged Globe showed the beta to their clients and they said “Great! Much better, but we’d like to see pages which bring the trips together and inspires us with text and images”.

So we built a system to enable Jagged Globe to create as many of pages as they like. The administrators can create complex, detailed pages with full access to their image library.

Barring a small news flash, the text on the homepage has not changed in years. As we said, the site was designed before the pandemic – people didn’t scroll then. All that static content was jammed into a space suitable for a vintage monitor.

Using modern CSS we positioned the homepage near the bottom of the screen, clearly visible to lure a scroll but still displaying the background image at its very best.

The homepage now features richly featured text, groups of pages and selections of trips. All of this is governed from the website’s back end so the client can update the content as the seasons change (Climbing for summer, Treks for springtime and Skiing for the autumn). The homepage is broken into sections which can be reordered with simple drag and drop controls.

As with many things, making the website look better highlights shortfalls elsewhere.

The mobile site has for a long time seemed like an afterthought. Yet mobile users are the most demanding and the most impatient. Mobile users have the least tolerance of a tricky user interface. So, again we went and looked at what the best in the field were doing. After a short meeting, the design fell into place quickly.

For this update for Jagged Globe, we needed to bring the site a long way forward. The underlying version of PHP was reaching end of life and the payment gateway required newer. This, in turn, required that we update large tracts of code – including updating the template system and mailing list integration. SEO has been improved sitewide.

To minimise future development we have synchronised external code libraries so that they can be maintained automatically without intervention from us.

The site still features our 5 click trip to the mountains checkout, we genuinely don’t think anyone’s done better.

It’s always a little chancy, doing something different, but Jagged Globe have done it for years. These are custom developments – they do not adhere to the simple “buy a theme and colour it in” rules of website design. But, by asking the end users what they want to see, watching them use the beta site as it developed and measuring the site against best-in-class competitors, we’re confident we’ve made something special.