View the new accommodation pages

Maria Drummond
Thursday 18 January 2018

As part of the external website programme, just before Christmas digicomms updated a large part of the Study at St Andrews section of the website. This involved restructuring information for prospective students.

A significant portion of the team’s time was devoted to the redesign of the accommodation webpages. Previously these pages were held in T4v7, so they were rebuilt in T4v8. The structure of the site was reimagined, the content was rewritten and the pages were given a new lease of life.

So what’s changed?

Accommodation homepage

The first thing you’ll notice if you are on the accommodation pages is the new landing page, which uses various patterns from the digital pattern library (DPL). The design is in line with the style used throughout Study at St Andrews, and users are presented with a clear call to action to the halls of residence page.

Halls of residence landing page

There are many different accommodation options at the University of St Andrews, so one of the things we considered when creating the new IA was how can these options best be presented to the user? With this in mind, we decided to categorise the halls of residences into ‘hall types’, for example:

  • Catered standard
  • Catered en suite
  • Self-catered standard
  • Self-catered en suite.

The halls of residence landing page lets users see this classification at a glance. While the page is aimed at both prospective undergraduate and postgraduates, the majority of the halls of residences are only for undergraduates, so we wanted to clearly indicate this to users with a separate postgraduate halls section.

Hall type page: catered standard

The design of the halls type pages was initially based on the existing course pages, but there was a need to alter the heading to make it somewhat similar to the long-form layout. After a little jiggery pokery, the two have been combined to improve the aesthetic of the page and help improve user experience.

The page is divided into several sections which are navigable throughout the page via the sticky navigation bar which follows the user down the page.

One new feature to the page is the inclusion of a 360 photosphere, which allows users to get a better feel for what a typical hall of residence room is like.


It was important for Admissions to access a general accommodation fees page which lists all of the individual fees for all of the types of accommodation. However, the Accommodation team needed the fees to be on each individual halls type page.

Normally, digicomms are against having the same information in two places, especially if these are fees. In terms of Consumer Protection Legislation, this can pose a risk as there could be the case that only one of the two pages is updated, or one page is updated incorrectly etc.

The workaround for this was that the fees listed on each individual hall type page are mirrored from a standalone fees page. This means that if one piece of content is changed, the mirrored content is automatically updated at the same time.

Fees and contracts

Individual hall pages

During the build, we referred to these pages as ‘light-touch’ halls pages, as that was their purpose: to provide basic information about the specific hall. Think location information, what facilities the hall has and some general history. Galleries and photospheres have also been included on some of these pages to give users a feel for what it’s like to live there.

The accommodation section also features information on applying for accommodation in general, as well as how to apply if you’re a visiting postgraduate or if you’re part of a couple or family who need accommodation.

Related topics

Share this story

Leave a reply

By using this form you agree with the storage and handling of your data by this website.