Практика бизнес-анализа для BI-систем

Плохие таблицы. Почему они получаются?
Будучи основой Интернета на протяжении больше части его юношеской истории, таблицы были отброшены многими дизайнерами, использующими более новые и модные макеты. Но появляясь все реже на просторах Интернета, таблицы данных все еще собирают и упорядочивают большую часть информации, с которой мы взаимодействуем каждый день.
Например, есть то, что я считаю матерью всех таблиц: «Гармонизированный тарифный план» Соединенных Штатов, таблица, которая охватывает более 3550 страниц и перечисляет все товары, которые могут быть импортированы в США, включая такие записи, как «Мужские пальто или пальто для мальчиков, полупальто, накидки, плащи, анораки (включая лыжные куртки), ветровки и аналогичные изделия (в том числе мягкие, без рукавов)».
Ярость, вызванная таблицами данных, несомненно, обусловлена тем, насколько ужасно они выглядят, когда они плохо разработаны. Конструкция таблицы — это ее краеугольный камень: если все сделано правильно, это упрощает поиск и сравнение сложных данных. Если это будет сделано неправильно, это может сделать информацию совершенно непонятной.

Знай свои цифры

Не все числа были созданы равными. Я не говорю о π и ∞; Я говорю о числах, которые являются табличными или старостильными (tabular/oldstyle), выровненными или пропорциональными (lining/proportional).
Вот краткий пример различия между стилем oldstyle и lining.

Старостильные цифры выглядят красиво в предложениях, где они лучше соответствуют размеру и интервалу строчных букв, lining более однородны и подходят сетчатой структуре таблицы.
Разница между tabular и propotional не столь очевидна:

Пропорциональные (propotional) цифры предназначены для соответствия цвету — то есть общей калибровке и интервалу шрифта. Табличные (tabular) цифры, с другой стороны, все одинакового размера, так что столбцы чисел выстраиваются правильно. Хотя разница может показаться незначительной в масштабе одной или двух строк, использование tabular позволяет значительно упростить сканирование больших таблиц и снизить вероятность ошибок.

Техническое примечание в использовании tabular

При проектировании вам нужно будет немного поработать, чтобы цифры, которые вы используете, были правильными (tabular обычно не используется по умолчанию). В продуктах Adobe есть панель «opentype», которая может использоваться для правильной установки цифр, а CSS предоставляет слегка критический синтаксис для включения этой функции. Помимо этого, простой поиск в Google поведёт вас по правильному пути.
Но теперь плохие новости: не все шрифты имеют табличное выравнивание tabular. Как правило, те, что имеют, очень дороги. Есть несколько исключений: отличный Work Sans — бесплатный шрифт с табличным выравниванием.
Если вы не можете найти подходящий шрифт, который имеет табличное выравнивание, хорошим отступлением будут моноширинные шрифты – пока они имеют более «исходный код», они всегда будут хорошо подходить для отображения чисел в таблицах. Кроме того, новый шрифт Apple по умолчанию (San Francisco) имеет отличное табличное выравнивание и отлично подходит для небольших размеров.

Вопросы выравнивания

Следуйте этим 3.5 правилам выравнивания:
1. Численные данные выравниваются по правому краю;
2. Текстовые данные выравниваются по левому краю;
3. Заголовки выравниваются так же, как и последующие за ними данные;
3.5 Не используйте выравнивание по центру.

Числовые данные читаются справа налево; то есть мы сравниваем числа, сначала рассматривая их единицы, затем десятки, затем сотни и т. д. Это также, как большинство людей учатся арифметике — начинайте справа и двигайтесь влево, перенося цифры. Таким образом, таблицы должны хранить числовые данные с выравниванием по правому краю.
Текстовые данные читаются слева направо. Сравнение текстовых элементов обычно выполняется путем сортировки в алфавитном порядке: если две записи начинаются с одной буквы, используется вторая буква и т. д. Попытка быстро просмотреть текст может привести в бешенство, если он не выровнен по левому краю.
Заголовки, как правило, должны выравниваться, как и их данные. Это обеспечивает чистоту вертикальных строк таблицы, а также обеспечивает согласованность и контекст.
Выравнивание по центру приводит к тому, что строки таблицы становятся «оборванными», что значительно усложняет поиск записей, часто требуя дополнительных разделителей и графических элементов.

Согласованные цифры после запятой= лучшее выравнивание

Один простой способ корректного выравнивания таблиц состоит в том, чтобы в каждом столбце было одинаковое количество цифр после десятичной запятой. Цифры после запятой — это целая кроличья нора в теме, поэтому я буду кратко излагать здесь свой совет: чем меньше вы рискуете, тем лучше.

Меньше и чище надписи

Предоставление надписей для сопровождения ваших данных имеет решающее значение. Эти части сопровождающего контекста позволяют прочитать таблицу данных более широкой аудитории в более широком круге обстоятельств.

Название

Это может звучать как обычная мудрость, но придание вашей таблице данных четкого и лаконичного названия также важно, как и любое другое дизайнерское решение, которое вы принимаете. При хорошем заголовке таблицы мобильны: их можно использовать в различных контекстах, а также ссылаться на внешние источники.

Единицы измерения

Наиболее общей меткой в таблице являются единицы измерения, они повторяются вместе с каждой ячейкой данных. Вместо повторения метки, просто включите её в первую запись каждого столбца.

Заголовки

Создавайте заголовки как можно короче; дизайн таблицы данных должен быть сфокусирован на самих данных, а длинные заголовки могут занимать много визуального пространства.

Как можно меньше чернил

При принятии решения о стиле графических элементов таблицы, цель всегда должна заключаться в уменьшении площади таблицы без потери структурной точности. Один из способов достичь этого — использовать как можно меньше «чернил», то есть, по возможности, не стилизовать элемент.

Линейки

Если вы верно выровняли ячейки в таблице, линейки становятся излишними. Основное преимущество, которое они предоставляют, заключается в том, что вы можете уменьшить пространство между элементами, но все же сможете различать элементы. Даже при использовании линейки должны быть очень легкими, чтобы не мешать быстрому просмотру.
Горизонтальные линейки являются наиболее полезными, так как они позволяют значительно уменьшить вертикальное пространство, занимаемое длинными таблицами, ускоряя работу по сопоставлению большого количества значений или наблюдению тенденций с течением времени.
Одно необоснованное мое мнение о линейках в том, что стилизация под зебру плохая. Действительно, очень плохо. Либо да, либо нет.

Фоны

Фоны наиболее полезны при указании различий в области данных: например, переключение между одиночными значениями и суммами или средними значениями.
Выделение значений, предоставление дополнительного контекста для данных или указание изменений в значениях из предыдущих периодов могут быть выполнены без фона, используя такие графические элементы, как ✻, † (один из моих любимых) или ▵.
Кроме того, таблицы должны быть монохроматическими. Использование цветов для обеспечения организационного контекста или добавленного значения увеличивает вероятность неправильного толкования или ошибки и приводит к проблемам с юзабилити для людей с нарушенным зрением.

В заключение

Таблицы могут быть скучными. Но они являются таким важным элементом любого богатого данными документа, что они стоят каждой унции дизайнерского мышления, которую мы можем применить к ним. Разрабатывая более эффективные, более четкие и простые в использовании таблицы, вы можете значительно улучшить часто болезненный опыт анализа и понимания больших наборов данных.

Найти решение у бизнес-партнера QlikTech (QlikView) в России.

Форум разработчиков QlikView и Qlik Sense. Получите ответы на все вопросы по QlikView и Qlik Sense!