Why websites and content have to work on a mobile device

As of October 2018, there were 4.1 billion active internet users in the world, of which 3.9 billion were mobile internet users. Just to clarify, 95% of people who access the internet are doing it using a mobile device.

Browsing habits have changed considerably over the last few years – we idly browse on our phones while watching TV, rarely do we pull up a chair to our computer and settle down to ‘surf the net’. So we have to consider the variety of devices and screen sizes that our audience are using.

The rising tide of mobile use

It’s no surprise that mobile use is increasing when we consider the convenience they offer and the evolution of connectivity technologies over the last few years.

The Office for National Statistics (ONS) releases periodic data which suggests that mobile devices are the go-to devices for all age groups in Great Britain, with the exception of the 65+ age group in Great Britain.

Devices used to access the internet

And this plays out with https://www.derby.ac.uk as well. Year on year, our website is seeing a growing proportion of mobile users, and declining desktop usage.

Designing websites for a range of devices

Our new website has been designed with mobile use at the forefront of the development process, it is what is known as ‘responsive’ which means that it adapts the content to fit user device sizes and orientation. This approach allows us to deliver a more consistent user experience irrespective of the device they are using.

What we have seen over time is that users want to be able to explore websites and consume the content irrespective of the device they are using. They want this consistent user experience. But this isn’t the only consideration that has to be taken into account.

Eliminate clutter

Mobile devices have a more restrictive view-port which means that unnecessary elements become a hindrance to the user and will negatively impact the user experience. Websites with a clean user interface will result in users feeling more comfortable in browsing our website and will take on board more of the content that they see.

Mobile interaction is different

With a laptop, you use the ultra-precise mouse to interact with the device, with mobile you rely on a less precise pointing device – your finger! In practice, this means that there is no benefit in creating hover effects on links, buttons need to be large enough for our audience to use effectively and menus are best offered in an expandable format to ensure they don’t take over the valuable screen real estate.

Photography

Clear photography becomes more important with mobile users. An image may look perfectly clear on a desktop device but, on mobile, some images can be difficult to see so use of imagery should be carefully considered.

All of these things have been taken into account on the new website and we are continuing to work closely with many teams to ensure that new content continues to be developed with this in mind.

And this approach is having a positive impact

Our previous website had mobile pages, however they weren’t as optimised as they are on the new site – where we have rebuilt the site from the ground up. To pick out a few statistics:

  • Bounce rates (which measure users who leave the site after viewing one page) for users on mobile devices have improved by 20%.
  • We have seen a 7% increase in undergraduate prospectus requests and a 41% increase in postgraduate prospectus requests from mobile devices.
  • We have had a 4% increase in open event bookings from mobile devices.

We are seeing other interesting trends on an international basis as well. We have seen a 270% increase in mobile users in India and a 42% increase in mobile users in Asia in general.

The new website: 4 weeks in

With the new website being live for 4 weeks  now is the ideal opportunity to dig into the stats to see how things are going. Given the cyclical nature of university recruitment we have compared analytics data for the first weeks of the website going live to the same period last year.

Here’s what we found…

Site wide

Taking on an entire website rebuild was an ambitious target, but it gave us the opportunity to wipe the slate clean. Following the extensive research and discovery phase, we built a new structure focused around user needs. Mapping content into this structure enabled us to identify a large amount of redundant outdated content that could be archived.

The early indications on this approach are promising…

The number of unique page views have increased by 12.5%. This comes despite the new website having under half the number of pages as the old website. In addition, there has been a reduction in bounce rate of 25% and marginal improvements in the time users are spending on the site.

New website mock up

Mobile traffic continues to grow. Last year in the same period 53% of visitors were on desktop with 39% on mobile. We’ve seen this change to 47% on desktop and 46% on mobile. Add in the traffic on tablets and we can see more of our users are accessing the site on handheld devices than desktops.

Search

A key part of the project was implementing a new search solution; Funnelback. Since launch the use of search across the website is up 51%. Looking at the graph below there is an initial spike, which is to be expected with a completely new site, however this has settled down and is now generally tracking above the curve.

Website search analytics

