Appendix

Guidelines and references used in site design.

5-1 References

The site uses solutions based on the ideas and philosophy of several sources. Use these links and references to get a deeper understanding of how the different components of the site were built and how they are maintained.

5-1.1 Design

5-1.2 Tools

5-1.3 Data visualization

5-2 Data Visualization Guidelines

Apply these principles to data charts and graphs. When developing and creating data visualization objects:

  • Use FRBSF.org data visualization colors, which are designed to complement the Brand palette.
  • Use approved color combinations optimized for users with Protanopia and Deuteranopia color blindness, and black-and-white printing.
  • Use other approaches besides color (texture, varying shapes) to communicate information in charts.
  • Focus on readability of chart by considering “data-ink ratio.”
  • Keep the non-erasable core of a graphic and remove or de-emphasize unnecessary elements (for example, border around charts).
  • Include copy that explains the visualization (for accessibility purposes).
  • Place the labels close to data lines when possible instead of in a separate legend.
  • Format figure and chart titles and source attributions as text outside of images for accessibility and search optimization.

See examples.