It may be difficult to attribute the following points to a specific source, but here are all of the guidelines I can remember off the top of my head about bar charts vs. line charts, mostly learned from Edward Tufte and Stephen Few. It’s a bit of an art, and how you represent your data depends on what exactly you are intending to find in it, so it’s difficult to write finite rules that dictate what to do. If you want to learn more, check out their books on our Reading page.

Line

• When to use them: Line charts should be used only for time series (chronological) or when there is some other sequence to the dimensions on the x-axis, e.g. dates, months, sequence of stages of a project, sequence of meters along on a gas pipeline, and they should be used to detect trends and patterns, not to give people exact quantitative readings.
• Scale: As line charts are not really intended to give people exact numbers, forcing zero scaling is not necessary and can make it considerably more difficult to detect said trends and patterns.

Bar

• When to use them: Bar charts should be used for comparing specific x-axis values, though they can certainly be used for time series, like line charts. They can also be used to display parts of a whole in favor of pie charts, in which case, the space between the bars should be reduced.
• Orientation: Do not use vertical or diagonal text to label the axis of a bar chart. If the x-axis has longer text descriptions, use horizontal bar chart, so the text can read left-to-right, horizontally (the way we normally read).
• Scale: As the area of bars implies volume, it can be deceptive to use dynamic scaling with bar charts (see: Lie Factor). If the differences between the data points is difficult to distinguish with forced-zero scaling, use symbols/points in favor of bars and use dynamic scaling.

Applies to both

• Dimension order: There should be some logical order to the dimensions on the x-axis. In the case of a line chart, it should follow the chronological, process, or stage order that caused you to select a line chart in the first place. In the case of bar charts, the order should have some rhyme and reason to it: sorted by y-axis value, alphabetical, etc., depending on the content of the chart and what its intended use is, e.g. ranking, distribution.
• Scale labels: If the numbers are already being displayed on the data points, it is redundant to label the axis with numbers, too.
• Axis labels: If you can incorporate the metric names and dimension names into the chart title or legend, do not waste space on axis labels.

Information is Beautiful

I think I would get along well with the creator of the site, David McCandless, who, on his About page, says, “My pet-hate is pie charts. Love pie. Hate pie-charts.”  It’s not surprising that he has written for Wired before - his visualizations look to be very much in the Wired style of infographic.  Here is one I saw featured on Lifehacker that could prove useful:

The Buzz vs The Bulge: Caffeine and calories

According to McCandless’ scatter plot, the most bang for your buck in terms of high caffeine and low calories is iced coffee (lower-right of chart), while the worst is a hot chocolate with whipped cream (upper left of chart).  I’ll also point out that iced coffee, like regular coffee, is cheaper than espresso-based drinks, and most people are actually capable of making it at home, so it seems like an easy choice.

I am no fan of excessively shiny, glassy, or delicious-looking dashboard components or graphs, but that effect can serve a purpose, as explained by the design principle of perceived affordance.

Affordance is more general: “a quality of an object, or an environment, that allows an individual to perform an action”. Don Norman, author of The Design of Everyday Things, elaborates on perceived affordance:

…Because I can click anytime I want, it is wrong to argue whether a graphical object on the screen “affords clicking.” It does. The real question is about the perceived affordance: Does the user perceive that clicking on that location is a meaningful, useful action to perform?

More from Universal Principles of Design, pg. 20:

Images of common physical objects and environments can enhance the usability of a design.  For instance, a drawing of a three-dimensional button on a computer screen leverages our knowledge of the physical characteristics of buttons and, therefore, appears to afford pressing.  The popular “desktop” metaphor used by computer operating systems is based on this idea - images of common items like trash cans and folders leverage our knowledge or how those items function in the real world and, thus, suggest their function in the software environment.

(They’re both buttons.)

In other words, is it obvious from the design of your application what can be clicked and what can’t?  Giving your entire application the same flatness when certain components are intended to be clicked can cause areas of importance to be overlooked by the user.  Similarly, it is misleading to make pie and bar charts look like lollipops and old-fashioned stick candy when they are not interactive.

I don’t know how much weight I would give this - because it’s subjective - but another design principle that could be relevant is the aesthetic-usability effect.

Advances in our understanding of emotion and affect have implications for the science of design. Affect changes the operating parameters of cognition: positive affect enhances creative, breadth-first thinking whereas negative affect focuses cognition, enhancing depth-first processing and minimizing distractions. Therefore, it is essential that products designed for use under stress follow good human-centered design, for stress makes people less able to cope with difficulties and less flexible in their approach to problem solving. Positive affect makes people more tolerant of minor difficulties and more flexible and creative in finding solutions. Products designed for more relaxed, pleasant occasions can enhance their usability through pleasant, aesthetic design. Aesthetics matter: attractive things work better.

Frankly, I don’t find these kinds of things attractive.

Periodic Table of Typefaces

To begin, according to Wikipedia:

In typography, serifs are semi-structural details on the ends of some of the strokes that make up letters and symbols.  A typeface that has serifs is called a serif typeface (or seriffed typeface).  A typeface without serifs is called sans-serif, from the French sans, meaning “without”.  Some typography sources refer to sans-serif typefaces as “grotesque” (in German “grotesk”) or “Gothic”, and serif types as “Roman.”

Tufte, on page 183 of The Quantitative Display of Visual Information, quotes Josef Albers’ Interaction of Color:

The concept that “the simpler form of a letter the simpler its reading” was an obsession of beginning constructivism.  It became something like a dogma, and is still followed by “modernistic” typographers….Ophthalmology has disclosed that the more the letters are differentiated from each other, the easier is the reading.  Without going into comparisons and details, it should be realized that words consisting of only capital letters present the most difficult reading - because of their equal height, equal volume, and, with most, their equal width.  When comparing serif letters with sans-serif, the latter provide an uneasy reading.  The fashionable preference for sans-serif in text shows neither historical nor practical competence.

Ryan Newman, of the Interactive Visualization blog, says:

In choosing typefaces for dashboards, you will always want to use San-Serif fonts, that is fonts without the serif accents.  Arial and Verdana are san-serif fonts, and enable an end user to read text on the computer screen much easier than serif fonts (example: times roman).  Serif fonts are best applied in large bodies of printed text for readability.  There is no value in using multiple fonts in a dashboard, so pick 1 san-serif font that works well for you.

If Information Dashboard Design is any indication of Stephen Few’s opinion, he agrees with Ryan Newman.  The text of the book appears to be in a serif font (except the headers and chapter titles), while every chart and dashboard example he created features a sans-serif font.  Tufte, by the way, seems to publish the text of his books in serif, while his visualizations can be either type of font.

Stephen Few

Garr Reynolds, a design and presentation expert, on the other hand, published Presentation Zen: Simple Ideas on Presentation Design and Delivery entirely in sans-serif.  In fairness, sans-serif fonts are simpler, which is in the title of the book.

The U.S. State Department has banned Courier 12 in favor of Times New Roman 14 (both serif), except in the cases of telegrams, treaties, and documents drawn up for the President’s signature, because “[Times New Roman 14] takes up almost exactly the same area on the page as Courier New 12, while offering a crisper, cleaner, more modern look”.

Personally, I tend towards serif - especially Times New Roman - for most text and sans-serif - especially Arial - for visualizations in my own work, but I do like to pepper it with Comic Sans or Wingdings, just to jazz things up (kidding).  There are no definite conclusions to be drawn, really.  Draw your own based on trying to read what you created whilst squinting.