Catalog

Guideline Catalog

Browse visualization guideline records with sections, labels, and references.

781 records

Page 3 of 33

  1. Add reference structures when 3D position is hard to decode

    For lookup and compare tasks in 3D scenes with ambiguous depth, use regular reference structures on the display to improve fidelity and address misread spatial position for viewers locating marks in depth.

    • purpose:refine
    • basis:empirical
    • task:retrieve
    • quality:fidelity
    • lever:layout-structure
    • +2

  2. Add search and sorting when readers need their own row

    For retrieve tasks on record-list tables with reader-specific relevance, use search and sortable columns on tables to improve findability and mitigate slow manual scanning for readers seeking their own record first.

    • purpose:refine
    • basis:heuristic
    • chart:table
    • task:retrieve
    • quality:readability
    • +2

  3. Add separating strokes between same-colored categories

    For charts that group multiple categories with one shared color, use separating strokes on adjacent or overlapping marks to improve readability and mitigate lost boundaries for readers tracking individual categories.

    • purpose:refine
    • basis:heuristic
    • lever:encoding
    • group-cardinality:many
    • quality:readability:use
    • +1

  4. Add subgroup views beside the aggregate scatterplot when trends may reverse

    For grouped relationship analysis, use a multi-view subgroup breakdown on scatterplots to improve trust and mitigate the risk that the aggregate trend hides within-group reversals for readers interpreting associations.

    • purpose:refine
    • basis:empirical
    • task:relate
    • scope:grouped-result
    • chart:scatter
    • +3

  5. Add symbols when table cells are distinguished by color

    For tabular status displays, prefer symbol encoding alongside color on table cells to improve accessibility and mitigate color-only status decoding for readers with color-vision deficiency.

    • purpose:refine
    • basis:heuristic
    • chart:table
    • quality:accessibility
    • lever:encoding
    • +3

  6. Add task-specific instructions to use the bundle center, not a single line

    For point-location judgments in static uncertainty forecasts, use task-specific instructions on ensemble path maps to improve fidelity and mitigate line-overlap bias for novice viewers.

    • purpose:refine
    • basis:empirical
    • chart:map
    • data:geospatial
    • quality:fidelity
    • +3

  7. Add text annotations to carry the panel-to-panel narrative

    For sequential explanation in multi-panel charts of interrelated measures, use text annotations on each panel to improve insight and address unexplained relationships for readers following an unfolding story.

    • purpose:refine
    • basis:heuristic
    • task:relate
    • structure:small-multiples
    • quality:insight
    • +3

  8. Add tooltips for region names and values

    For interactive choropleths, use tooltips on regions to improve readability and mitigate hidden names and values for readers inspecting specific places.

    • purpose:refine
    • basis:heuristic
    • chart:choropleth
    • component:tooltip:use
    • quality:readability
    • +2

  9. Add unlabeled axis ticks to continuous color keys

    For lookup on continuous quantitative color keys, use axis ticks on legends instead of extra value labels when tick spacing is useful and predictable to improve readability and mitigate clutter from too many numbers for readers estimating magnitude.

    • purpose:refine
    • basis:heuristic
    • data:quantitative
    • quality:readability
    • lever:encoding
    • +2

  10. Add visible explanatory text that states the chart’s purpose and takeaway

    For visual interpretation of a chart, use visible explanatory text on the chart to improve accessibility and mitigate generic titles and unstated takeaways for readers who may struggle to infer purpose from the display alone.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:text-annotation
    • communication:framing
    • +2

  11. Add visible instructions for every chart interaction

    For interactive chart use, use visible interaction instructions on charts with any interactive controls to improve accessibility and mitigate undiscoverable keyboard and pointer actions for users with keyboard-only or cognitive access needs.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:interaction-access
    • component:annotation:use
    • +3

  12. Add visible summary text that states the chart's takeaway

    For chart interpretation, use visible summary text on a chart to improve accessibility and mitigate missing context or ambiguous reading for viewers.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:text-annotation
    • communication:context
    • +1

  13. Add well-designed pictures when patient materials must work for low-literacy readers

    For patient education and shared decision-making communication, use pictorial encoding on materials that present quantitative health information to improve accessibility and mitigate comprehension problems for readers with low health, numeric, and graph literacy.

    • purpose:refine
    • basis:empirical
    • data:quantitative
    • quality:accessibility
    • lever:encoding
    • +2

  14. Add zebra shading only to long tables with many columns

    For dense tables with many columns, use alternating light row shading on tables to improve row tracking and mitigate accidental jumps between distant columns for readers reading across wide rows.

    • purpose:refine
    • basis:heuristic
    • chart:table
    • quality:readability
    • lever:encoding
    • +2

  15. Add zooming when treemap regions become too small to inspect

    For overview of large hierarchical treemaps on limited-resolution displays, use zooming on a treemap to improve readability and address regions that are too small to represent for users inspecting many items.

    • purpose:refine
    • basis:empirical
    • chart:treemap
    • data:hierarchical
    • quality:readability
    • +3

  16. Adjust uppercase text with more spacing, smaller size, and bolder weight

    For short labels and headings that must be set in uppercase, use extra letter spacing with smaller, slightly bolder uppercase text on chart labels to improve readability and mitigate overly wide, dense all-caps text for readers scanning interface-like elements.

    • purpose:refine
    • basis:heuristic
    • quality:readability
    • lever:text-annotation
    • polish:spacing

  17. Align bar baselines for single-value comparison

    For compare tasks on single-value bar displays, use aligned position encoding on bar charts to improve fidelity and mitigate imprecise single-value judgments for readers making direct value comparisons.

    • purpose:refine
    • basis:empirical
    • task:compare
    • scope:single-result
    • chart:bar
    • +4

  18. Align compared bars to a common baseline

    For compare tasks, prefer position encoding on bar charts to improve fidelity and address errors from judging segment length without a shared baseline for readers making exact value judgments.

    • purpose:refine
    • basis:empirical
    • task:compare
    • chart:bar
    • data:quantitative
    • +5

  19. Align compared segments to a common baseline in stacked bar charts

    For exact comparison tasks, prefer common-baseline alignment on stacked bar charts to improve fidelity and mitigate length-comparison errors for viewers making quick visual estimates.

    • purpose:refine
    • basis:empirical
    • task:compare
    • chart:bar
    • quality:fidelity:use
    • +3

  20. Align slope cues with the true range in bar-chart comparisons

    For quick compare tasks, prefer slope-aligned encoding on paired bar charts to improve fidelity and mitigate wrong larger-range judgments for viewers making rapid perceptual comparisons.

    • purpose:refine
    • basis:empirical
    • task:compare
    • chart:bar
    • structure:multi-view
    • +3

  21. Align visual centroid with the true mean in bar-chart comparisons

    For quick compare tasks, prefer centroid-aligned encoding on paired bar charts to improve fidelity and mitigate wrong larger-mean judgments for viewers making rapid perceptual comparisons.

    • purpose:refine
    • basis:empirical
    • task:compare
    • chart:bar
    • structure:multi-view
    • +3

  22. Anchor date-specific annotations to single data points

    For date-specific context over ordered time, use single-datum text annotation on annotated line charts to improve insight and address ambiguous message-to-mark mapping for readers scanning historical events.

    • purpose:refine
    • basis:empirical
    • time:ordered-time
    • chart:line
    • lever:text-annotation
    • +2

  23. Animate individual draws for uncertain ordering comparisons

    For comparison tasks on a few uncertain quantitative variables, use animated individual draws on uncertainty displays to improve ordering-estimate fidelity and mitigate misreading of variable-order reliability for readers without specialized statistical training.

    • purpose:refine
    • basis:empirical
    • task:compare
    • quality:fidelity
    • lever:interaction-access
    • +4

  24. Animate meaningful chart updates and announce state changes

    For dynamic chart updates, use bounded transition timing and state announcements on changing chart elements to improve accessibility and mitigate hard-to-follow changes for readers following meaningful data updates, including screen-reader users.

    • purpose:refine
    • basis:accessibility
    • quality:accessibility
    • lever:interaction-access
    • temporal-pattern:dynamic
    • +1