Standard page

See the components which are usually used on a page with a left-hand navigation menu. These pages usually start with a standfirst, in the style of the previous sentence, an image and then the first header and text content.

Page titles (headings – h1) and standfirsts

Every page should have an h1 and a standfirst. These have their own fields in the WCM, separate from the page content editor.

The h1 should be sentence case (e.g. ‘Undergraduate courses’ rather than ‘Undergraduate Courses’), unless dealing with proper nouns like a research centre (e.g. Sussex Centre for Consciousness Science).

A standfirst should summarise the key point of the content and set expectations for a user. It usually expands on the page header by providing essential context, ideally without repeating wording (e.g. a page with ‘Undergraduate courses’ as the h1 could refer to them as 'degrees', which helps to keep the copy varied and capture more search times). The standfirst should be sentence case and no longer than 160 characters. Do not add links or any other text formatting to the standfirst.

Full-width image

Page images should be cropped to 745px by 468px.

Students enjoying a lecture

Image accreditation 

Whenever you’re using images not supplied by the university photographer, you must include accreditation at the bottom of the page the image is used on.

Find out more about image copyright.

Subheadings

Subheadings are secondary headings used to break up content on a webpage into logical, readable sections. They improve readability and accessibility, making it easier for readers and search engines to understand the structure, flow and key topics within a page. The page title is always an h1 heading, so every subheading used within a page will range from h2 down to h6 as needed.

Subheadings should follow a hierarchical order. If you have an h3, any sub-headings within must be h4 (and further subheadings within the h4 must be h5 etc.). 

At least one line of body text should run under every heading level. For example, don't stack an h3 header directly under an h2.

See below for the range of heading levels.

Subheading - h2

Body text. 

Subeading - h3

Body text.

Subheading - h4

Body text.

Subeading - h5

Body text.

Subheading - h6

Body text.

Call to action link

Read Poppy's story

 

Bulleted lists

We have two styles for lists: ordered and unordered.

Before you start using them, read about:

Unordered

  • Foundation year
  • Year 1
  • Year 2
  • Year 3.
 

Ordered

  1. Foundation year
  2. Year 1
  3. Year 2
  4. Year 3.
 

Quote with image

Images should be cropped to 230px by 230px.

All quotes should be no more than 140 characters. This includes spaces and quote marks.

The example below is 135 characters.

Daniel Manning
“What stands out about my MA is the learning environment in which different languages and experiences are brought into the discussion.” Daniel Manning
Applied Linguistics MA

 

 

Quote without image

The example below is 121 characters.

It was the scholarship that made me apply to Sussex. Without that extra funding I would have struggled to take my Masters.” Jacob Dunstan
Chancellor’s Masters Scholarship 
 

Staff card

Name

Blurb

Email: name@sussex.ac.uk

Read more about Name

Name
 

You might also be interested in: