Хорошо ли использовать таблицы в HTML 5?

Мне нужно отображать записи и связанные данные в сетке по столбцам и, конечно же, требовать table для тех, кто выравнивает div в одной строке, а использование float - вещь отнимающая много времени!

Будем благодарны за ваши отзывы о том, что нужно делать, а что нет в HTML5!

Ответ 1

Простое правило - используйте таблицы для табличных данных, используйте другие элементы для представления (разработка макетов с использованием CSS), такие как div, section, aside, nav т.д. что дает смысл содержанию, которое они держат, а не использовать table для всего

Дело в том, что разработчики использовали таблицы в 90-х годах для составления своих макетов, но теперь новая спецификация CSS3 поразительна, она дает вам большую свободу при разработке макетов, таких как Flex Box, количество column-count, поведение блочной модели можно изменить с помощью свойство box-sizing дизайн становится все лучше и лучше с помощью запросов @media, grid и т.д., чего нельзя достичь с помощью элемента table... и, следовательно, table используется только для хранения табличных данных.

Я видел, что у многих разработчиков сложилось впечатление, что table следует полностью игнорировать, и вместо этого они используют множество div с 100 строками CSS, применяя display: table; свойства table-row table-cell просто, чтобы получить единственную таблицу прямо.

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


Из W3 Org: (v4.01)

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


От (HTML 5)

Таблицы не должны использоваться в качестве вспомогательных средств. Исторически сложилось так, что многие веб-авторы используют таблицы в HTML как способ управления макетом своей страницы, что затрудняет извлечение табличных данных из таких документов. В частности, пользователям инструментов специальных возможностей, таких как программы чтения с экрана, вероятно, будет очень трудно перемещаться по страницам с таблицами, используемыми для разметки. Если таблица должна использоваться для разметки, она должна быть помечена атрибутом role="presentation" для того, чтобы пользовательский агент правильно представлял таблицу вспомогательной технологии и правильно передавал намерения автора инструментам, которые хотят извлечь табличную информацию. данные из документа.

Существует множество альтернатив использованию таблиц HTML для разметки, в первую очередь, с использованием позиционирования CSS и модели таблиц CSS. [CSS]

Ответ 2

Согласно спецификациям, <table> представляет данные с более чем одним измерением и "не может использоваться в качестве средств макета".

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