Верстка таблицами или слоями?

Рейтинг: 2Ответов: 2Опубликовано: 21.03.2011

Вопрос на засыпку. Скажите, какой способ разметки страниц на HTML лучше?

Таблицами?

<table border="1" width="150">
<tr>
    <td colspan="2" align="center">Шапка</td>
</tr>
<tr>
    <td width="50">Меню<br>Меню<br>Меню<br></td>
    <td>Информация...</td>
</tr>
</table>

Или же способ верстки слоями?

<div class=1>Шапка</div>
<div class=2>Меню</div>
<div class=2>Меню</div>
<div class=2>Меню</div>
<div class=3>Информация</div>

С применением соответствующих таблиц стилей.

Назовите плюсы и минусы первого и второго способа

html вёрстка
Источник: Stack Overflow на русском

Ответы

▲ 6Принят

Это жесткий вопрос вида: "Что лучше: Windows или Linux?".

У таблиц HTML целевое назначение - это разметка собственно таблиц (курсы валют, расписание самолетов и поездов, турнирная статистика и т.п.), а у элементов div - разметка блоков (div - от слова division, разделение). Но если по каким-то причинам удобнее использовать одно вместо другого это вполне допустимо.

Вообще нужно стремиться к соответствию между тэгами и содержимым тэгов: заголовки - в h, параграфы - в p, списки - в ul, таблицы - table и т.п.

▲ 3

Все, что здесь описали, без сомнения, имеет место быть, но:

  1. Блочная верстка (или верстка div'ами) часто используется большими проектами не потому что это модно, а потому что рендер страницы идет на порядок быстрее.
  2. Табличная верстка используется для предоставления статистических данных, а не как элемент контейнера.

Естественно, блочную и табличную верстку можно совмещать, такой тип называется смешанным. В чем же выигрывает верстка дивами? Представьте, что у вас, скажем, новостной портал, где выведено 100 последних новостей в колонку:

Верстка таблицей в данном случае сильно тормозит работу браузера, потому что ни один браузер не выведет таблицу ДО ее полной загрузки т.е. от table до /table. Если же верстка была бы на дивах, то загрузка документа и его рендеринг осуществлялись бы "параллельно" - элемент за элементом.

Что именно использовать Вам - решать только Вам. Но эти плюсы и минусы - это главное отличие.