Streamlining Structure and Systems: Case Study of Academic Unit Sites

This is the second of our Go Mobile show and tell posts. Jane has already introduced some features of the new design using examples from central sites. Now, I’m going to look at some design changes on academic unit sites.

Tabbed pages

Our school sites are large. They’re complex and in some cases six or seven levels deep. Through Go Mobile we’re improving the structure of our sites and this includes making them shallower. One way of doing this is to introduce tabbed pages. Tabbed pages also allow us to split up long pages into shorter sections.

Take this example from the School of Agriculture, Food and Rural Development (AFRD).

Screenshot of cropped research group page on old Agriculture, Food and Rural Development website

Click on the image to display the full, uncropped version of the Food Quality and Health page on the old AFRD website.

Their research groups previously had a single page that included:

  • an overview of their research interests
  • a list of research themes
  • a staff list
  • a projects list
  • information about their teaching and learning activities

The new tabbed page allows this information to be split out into three or four much shorter pages with the tabs showing across the page on desktop.

Screenshot of tabbed research group page on new Agriculture, Food and Rural Development websiteOn mobile the tabs appear in a drop-down menu:

Screenshot of research group page on mobile with drop-down menu collapsed        Screenshot of research group page on mobile with drop-down menu expanded

Staff lists

In both the old and new design staff lists are generated from MyImpact data. The main difference, as you’ll see below in the example from the Schools of Architecture, Planning and Landscape (APL) is that profile images are now displayed in staff lists on desktop.

Screenshot of staff list on old Architecture, Planning and Landscape website

Old APL staff list

Screenshot of staff list on new Architecture, Planning and Landscape website

New APL staff list

On mobile the images disappear so that more information can be displayed on the smaller screen.


News lists appear in a very similar format in the old and new designs. The biggest change is behind the scenes. Previously our editors had to use a separate system to generate news for their site. News is now incorporated into the content management system (CMS) that we use to publish all content on a website.

Screenshot of latest news page on the new Institute of Sustainability websiteThe new CMS allows you to syndicate news into a feature news grid on your site’s homepage. This requires high quality imagery for every news item. As an alternative, some academic units have opted to display a simple news ticker on their homepage.

Screenshot of homepage news grid on the new Institute of Sustainability websiteTell us what you think

As always, we’re interested to hear your feedback. All the new sites have a link to our feedback form in their footer. You can also leave us a comment on this post.

Related posts

Share this post:
This entry was posted in Design and Development, Go Mobile and tagged by Emma. Bookmark the permalink.

About Emma

As one of our web content officers Emma plans, writes and edits content for the central website. She helps to maintain the University’s content style guides and is responsible for development of the team’s website and this blog. Emma is a productivity geek and always on the lookout for solutions that can help the team work smarter.