Web font sizes (desktop)

Titles

H1 - Noto Sans - 30px

H2 - Rokkitt - 30px

H3 - Rokkitt - 24px


Navigation

Main Navigation – Noto Sans – 16px

Main Navigation dropdown primary – Rokkitt 18px

Main Navigation dropdown secondary – Verdana 12px bold

Main Navigation dropdown tertiary –Verdana 12px

Website header

Header Icon Text & cookies – Verdana 12px

Header site search input field - Noto Sans 24px

Header call us - open times - Rokkitt 20px

Header call us - phone number - Rokkitt 30px

Header call us - link - Verdana 12px

Header holiday search title - P22 freely 30px

Header holiday search form fields - Verdana 12px

Breadcrumbs – Verdana 12px

Tabbed Navigation Level 1 & 2 – Noto Sans 15px

Campsite name rules

Campsite page 
Campsite name: H1
Region & Country: H3
Site number: 11px Verdana

Campsite & Apartment list Campsite name: 20px Noto Sans
Region & Country: 18px Rokkitt

Search results page
Campsite name: 24px Noto Sans
Region & Country: 20px Rokkitt
Site number: 11px Verdana

Typography in images

The fonts often used in images are Serial Sue, P22 Freely and Rokkitt. When placing fonts in images it is recommended that the following pointers are considered.

  • Legibility of type
    consider contrast of background, especially when a overlay image goes responsive in a custom component.
  • Size of type
    Due to the variable sizes of mobile devices it is recommended that the minimum font size to use in images is 28px. Also consider the size of fonts across devices.
  • Shadows
    Drop shadows on type do not follow brand guidelines so it is reccommended not to use drop shadows.
  • Capital letters
    The Serial Sue font has some capital letters that look inconsistent to the rest of the font (i.e. M). Where nessasary it is recommended to either use a lowercase letter with an increased size, or possibly consider P22 freely as a replacement.

Typography, icons and Font classes