DIVs против TABLEs опровержение пожалуйста

Есть много людей, которые спрашивают: "Почему бы нам не использовать таблицы для структурирования нашего HTML", и, когда приходит много ответов, я редко вижу, что кто-то преобразуется в мир семантики. Тем не менее, я еще не вижу убедительных опровержений, чтобы поддержать обоснование того, почему мы должны (или могли) использовать таблицы.

Кто-нибудь может обосновать, когда таблицы являются действительной структурной разметкой?


7 ноября 2008 г.

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

Из-за разочарования, прочитавшего аргументы "таблицы проще" один раз, слишком много раз после вопроса "DIVs vs. TABLEs", я хотел бы разоблачить вопрос еще немного и не позволить любителям таблицы легко отпустить крючок.

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

Кто-нибудь использует Мамбо в тот же день? Кто-нибудь должен был принять bash при создании дизайна в верхней части Microsoft Sharepoint? Чтобы сразиться со всей этой вложенной столовой дерьмом, был ад, и, учитывая, что это было написано некоторыми кровавыми хорошими кодорами, он раздражает меня. Разумная семантическая разметка существует достаточно долго, поэтому разработчики не должны по-прежнему отстаивать "таблицы проще". Таблицы не легче - они ленивы!

Мой вопрос заслужил отрицательную репутацию за негативный образ, в котором он был представлен, но я все еще жду, когда люди согласятся с тем, что единственная причина, по которой они используют таблицы, состоит в том, что ОНИ НЕ ЗНАЮТ HTML. Потому что, если они это сделают, тогда они поймут, как говорит jjrv, что таблицы предназначены для табличных данных.

Ответ 1

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

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

Ответ 2

RE: Почему таблицы?

Потому что некоторые люди (все еще, после всех этих лет) боятся перемен. Они слышали, что использование семантического HTML - это хорошо (и обычно не понимает концепцию). Поэтому они пытаются скомпоновать макет с использованием CSS, который никогда не делал этого раньше. Они сталкиваются с несколькими (хорошо документированными и обычно легко решаемыми) проблемами, поднимают руки и возвращаются к столам.

Затем они решают, что CSS "слишком трудоемкий" ( "Я не хочу тратить время на его изучение" ) или "не практично" ( "Я не понимаю, это слишком сложно" ) и что таблицы являются единственным истинным способом. Благодаря упрямству и невежеству они верят своим собственным тельцам и убеждают своих клиентов и сверстников.

И их мир остается счастливым и неизменным, уходящим в прошлое и глубже в устаревание *

И это "почему таблицы". Конец.

(* кроме того, что они хорошо подходят для кодирования HTML-сообщений электронной почты)

Ответ 3

Таблицы предназначены для разработчиков, которые не могут беспокоиться о том, чтобы часами работать с CSS, чтобы получить два соседних столбчатых divs для расширения до 100% высоты и ширины независимо от содержимого, а затем заставить хак работать во всех браузерах без добавления дополнительных div, а затем, наконец, в абсолютном разочаровании они прибегают к 5-секундному исправлению:

<table width="100%">
<tr><td valign="top">Left nav</td><td valign="top">Main content</td></tr>
</table>

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

У разработчиков есть бюджет и временные ограничения, а "хороший" CSS и разметка требуют времени.

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

HTML5 должен принести нам все здравомыслящие действия с новыми заголовками, нижними колонтитулами, разделами, навигационными и сторонними тегами. Пример, взятый из Nettuts +:

<div id="content">
    <div id="mainContent">
        <section>
            <!-- Blog post -->
        </section>
        <section id="comments">
            <!-- Comments -->
        </section>
        <form>
            <!-- Comment form -->
        </form>
    </div>
    <aside>
        <!-- Sidebar -->
    </aside>
</div>

а затем это для CSS:

#content {
    display: table;
}

    #mainContent {
        display: table-cell;
        width: 620px;
        padding-right: 22px;
    }

    aside {
        display: table-cell;
        width: 300px;
    }

Те из вас, у кого есть острый глаз, будут любить чувство иронии, когда вы заметите, что CSS обладает свойствами: display: table; и display: table-cell;.

Столы возвращаются ребенку! Снег через заднюю дверь HTML5; -)

Ответ 4

Использование современной семантической разметки намного проще, когда вы добавляете функции или исправляете ошибки или изменяете внешний вид веб-сайта, управляемого данными. Добавление функций AJAX или любых интерактивных скриптов будет намного лучше работать с DIV и CSS, чем с TABLE.

Перемещение в менеджер контента, такой как Drupal, Joomla, WordPress и т.п., будет намного проще, если вы уже организованы с семантической разметкой.

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

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

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

Ответ 5

Макеты на основе DIV страдают от ограничений. Без таблиц по существу невозможно реализовать макет из двух столбцов, который правильно растет в зависимости от высоты содержимого.

Ответ 6

Интересная заметка связана с очень сложными приложениями JavaScript. Если вы выделите Gmail или Календарь Google с помощью Firebug, вы увидите, что таблицы широко используются даже для макета. Конечно, они обычно динамически генерируются, но это показывает, что в редких случаях очень очень визуально сложные интерактивные пользовательские интерфейсы чрезвычайно сложно построить, используя только DIVs.

Ответ 7

Таблицы поддерживаются даже в жестких старых браузерах HTML v1.0. Если ваш целевой рынок включает людей, использующих встроенные браузеры в мобильных телефонах с 1990-х годов, это может быть хорошей причиной для работы с таблицами.

Множество существующих автоматически сгенерированных HTML использует таблицы. Если вашему коду необходимо взаимодействовать с этими таблицами или включать их, было бы лучше пойти на согласованность.

Ответ 8

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

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

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

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

Ответ 9

Использовать таблицы для наименьшего общего знаменателя html или для табличных данных, где имеет смысл охватывать столбцы или строки. В противном случае css-макеты намного менее подробны и намного проще поддерживать, как только вы их повесьте.