Layout Rules

Announce at start: "I'm using the humane:layout-rules skill to check this layout against the defect avoid-list."

A defect-class avoid-list for tool/dashboard UIs. Every rule is a bug or design smell actually caught in a real build-and-audit cycle — treat them as hard constraints, not suggestions.

Usage

1. Read the full ruleset: layout-design-rules.md, bundled next to this file (single source of truth — do not duplicate it here).
2. Before designing: apply sections «Structure & hierarchy», «Color & contrast», «De-slop» as constraints in the design plan. Say explicitly which rules shaped the plan.
3. While building: enforce «Footers, metrics, copy», «Tables & lists», «State & navigation», «Interaction correctness», «Accessibility & touch», «i18n & theming».
4. After building: run the post-build checklist below; screenshot-test in a real browser (rule 29) on both themes and on an empty/minimal dataset (rule 30).

Post-build checklist (the ones most often violated)