The University homepage is a popular page and remains a significant entry point for visitors to bath.ac.uk. In 2025, the homepage received around 10,000 engaged sessions per day, and 14% of our active users started their journey from this page.

Project background

This project will review the version of the University homepage launched in 2021 and propose improvements for a redesign.

The benefits of the 2021 design were:

• a visual appearance more consistent with other bath.ac.uk web pages
• a responsive design which adapts the page for viewing on mobile devices
• improvements to accessibility
• functionality for adding structured content

The design includes a:

• hero section with a headline feature or call to action
• tabbed content area including information about courses, research, community, innovation, and job opportunities
• promotional area, used for research impact stories and Open Days, for example
• media carousel
• news section
• social media section

Members of the Digital Content and Communications & Engagement teams regularly update the page.

Review of the 2021 University homepage

After the relaunch of the homepage in 2021, we reviewed its performance and benchmarked it against other university homepages.

Design

While the 2021 homepage introduced new features and functionality, we noticed some limitations in the design. These include:

• a less prominent heading and summary for the hero section, when compared to other parts of the page
• low engagement rates with the tabbed content sections
• low user scroll depth

Site traffic

Using Google Analytics data, we examined the homepage's performance. In 2022, we looked at traffic from external visitors to our pages over one year (August 2021 to August 2022) and 30 days (August 2022). We found that the homepage is the most viewed page on the site and has the highest number of entrances of any page.

After visiting the homepage, most visitors then navigate to course-related information pages. Other popular pages visitors navigate to after the homepage include:

• Departments
• About the University
• Graduation Ceremonies

Benchmarking

We compared our homepage design to that of other universities. We found that there was a common approach in the designs, with some noteworthy best practices being:

• eye-catching content at the top of the page
• clear and bold messaging
• clean visual design that fits with the university's brand
• content that aligns with the overall message
• good consideration given to accessibility

We also found very prominent course search boxes and a visual showcase of the university's research.

Review recommendations

Based on this discovery work, we concluded that our homepage lacked a clear focus and attempted to do too many things at once. It was agreed that a new design was needed and must:

• make an impact
• have a clear message about the University
• be more dynamic
• be clean and simple

We also identified internal requirements for:

• flexible sections which could be reordered or changed with University activities
• a simple and easy to use maintenance process

Frontend design concepts

Following the discovery work, we developed a series of initial frontend design concepts.

Based on our existing Lens design system, the concepts feature full-width sections and neutral background colours. In later iterations, we also introduced rounded corners to some elements to give a softer feel.

We included functionality for a hero video, along with a search box and a prominent call to action. We also planned for a takeover mode to switch to an alternative page layout for key events, like Open Days.

Global navigation

The design concept redesigned the Global navigation to combine the University header and the navigation bar into a single area, rather than being separated into two coloured bands. This combined design gives a uniform look and reduces height.

The links in the Global navigation bar (for example, 'Courses' and 'Research') feature subtle animations when you hover over them.

The search box doesn't appear in the homepage Global navigation by default, as there's a search box in the Hero section. If a Typecase user chooses to hide the hero search box, the search box will appear in the Global navigation bar instead.

Hero section

At the top of the homepage is a prominent section that can include either a hero image or a background video. Images and videos will complement the content on the page, such as scenic shots of the campus or relevant footage for a takeover event, like an Open Day.

The search box in the Hero section includes radio buttons so users can filter the results by:

• courses
• research
• events
• people
• news
• all

This helps makes the search results more precise. There is a subtle motion effect when a user interacts with the search box.

Main content

The design concept includes separate sections for:

• studying at Bath
• research
• news and events

These sections can be reordered and provide additional options for images or video. There's also functionality for carousels to display news and events.

Footer

The new footer concept retains links to important policies, but also includes the University address and links to a map, social media accounts, and popular pages on bath.ac.uk.

Backend design concept

We design the backend edit screen for our Typecase publishing platform. As part of the design, we wanted to make sure:

