Inspiring leaders; improving children's lives

Log into the Learning Gateway

Help Centre

Visual design

3.1 NCSL logo

The NCSL 'swoosh' logo should always appear in the top-right corner of NCSL websites (see top right of the NCSL corporate website template for an example).

The 'swoosh' can have different colours applied to it within the NCSL colour palette (see Section 3.4 - Colour palette). Minimum width for the logo is 205 pixels with the text clearly visible.

3.2 Page size

The design must work at a minimum screen size of 800x600 pixels. Pages sizes exceeding 600 pixels high may scroll vertically. No pages may scroll horizontally at this resolution.

3.3 Navigation

There must be a consistent and consistently placed navigation throughout the site.

3.4 Colour palette

There are three primary NCSL colours and a range of secondary colours.

3.4.1 Primary colours

ColourRGBHexadecimal
 0,0,0#000000
 70,156,35#009900
 181,181,181#999999

3.4.2 Secondary colours

ColourRGBHexadecimal
 42 80 46#336633
 76 82 42#666633
 105 27 37#660000
 240 107 10#993300
 73 46 37#330000
 193 220 0#CCCC00
 189 191 162#CCCC99
 192 0 39#FF0000
 255 196 0#FF9900
 206 186 146#FFCC99
 0 35 105#003366
 99 26 75#000066
 239 107 145#FF9999
 253 160 0#FFCC00
 17 96 198#0066CC
 107 73 200#666699
 80 132 159#6699CC
 142 91 100#996666
 136 173 227#99CCFF
 188 144 204#FF99CC
 187 206 216#CCFFFF
 196 155 162#FFCCCC

3.5 Font and typeface

NCSL has two corporate typefaces: Rotis Semi Serif and Ocean Sans Light.

3.5.1 Body text, headings and subheadings

All textual content should be tagged up correctly using HTML. Although Ocean Sans Light is used for body text and subheadings within NCSL printed materials, it is not appropriate to use it in the same way for web information as it is not a standard system font and will not appear correctly on the majority of computers. Fonts for body text and headings 1-6 should be standard system fonts and be defined within style sheets. See also Section 3.5.3 - Style sheets.

3.5.2 Title graphics

Rotis Semi Serif is used as a headline typeface for cover titles and page titles. This is not a standard system font so may only be used in graphical elements and not in textual content. Bold or italic versions of this font should not be used.

3.5.3 Style sheets

NCSL recommends the use of style sheets to define a tight set of styles that will be used within NCSL websites to improve consistency.

All text content should use standard system fonts – our preference is Verdana.

System fonts:

Graphics should not replace headings or subheadings within web pages. Headings should not be italicised.

See also Section 2.2 - CSS.

3.5.4 Underlining

Only use underline when indicating a hyperlink.

3.6 Graphics and photography

Children's faces should not be visible in photographs used within NCSL websites unless with explicit permission (eg actors in stock photography).
NCSL's marketing department can assist with any queries about appropriate use of photography, contact marketing@ncsl.org.uk.