Abstract search hero

This content type is an extension of the standard Abstract Hero, incorporating a search box, and an optional A-Z link.

It is intended for use on key pages, to give a visually interesting start to the page while also putting the search box front and centre. Having a search box higher in the page has been shown to increase use, while the use of a search box also tends to be equated with higher engagement overall.

The narrow format of this content type compared to an image hero takes up less vertical space on the page and gets users to the content more quickly.

This content type is restricted to the Digital team, due to the need to include a search content type in the same section with the correct search parameters for the section. 

Key features

• abstract background image
• optional breadcrumbs
• optional call to action button
• page title (H1)
• search box with placeholder text and search icon button (magnifying glass)
• optional A-Z link, can be used for course listings for example

Image guidance

• the ideal image size is 2560 x 800px
• as this is a full-width hero, images with a reduced width should not be used
• using taller images (greater than 800px) will mean that only a relatively small horizontal slice of the image is shown
• further guidance on sourcing suitable images can be found in the Abstract Hero guidelines.
• all images must be optimised using TinyJPG before uploading to T4

Examples

• UG course search using abstract image based on prospectus patterns, A-Z link included
• PG course search using abstract image based on prospectus patterns, breadcrumbs included