• components were flexible to use and could be reordered easily
• content could be set as either hidden or shown - this makes maintenance easier, as time-sensitive copy can remain in place until needed
• navigation and editing was made faster, with collapsible and expandable components

Takeover mode

The backend template supports multiple versions of the homepage, including a default layout and several takeover layouts. The takeover layouts are kept in draft and then published when needed for key events, like Open Days or Graduation Ceremonies.

Takeover layouts make it easier to plan and maintain content, as layouts can be drafted and signed off in advance without danger of them being publish before the event.

Typecase users can then change the layout back when the event is over.

Testing the homepage design concepts

Stakeholder review and feedback

We shared the design concepts with a range of stakeholders across the University, including both Typecase and non-Typecase users. The concepts showed the homepage in a range of takeover layouts and with various components.

The feedback from stakeholders was generally positive. They agreed with the rationale behind our decisions and approved of the design concepts and functionality. Everyone agreed that the 'Study at Bath' section wasn't effective, so we began to work on a new concept based on the three pillars that support our student recruitment strategy - employability, location, and quality of education.

User testing

Testing method

We ran a guerrilla usability study using two prototypes:

• the new University homepage
• the existing student landing page using the new Global navigation bar

We invited 19 current students on the University campus to take part in the user testing. The participants were a mix of undergraduate and postgraduate students and were studying a variety of subjects.

We asked participants to complete a series of tasks using the new search box in the hero section of the University homepage. These included using the search tool to find either course or accommodation information, both with the ‘courses’ filter option selected by default. The order in which the tasks were presented was randomised.

Insights from testing

Search box filtering

Many participants didn't notice the option to filter their searches - this was particularly significant when they viewed the design on a mobile device.

By default, the search box was set to filter queries to 'courses' and not 'all'. This caused some confusion, as many participants didn't notice this and didn't understand why their search results didn't relate to their query.

Global navigation bar

We asked participants to test a change to the Global navigation bar, where the search box was changed to a search button. This was to make the design easier to roll out across the rest of the website in future.

We found that participants had no problems with this change. Some participants reported that the search box was not automatically focused when they clicked the search button.

Homepage design

Participants were also asked for their views on the new University homepage design. All participants were positive about the new concept, with many commenting on the appealing design of the hero video, search box, and homepage more generally.

Developing and testing the new University homepage

Following user testing and stakeholder feedback on the design concept, the Digital Development team began frontend and backend development for the homepage.

We created a working version of the homepage in the Typecase staging area and then tested it with the Typecase users responsible for updating it.

Partials

One of the questions raised during testing was how different teams could update the homepage simultaneously without accidentally publishing another team's draft content.

The Digital Content team and the Communications & Engagement team are responsible for updating and maintaining different sections of the homepage. At the moment, if users from both teams make updates at the same time, it's possible for one team to publish unfinished changes from the other team. The risk of this happening is even greater with the addition of the takeover layouts, which are left in draft until needed.

The Communications & Engagement team are responsible for updating the:

• News component (used to display news stories)
• Key message component (used to display emergency messages)

To simplify the process for each team, and avoid accidental publishing, we've recreated these two components as Partials. They now exist as their own content items in Typecase but are also integrated into the homepage. This means users from the Communications & Engagement team will be able to update and publish the News and Key message components without publishing the rest of the homepage content.

Search box iterations

After more testing, we decided to refine the search box design, removing the filters from the mobile version to provide a simpler, less cluttered interface. Based on existing search data, we also reduced and reordered the filters on the desktop version of the search box to:

• all
• courses
• events
• people
• news

Relaunching the University homepage

The new University homepage will be published in May 2026.

The new design features:

• new Global navigation bar and footer
• a redesigned hero section with the ability to add background video, multiple calls to action, and a search box
• customisable design and easier editing with flexible components
• full-width split sections to give more space text and media
• takeover layouts for key events and activities
• separate content items to allow the Digital Content and Communications & Engagement teams to make simultaneous updates