Two weeks, seven steps. That’s what the V&A’s digital media team and digital agency Made by Many took in a sprint dedicated to making tactical improvements to the V&A website earlier this year. I won’t lie, it was full on, involving our technical and content teams working alongside the talented folk at Made by Many. It was a chance for us to more fully embrace Agile, and we learnt a huge amount on the way. And we used a number of steps that might be helpful to anyone thinking about website optimisation.
Step 1 – Ask ‘do users love it?’
Here’s the obligatory Venn diagram…
It was a useful way for us to prioritise features and content to develop. For each feature and improvement we considered, we asked ourselves:
- will it deliver on organisational priorities to grow revenue, reach and reputation?
- do we have the capability of delivering this ourselves, on our existing content management system (CMS)?
- will users love it? (or people, as they’re commonly known).
If you believe in user-centred design, you’ll probably agree that last one is arguably the most important.
So we embarked on some user testing which revealed that people were:
- unable to find visitor information and opening times on the homepage
- having difficulty using the navigation and finding their way around the site.
Far from filling us with despair, these insights, backed up with some evidence from our analytics gave us a good focus for our first set of improvements. We changed the navigation, and included active verbs like ‘learn’, ‘visit’ and ‘shop’. We made the opening times, ‘admission free’ message and strapline more visible and tidied up the visual clutter above the homepage carousel.
Step 2 – A/B and see
Speaking of carousel, we’d wanted to improve the user interface (UI) for a while. The carousel featured four pieces of content including exhibition, membership and shop promotion. Before we began to improve the UI, we used Optimizely to run an A/B test, where half the audience saw the original carousel. The other half saw a new version of the homepage where the carousel was replaced with a static banner, and the content previously in 2nd, 3rd and 4th spot moved down to beneath the banner. We ran the A/B test over 6 days with nearly 46,000 unique visitors which proved that we shouldn’t focus on improving the carousel – we should get rid of it altogether. After all, each piece of content previously ‘hidden’ in the carousel now had more than 11% more page views. In fact there was an increase of 15% in overall conversion rate.
Step 3 – Make it easier to plan a visit
We know that around 70% of people visiting vam.ac.uk are potentially planning a visit to the Museum. And we now knew through user testing that people weren’t finding the information they were looking for. So we made a number of changes to the Visit page:
- we refined the content, stripping back to the most essential information
- we made the opening times more prominent
- we used better imagery
- we made usability improvements like anchor links to key content.
Step 4 – Improve the legibility and flow of content
We discovered through user testing that people were confused by the amount of content on some pages. This wasn’t aided by the fact that the text was very dense and dominated the imagery. We updated our CSS (cascading style sheets) so that:
- text is more legible across the site, having increased line heights and font size and introduced consistent padding around images
- all text now uses our house font, V&A Sans Serif
- there is a better balance between text and image.
- improved legibility for our users, making our content more accessible
- a happier content team, who now find it much easier to layout new pages of content.
Step 5 – Identify ways to grow revenue
In the cultural sector, we’re all under pressure to find new ways to generate more income. But we also have existing channels that could work harder. Like most cultural organisations, our website is a vital tool in driving ticket and shop purchases, membership sales as well as visits to our buildings. We’ve recently invested in a new customer relationship management system through which we now manage ticket sales. But before this point we were selling via a third party ticket site. User testing revealed that people found it a bewildering experience to land on a separate site, and were having trouble getting back to vam.ac.uk.
We replaced the somewhat obscure ‘book tickets’ icon with an improved look and feel, and included a more obvious call to action. We made sure that the cost is now visible up font and includes information about concessions and a ‘members go free’ link to the membership section. While we were still using the third party ticketing site, we also made sure the ticketing link opened up in a new window. The result? A 48.3% increase in clickthrough to the ticketing site.
The old ‘book tickets’ icon sat alongside a similarly obscure ‘visit shop’ icon. We replaced the shop icon with a new shop module which now features on all exhibition pages.
Step 6 – Make it easy for people to sign up (and know what they’re getting)
Building a healthy subscriber base is a vital tool in increasing reach and revenue. Previously we had a slightly ambiguous ‘keep in touch’ module on the homepage (in which people could enter their email address) and ‘keep in touch’ featured on the top navigation. We ended up removing ‘keep in touch’ from the navigation and scrapping the module entirely. We replaced them with a new ‘Sign up to our newsletter’ module, which features prominently on the homepage and in the sidebar on other pages. We changed the language so that it now has a more compelling call to action and people know exactly what they’re getting. The result? In the first week, signups increased 27.3% and at one point were up 225%.
Step 7 – Monitor, measure and respond
This project was as much about building a culture of continuous improvement within the digital media team as it was making tactical changes. I have to admit that before this sprint with Made by Many, we hadn’t got routine monitoring of site performance in place. But we’ve now made site wide performance improvements, by monitoring, among other things, page weight and page speed.
We discovered that the page weight of the homepage was too high and realised that human error was to blame. One reason was that we were loading unnecessarily large images onto the homepage. By ensuring that all images were optimised for web, we decreased the page weight by over 1MB. This had a positive knock on effect to page speed which, as anyone with a keen eye on SEO will know, is vital in a high search engine ranking. We now track our GPSI (Google PageSpeed Insights) score against our competitors. It increased to 86% which, at that time, was higher than any of our competitors. The site loads 3 seconds faster, which has a positive effect on user experience too.
This two week sprint was part of a much bigger phase of work to define the V&A brand online in which we proposed a series of recommendations for the next phase, which we’ve just embarked on. We’ll be building a new content management system and implementing an incredible new design for the site which we’ll be revealing in the spring.
In the meantime, and please forgive the shameless plug, if you’re interested in how you can use digital media to untap commercial opportunities in your organisation, do take a look at the V&A’s new professional development course, The Enterprising Museum, 29 February – 4 March 2016. I’ll be sharing insights and practical tools for how we’re using digital media in more enterprising ways and will be joined by colleagues from across the Museum with expertise spanning publishing, retail and licensing – and more.
This post expands on a presentation I gave at last week’s Digital ThinkIn, at the MAXXI Museum in Rome, #DigitalThinkIn. The full slide deck is available on Slideshare. Thanks to Prisca, Angela and the MAXXI team for inviting me to speak at this inspiring event.