Data visualization
Choose the simplest visual that reveals the relationship.
- Comparison: bars. Trend: lines or areas. Composition: stacked bars or a small number of slices. Relationship: scatter. Flow or architecture: node-link diagram. Exact lookup: table.
- Label axes, units, periods, and sources. Start quantitative bar axes at zero unless a clearly explained exception is essential.
- Use color consistently and sparingly; do not encode crucial differences only through hue.
- Put the key takeaway near the visual and annotate meaningful changes.
- Avoid fabricated values. If the brief provides no data, use an explicitly labeled illustrative dataset or design an empty state.
- Make charts reflow without shrinking labels into illegibility.
Use native HTML/CSS/SVG for self-contained artifacts. Keep SVG text accessible and provide an adjacent textual summary for complex visuals.