Web Style Guide

This page outlines basic web styles used across the UNBC website. The title of this page "Web Style Guide" is our h1 heading.

Heading 2

Here is an example of text under an h2 heading.​

Heading 3

Here is some text relating to the heading 3. Since heading 3 is subordinate to heading 2, then this text should also relate to heading 2.


Paragraph

This is some paragraph text. Here are the details:

  • Font size: 16px
  • Colour: #29292a
  • Line-height: 24px
  • Font-family: Arial, Helvetica, Verdana, sans-serif

Helvetica Neue is our official font. We use Arial when Helvetica Neue isn't available.


Links

This is a link


Buttons

Action button


Text styles

Bold and italic text styles are used to draw emphasis and should never be used together. They should be used as little as possible to be most effective. Consider that if everything is emphasized, then nothing is emphasized. 

Bold: Heavy emphasis and best choice.

Italic: Gentle emphasis. Use sparingly since sans serif fonts don't stand out much when italicised.

Underline: We do not use underlined text on the UNBC website since it can be confused with hyperlinks.

ALL CAPS: We do not use all caps on the website.


Bulleted list

  • bulleted list item 1
  • bulleted list item 2
  • bulleted list item 3

Numbered list

  1. numbered list item 1
  2. numbered list item 2
  3. numbered list item 3

Horizontal rule

2px solid #eae7e5


Web accessibility

UNBC is working towards making the website fully compliant with the Web Content Accessibility Guidelines (WCAG). Here are some important guidelines we follow:

  • Provide text alternatives for non-text content such as images and videos
  • We only use images of text as pure decoration and supported by "Alternate text"
  • Ensure text sizes and colour contrasts are accessible
  • Headings are used to describe a topic or purpose
  • Headings are clear and concise and the structure of the information is reflected in the structure of the headings
  • Links are descriptive of their destination

Web colours

Links

#006464

hover: #008485

Official UNBC colours

Gold #b79527

Green #035642

Secondary colours

#88381d

#c05800

#977000

#5e8200

#617633

#3d5728

#9b208e

#8c1741

#550737

Greys

#151415

#29292a

#3e3d3f

#525154

#777677

#9e9c9d

#c4c1c1

#eae7e5

#f4f4f4