Part of this could be down to improving the visibility of search.

During research it was identified that the core aim for users visiting the website is to a find a course. With this in mind course search occupies the primary real estate on the homepage. There are also separate landing pages for a central, undergraduate and postgraduate course search within the website structure. Bounce rate on search result pages is also down by 15% which indicates that the results being returned are more relevant for users.

Landing pages

Looking at the undergraduate landing page, unique page views are up 45%, but bounce rate has increased from 13% to 23%. Although, as a general rule of thumb, this is still low it is moving in the wrong direction. The story for the postgraduate landing page is very similar.

Digging into heatmaps we’ve had running shows us where users are interacting in the page. Course and subject links have proved to be the most popular across all devices, as shown below in an example segment of one of the maps.

Example heatmap

Across the board the aim is to provide easily navigable content based on what the user wants. We’ll digest these results and look into what tweaks to the content we can make and test over the coming weeks.

What’s next…

More research and more testing!

There have been some promising initial indications but we won’t be resting on our laurels. The stats overwhelmingly reinforce the opinion that course and subject is key for the majority of users on our website. We want to explore the behaviour on course and subject pages to see what users are doing, what kind of content they are engaging with and what they are trying to do. The more we understand that, the better we can help them to get there.

The website has a number of different audiences which reflect in the University’s plans for growth in areas such as online, B2B and research. We’ll be looking into the type of content users in these audiences are looking for. When we have an improved knowledge of this we can plan a new structure and content for these areas.

 

FAQ’s about the new website

Now that we have reached the exciting time where we are publishing our new website, I wanted to ensure that I answer as many of the questions which we have received throughout the build process.

We will add to these as we get more questions in to the team.

How do I report a problem?

One of the challenges of building a new website, and migrating so much content (29302 at current count), is that there are many intricate pieces that we have to get right. From the page content, internal linking to the redirects file (which contains almost 15,000 records!), there are bound to be some things fall through the cracks.

If you find any, please let us know! The whole team are on hand to squash any bugs that are found as quickly as possible. The best way to do this is email all of the details (and any relevant screenshots) to support@derbyunidigitalteam.atlassian.net.

On to the questions…

Where can I find…

A lot of things will be moving round as part of the new website. To give you a head start, here are some of the things we know you’ll want to find.

Site search

This will be accessible from every page on the website, you will see a spy glass icon on the right at the top of the page, this is where you can start your search from.

UDo, library and Staff areas

Links to UDo, the library and Staff areas are now in the footer (as they were on all mobile responsive pages of the previous site) and this will be the same on every page of the website. You will also find other commonly used links in the footer as well.

Staff profiles

We know staff profiles are very important so they have had a complete structural overhaul. They now use a more intelligent taxonomy so that each member of staff will be linked to relevant subject areas, Research Centre’s, College’s and Departments. This means we can create dynamic staff lists for any area of the organisation and other really cool stuff.

Staff profiles can be accessed by searching for the staff members name and selecting ‘Staff profile’ as the result type. We will shortly be launching a specific staff search page which will give greater visibility.

Staff profile user guides and logins will be setup over the coming weeks.

Why does it look like this?

Before concept work began, an extensive Brand project was undertaken in conjunction with an external agency and the Executive team. The output of this was a new, bolder and more confident brand. This brand project has had some very key influences on the new website which you will begin to see:

    • The line device and use of a box to emphasise particular content – you will see this in use in particular search results and on course pages to emphasis key information.
    • The use of patterns with nine colour variations – where a photograph isn’t needed we can use a variety of patterns and colours in title areas.

We have also spent a significant amount of time and effort on making sure that the foundations of the website follow accessibility standards which we will continue to build on.

Where can i find key areas of the organisation?

Information about the organisation is structured in a similar way to the previous website and can be found using the footer links. This content will be located at https://www.derby.ac.uk/organisation (but not until monday 🙂  )

We now have a much better search functionality, so why not search for what you are looking for?

The search results aren’t what I expected to see

As with any new search appliance, it will take time for the results to be returned in the most optimal order. Please report any issues to our support address at the top of this blog post and we will investigate!