Our website is in the process of being rebuilt and things may now work fully yet. Check out our new website project progress.

Our CarrickDojo Style Guide

Style Guide Overview

  • This page lays out the specific styling elements and page design for the CarrickDojo website.

Writing

Writing Guidelines

  • The most important consideration in writing for CarrickDojo is the audience.
  • Writing should be concise, transparent, intelligible and accessible, using clear and plain language that is comprehensible and suited to people of all ages including young children.
  • Clear: Ensure that your writing is clear and simple. In general, use active voice and unambiguous pronouns. Write short sentences, sticking to one idea per sentence. Define new terms, keeping the target audience in, before using them.
  • Concise: When writing any document, it's important to know how much to say. If you provide excessive detail, the page becomes tedious to read and it will rarely be used.
  • Consistent: Ensure you use the same verbiage consistently throughout the page and across multiple pages.
  • For specific technical writing guidelines, the Mozilla's Writing Style Guide is worth a read for anyone creating pages.
  • The Irish Government website has a style guide that includes preferred spellings although some of it is a little subjective.
Example recommendation on the use of URL in sentences.

URL: always capitalised. No need to spell out as Uniform Resource Locator (nobody knows what that means anyway). Can also say web address

Irish Government Style Guide

Fonts and Text

Our Site Fonts

  • We have tried to maintain a Consistent style with the coderdojo.com website and CoderDojo Foundation branding.
  • Our main font is Lato-Regular with a font weight of 400.
  • The class text-emaphasis is Lato-Regular with a font weight of 700
  • The CoderDojo logo has two fonts. The main text is LeagueGothic-Regular with a font weight of 400.
  • Inside the CoderDojo Roundel, the 1 and O are a very old font, and one of the orginal OCR fonts, OCR-A.
  • For handwriting text, we use schoolbell with a font weight of 400.

Images

Our Site Images

  • Images have been sourced from the CoderDojo resource pack.
  • We use have helper classes to easily change an image size to fit.

Containers, shapes and boxes

Our Shapes and Containers

  • A key reason many web frameworks exist is to provide reusability beyond what HTML was designed for. We have certain limitations in our site being primarily HTML and CSS.
  • We use have helper classes to easily create resuable content boxes and shapes throughout the site.

Utility Classes

A note or something to highlight!

A superstar box!

An example

A quote with a citation

Coder-Bryan