Таблицы или div слои?

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

Таблицы - table

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

Не смотря на то, что с момента появления тега table прошло уже достаточно много времени, он не утратил своей популярности и используется на множестве современных сайтов. Преимущества использования table:

  • Наибольшая поддержка браузерами. В отличие от верстки с использованием div, табличную разметку одинаково воспринимает наибольшее кол-во новых и старых браузеров без дополнительного использования хаков, условных операторов и скриптов на Java Script.
  • Меньшее время создания макета. При условии, что верстальщик хорошо разбирается в различных способах верстки, на создание сложной страницы с таблицами у него уйдет значительно меньше времени, чем при использовании div. Начинающему же разработчику web-страниц разобраться с таблицами будет намного легче, чем со слоями, и что самое главное, переход от идеи к ее реализации будет значительно быстрее.

Существует миф, что верстка таблицами негативно сказывается на рейтинге сайта в поисковых системах, за счет большего количества тегов в теле страницы. На самом деле - это не играет никакого значения, так как вырезать теги из HTML-документа, чтобы проиндексировать контент, роботу поисковой системы не составляет особого труда. А "завалить" код лишними тегами, конструкциями типа style="" можно и при использовании div - было бы желание или отсутствие навыков в разметке.

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

Слои - div

С распространением поддержки новых стандартов во всех популярных браузерах, верстка с использованием тегов div стремительно набирает популярность среди web-мастеров. Преимущества верстки слоями (дивами):

  • Минимальное количество служебной информации в теле web-страницы. Это дает небольшой прирост в скорости загрузки страницы пользователями и немного уменьшает нагрузку на сервер.
  • Более легкий для восприятия человеком код. Профессионалу, зачастую легче разобраться с HTML-кодом написанным с помощью div, чем при использовании таблиц. Из этого вытекает другое преимущество - небольшие изменения структуры HTML страницы можно провести быстрее.

В материале "40 шаблонов сайтов - верстка слоями" предлагается богатый выбор различных шаблонов разметки - будет весьма полезно для новичков, которые только начинают изучение верстки с помощью CSS и div. В этой статье: "Позиционирование с помощью CSS и таблиц" - сравнение различных методов разметки, а по этой ссылке: "Преимущества div в сравнении с table" автор публикации пытается доказать преимущества div-ов, приводя качественные примеры построения HTML-шаблонов с div.

Опубликовано: 2012/05/16
HTML-код ссылки на эту страницу:
<a href="https://petrenco.com/html_css.php?txt=136" target="_blank">Таблицы или div слои?</a>
13536
Комментарии
Дв, еще, на счет скорости ЗАГРУЗКИ - брехня, т к это определяется возможностью модема и тарифом на интернет. Не вводите людей в заблуждение!

А уж про скорость отображения с современными технологиями и мощностью ЭВМ я вообще молчу...
Добавить комментарий
Ваш e-mail: (не виден посетителям сайта)
Ваше имя:
Комментарий:
Символы с картинки:
Только выделенные поля формы добавления комментариев обязательны к заполнению.