4leggedITTemplate

    Standards

    Impact & Accountability

    A worked example of composing the Impact Stats and Spend Breakdown patterns together on one page — two separate, standalone components presented as one cohesive section, never merged into a single component.

    Combined example

    This is what a site shows once it has both a year's outcomes and that same year's expense breakdown ready — the outcomes lead, the spend breakdown follows immediately below with no gap in between, and the cost-per-outcome highlight ties the two together.

    Our Impact & Accountability

    Here's what our community made possible this year — and exactly how we spent it.

    FY2026

    • 480Adopted
    • 610Animals Helped
    Fiscal Year 2026, as filed
    Total Expenses

    $51,420

    $24,300Animal Care
    $15,750Rescue Operations
    $1,850Marketing & Outreach
    $6,420Administrative
    $3,100Fundraising

    $84

    per animal helped, FY2026

    Each pattern on its own

    Impact Stats Pattern

    Full documentation for the lifetime stat tiles and optional period-by-period bar chart, on its own.

    Spend Breakdown Pattern

    Full documentation for the rolled-up spend-category tiles sourced from a filed tax return, on its own.

    Standard

    - Still two separate components under the hood — ImpactStatsSection and SpendBreakdownSection are composed on the page, never merged into one. A site can show this combined section, either pattern alone, or neither.

    - Every figure on both sides must come from the same reporting period — pairing a lifetime impact total against one year's spending (or vice versa) is misleading, even if every individual number is accurate.

    - Give the title/description to the first component only (typically ImpactStatsSection) and leave the second title-less, so the pair reads as one section rather than two stacked demos.

    - The cost-per-outcome highlight is always computed by the page from the same same-period totals shown on both sides — never estimated or computed by either component itself.

    - Only build this combined page for a site once it genuinely has both a real impact dataset and a real spend dataset for the same period — don't pair one real side with a placeholder on the other.