Оформление таблиц

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

Типичным примером шума является сетка таблицы. Если обводить таблицу от души, то получится, например, так:

Температура плавления смеси указана для избытка льда.

Получилось, что ради 9 значений в таблице нарисовано 10 линий, у которых, при этом, 21 пересечение. Очевидно, что это никак не способствует удобному чтению таблицы.

Упростим. Уберём вертикальные линии — окажется, что читать таблицу по горизонтали стало намного проще:

Что изменили:

• Убрали вертикальные линии;
• Выровняли числовые значения по правому краю (тупой способ);
• Поставили минусы вместо дефисов;
• Оттипографили боковик.

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

Что изменили:

• Убрали горизонтальные линии;
• Выровняли числовые значения относительно запятой, по центру (правильный способ);
• Подобрали ширину ячеек в соответствии с объемом содержимого.

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

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