табличный дизайн

глава сортировка и группировка, победившая в голосовании, открыта для всех на месяц.

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

не лишним будет обратить внимание на дизайнерскую сторону картинки: даны не просто типы ступней, а ещё к ним добавлены линии, упрощающие рисунок до самого главного отличия этого типа.

см. также на девушек в стадии овуляции

Channel name was changed to «Табличный дизайн»

табличный дизайн pinned «в нашем табличном курсе для всех открыта первая глава — табличное представление.

какую главу ещё открыть? опрос до конца недели, победившую главу откроем для всех на месяц.»

две картинки на тему давления в позвоночнике в зависимости от позы человека и его отягощения.

фактически весь график работает на двух элементах: пиктограмме и длине столбика, и это очень наглядно.

первая картинка красивее, но корректные данные от тех же исследователей — во второй картинке.

отдельно можно сравнить сортировку: в первой картинке сортировка на основе позы (стоя, сидя), во второй — на основе давления.

см. также вес головы в зависимости от наклона:
https://t.me/thisisnotatable/228

рубрика #кусочеккурса

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

в фигме, например, это делается в настройке шрифта:
type settings → details → numbers → style.

в css табличные цифры задаются с помощью свойства:
font-variant-numeric: tabular-nums;

курс «таблицы и прочие радости», глава «шрифт»: igorshtang.ru/course/tables

пост сдал, пост принял. теперь ваша очередь.

на картинке — состояние человека до и после 15-дневного голодания на воде.
как бы вы улучшили эту картинку? показывайте свой вариант, текстом не пишите — так все могут.

салават снова прислал интересную табличку, даже три:

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

и я полностью согласен с ним. дизайнерские паттерны — это вообще очень здорово: человек научился чему-то в одном месте, а в другом использует знание на автомате, не задумываясь. удобно!

но когда тебя чему-то научили, а рядом вроде такое же, а устроено по-другому, то сразу зависаешь и хочется спросить: вы меня зачем учили, если сами этими знаниями не пользуетесь?

если формат не подходит, то лучше вместо него использовать другой, а не какой-то похожий.

в общем, можно смело дублировать тут цены, а группировка похожего далеко не всегда упрощает восприятие.

а ещё можно можно разбивать большие блоки на блоки поменьше.

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

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

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

такие перевёрстки напоминают волшебные рассказы. сравните предыдущую цитату вот с этой:

Harry bent down, ducked under the tent flap, and felt his jaw drop. He had walked into what looked like an old-fashioned, three room flat, complete with bathroom and kitchen.

нам часто пишут хорошие отзывы о курсе по таблицам, а мы почему-то скромничаем и не рассказываем об этом.
так что добавили несколько новых.

если задумываетесь о прохождении, почитайте, что говорят те, кто уже прошёл:
https://www.igorshtang.ru/course/tables/#reviews

а тем, кто пишет отзывы (не только нам, а вообще) — большое спасибо, это важно.