1. Home
  2. Docs
  3. Style Guide
  4. Notes, Tips, and Warnings
  5. Formatting and Placement

Formatting and Placement

Consistent formatting and placement of notes, tips, and warnings help readers quickly identify and understand the significance of the information being presented. Proper use ensures these elements stand out without disrupting the overall flow of the document.

Formatting Guidelines:

  • Use consistent styles for each type: Maintain a consistent style for notes, tips, and warnings throughout the document. This includes using specific icons, colours, or text formatting (such as bold or italic) to differentiate each type. For example, use a light bulb icon for tips, an exclamation mark for warnings, and an information icon for notes.
  • Apply distinct colours and borders: Use distinct colours and borders to visually differentiate these elements. For instance:
    • Notes: Use a neutral colour like blue or grey with a subtle border.
    • Tips: Use a positive colour like green to suggest helpful advice.
    • Warnings: Use a cautionary colour like red or orange with a bold border to indicate urgency or danger.
  • Use clear headings: Label each note, tip, or warning with a heading such as “Note,” “Tip,” or “Warning” in bold to clarify the type of information being presented.

Placement Guidelines:

  • Place notes, tips, and warnings immediately before or after the relevant text: Position these elements close to the content they relate to, so the reader encounters them at the appropriate moment. For example, place a warning immediately before a potentially risky step, or place a tip right after explaining a complex concept.
  • Avoid overuse in a single section: Limit the number of notes, tips, and warnings in a single section to avoid overwhelming the reader. Use them strategically to highlight the most critical information.

Dos:

  • Use distinct icons and colours for each type: Example: Use a red exclamation mark for warnings.
  • Label each element clearly with a heading: Example: “Tip: Save your work frequently to prevent data loss.”

Don’ts:

  • Don’t place notes, tips, and warnings far from the related text: This can confuse the reader and reduce the effectiveness of the information.