Stats Intent and Usage
Stats blocks can be used to display "at a glance" information about the information that MDC holds. They help surface key factoids about conservation topics in a minimalistic, easy-to-digest format. They are another way beyond imagery and text to provide information to site visitors and encourage engagement with MDC as well as an understanding of what the department does.
Stats Design Guidelines
- These are intentionally simple, presenting up to two stats in a single block, where each stat is represented by an icon, label, and value.
- Additionally, each individual stats block (which may contain two statistics) includes a title and optional button link.
Stats Editorial Guidelines
- Use brief and succinct wording to label the stat as shown in examples below.
- Use numbers and other characters such as , . % and $ to represent the stat value.
- Enter a brief title that encompasses a topic relevant to the stat or stats.
- If desired, specify a destination and display text to encourage exploration of the content by users.
Single-column example
This example shows two stats within a single block. When placing a two-stat block, it is ideal to place it in a space that is 66%, 75% or 100% width (either a single-column or two-column section with 66/33 or 75/25 layout).
Stats Title
Percent of Missouri residents who hunt or fish
75
Number of Missouri flower species that are protected
55
Two-column example
In the below example, a two-column section has been added to the page, with 50/50 layout. On the left we've added a single stat block with a single stat, and on the right we entered sample text.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.