Training
Content
Navigation
See examples of navigation blocks (known as nav blocks), spotlights and other page navigation components.
Nav blocks
Nav blocks should always try to follow heading order. If the heading above the nav blocks is a h2, then the nav blocks should use h3 headings. If there is no heading above the nav blocks then they should use h2 headings.
Image sizes should be cropped to 745px by 468px.
Two in a row
Three in a row
Two in a row, no image
Three in a row, no image
Incomplete rows of nav items
If you have an incomplete row of nav items (5 items set to a 3 column nav-block for example) then you must add the class end to the final item in the block. This will left align the item and ensure there are no gaps in the row."
Call to action link
Spotlights
Images should be 845px by 600px. When choosing an image, allow for the left-hand side of it to get chopped off when viewed on a desktop screen.
Welcome to ßÏßÏÊÓƵ!
Congratulations to everyone who has a place at ßÏßÏÊÓƵ! Find out everything you need to know before you arrive on campus.
Single column block
Double column block
These should only be used on full-width pages, such as the homepage. See full width examples page.
Campaign banners
Images should be cropped to 633px wide, with a height of 400px.
Stick to about the amount of text shown in these examples. Less is more.
Email dcm@sussex.ac.uk if you need a content writer to refine campaign text.