Школа
Веб-разработка

Расскажите о современных способах и тонкостях вёрстки таблиц

Сам я верстал ещё тэйблами под IE 5.5, а нынешние разработчики «рисуют» таблицы кучей скриптов, часто не могут правильно рассчитать ширину колонки в зависимости от контента. А то и вовсе отказываются воплощать в жизнь элементарные, на мой взгляд, вещи.

Артемий Виноградов
11 мая 2023
👁 3114  
Веб-разработка

Расскажите о современных способах и тонкостях вёрстки таблиц

Сам я верстал ещё тэйблами под IE 5.5, а нынешние разработчики «рисуют» таблицы кучей скриптов, часто не могут правильно рассчитать ширину колонки в зависимости от контента. А то и вовсе отказываются воплощать в жизнь элементарные, на мой взгляд, вещи.

Артемий Виноградов
11 мая 2023
👁 3114  
Василий Половнёв
Технический директор бюро
Полезно
 9
9
Непонятно
  
Войдите в Бюросферу, чтобы голосовать

Артемий!

Со времён IE 5.5 таблицы изменились мало. Именно в этой версии появилась поддержка новых табличных элементов: colgroup и col для группировки ячеек и их удобной стилизации; caption, thead, tbody и tfoot для доступности. Если пропустили, взгляните на них в МДН и спецификации ХТМЛ:

Самым серьёзным изменением стало появление мобильных устройств: таблицы как‑то нужно адаптировать к узким экранам. Чаще всего это делают с помощью транспонирования или горизонтальной прокрутки:

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

P. S. Таблицы и условные комментарии до сих пор используют в вёрстке писем: почтовые клиенты толком не поддерживают флексбоксы и гриды, а старые версии Аутлука не поддерживают даже дивы.

P. P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.

Веб‑разработка
Полезно
 9
9
Непонятно
  
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментариев пока нет

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы