When to use the Awards and accolades component

Use the Awards and accolades component to display small images or graphics with some text to demonstrate relevant:

• accolades
• accrediting bodies
• awards
• product or service features
• sponsors
• partners

For example, you could use an Awards and accolades component to show a Research Centre's awards on their Landing page.

You can use the Awards and accolades component on a:

• Case study
• Landing page
• Topic

An Awards and accolades section on a web page.

Finding the Awards and accolades component

You can add one Awards and accolades section to each Case study, Landing page, and Topic.

To find the component in the template:

1. Open the drop-down menu under 'Drag and drop components'.
2. Select 'Awards and accolades '.
3. Click 'Add component'.

The Awards and accolades component will appear beneath 'Component(s) currently in use'.

Adding content to the Awards and accolades component

Title and summary

In the Title field, add a title that describes all the accolades you're displaying, for example, 'Highly ranked for graduate prospects'.

In the Summary field, give the accolades more context to tell users why they're important, for example, 'Bath graduates are highly valued and sought after by leading graduate employers.'

Highlight image shape

Use the radio buttons to select the shape your images appear. You can choose from:

• circular - this is best for displaying rankings, portrait photos, and square photos
• rectangular - this is best for displaying logos and rectangular (landscape) images

You can only choose one shape for all the accolades in your Awards and accolades section.

Adding an accolade

Click the 'Add accolade' button.

You can add up to six accolades in one Awards and accolades component.

Award type

Use the drop-down menu to select the type of accolade you're including.

Description

In the 'Description' field, add a brief explanation of the accolade, for example, 'We're ranked 6th for graduate prospects by the Complete University Guide 2022'.

You mustn't make unsubstantiated claims on the University website. Reference any awards, accolades, or rankings and, if possible, link to the source of information in the Awards and accolades component or the Footnote component.

Do not use a full stop at the end of the description.

Image

Add the image URL to the 'Image web address (URL)' field.

If you chose the:

• circular image shape, your image should be 200 x 200 pixels or larger, in a 1:1 ratio
• rectangular image shape, your image should be 200 x 113 pixels or larger, in a 16:9 ratio

Don't use images with small details because users won't be able to see them clearly on the website. For awards and rankings, it's usually best to use a number graphic to represent our position instead of a photo. You can ask the Digital Content team for the correct number graphic.

Add some alternative text to the 'Alternative image text (alt text)' field to describe the image for people who can't see it.

Related content link

You can add a link to each accolade using the 'Related content web address (URL)' field.

If necessary, you should use this to validate the claim or statement in an accolade by linking to the source of the information.

Related content button

You can also add a Related content button to link to another page relevant to the Awards and accolades section, for example, 'Learn more about our rankings and reputation'.

The Related content button appears at the bottom of the Awards and accolades section.

To add a Related content button:

1. Add some short, descriptive link text to the 'Related content button text' field.
2. Add the destination page URL to the 'Related content button web address (URL)' field.

Moving your content around the page

You can drag and drop each individual Accolade to change the order they appear in the Awards and accolades section.

You can also drag and drop each Awards and accolades component to reorder the components on a page.

Click 'Collapse this section' to hide the Awards and accolades component or each individual Accolade while you work on other areas of the page. The content will still appear on the preview and published pages if you collapse part of the template.