Header and footer
Most external-facing websites use the header and footer shown below which are incorporated in the standard templates. The Staffnet website uses a different header which is also part of the Steffnet templates and unique to the site.
Standard header
The header for websites should include the University logo (specifications below), site name, search box (if used) and links of the primary navigation (desktop) or menu icon (mobile).
1 — Site name
The site name should be vertically centred with the midline of the purple tab of the logo in desktop versions. For mobile versions, the name should be positioned below the logo. If long, the site name could wrap onto two lines.
- Font: Open Sans
- Font size: 24 pixels (can be reduced to 22px to ensure header works responsively on all screen sizes)
- Font weight: 400
- Font line height: 1.2 times of font size
- Font colour: #6B2C91
2 — Main navigation
The main navigation should include a home icon at the start (which should link to the website home page). The use of megamenus is optional.
- Font: Open Sans Light
- Font colour:#333333 or #fff
- Font size: 24 pixels (This font size is a guide value and is provided under the assumption that all of the top-level menu items fit on screen horizontally. It may be necessary to adjust the font size if there are a large number of top level menu items).
- Background colour: #ffffff or #6B2C91 or Faculty colour
3 — Search icon
If you're using the search icon, it should ideally be located top right of the page. In desktop versions add the word 'Search' alongside the icon and enclose it within a box with rounded corners.
- Font: Open Sans
- Font size: 22px (can be reduced to 20px to ensure header works responsively on all screen sizes)
- Box rounding border radius: 10 pixels
- Font colour: #333333
Standard footer
The footer for websites should include contact information, social icons (if used) and standard links to disclaimer, copyright etc.
1 — Headings
Font: Open Sans Light
Size: 18 pixels
Line height: 1.4
Colour: #FFFFFF
2 — Body
Font: Open Sans
Size: 16 pixels
Line height: 1.5
Colour: #AAAAAA
3 — Social media
Social media icons must be the official icons.
Height: 40 pixels
4 — Compulsory footer information
Font: Open Sans
Size: 14 pixels
Line height: 1.5
Colour: #AAAAAA
It should include links to disclaimer, data protection information, copyright notice, accessibility, freedom of information, charitable status and the University's Royal Charter Number: RC000797. These could link to the University pages or equivalents on your own site if necessary.