Exemplics LLC

I’ve written XSLT and CSS style sheets which transforms the backup procedure XML results to HTML. The generated HTML page displays the:

• steps of the procedure: their result code, name and elapsed time (along with any error text)
• server items archived and their file sizes
• server directories and associated free space
• archive files created and their file sizes
• archive directories and associated free space

My goal when creating this transform was to make it easier to understand the backup procedure results. To achieve this goal, I’ve tried to follow the principles described by Edward Tufte in his books The Visual Display of Quantitative Information , Envisioning Information, Visual Explanations and Beautiful Evidence.

The tabular information displayed is organized in topical paragraphs as delimited by the section labels, column headings and horizontal rules. The data-ink ratio and data density are maximized allowing (in most cases) all the information to be viewed without scrolling. Visual parallelism is enhanced by placement of error text just below the step where the error occurred, server directory free space just below server item sizes and archive directory free space just below archive items sizes. Numeric columns are right aligned and rendered with a monospace font. They are multifunctioning serving as both data values and data measures (like the bars on a bar chart).

I’ve avoided chartjunk and excessive grids which hinder comprehension. Thin gray lines are used for rules and these are used sparingly. An implicit grid is formed by the typography. Color is used sparingly to differentiate between normal results and those where an error occurred.

This is what the backup results look like when no error has occurred.

This is what the backup results look like when an error has occurred.