Как верстать сложные таблицы для мобильного экрана

Переснял лекцию о таблицах для школ бюро. О чём речь:

Часто хватает трёх правил, чтобы сверстать компактную и читаемую таблицу:

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

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

В конце — магия: Илья адаптирует таблицу из тринадцати колонок к экрану мобильного телефона без потери читаемости.

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

Это фрагмент одной из 35 лекций по дисциплине «Интерфейс и информация» в Школах бюро. Программа школы и как поступить

Также эти лекции доступны слушателям моего онлайн-курса «Пользовательский интерфейс и представление информации», на который до 10 ноября открыта запись (начнётся 16 ноября).