Блог > Практика разработки web сайтов > Верстка и CSS > Мифы DIV vs TABLE — личные впечатления

Мифы DIV vs TABLE — личные впечатления

Приветствую!

Настало время рассказать свой опыт сравнения блочной и табличной версток.

Сразу скажу, любой из способов имеет свои преимущества. А также и особенности.

Но какие? Об этом речь и пойдет в статье.

Не буду напоминать Вам прописные истины, DIV vs TABLE.

Обычно сторонники / противники подобных холиваров, приводят достоинства и недостатки табличной и блочной верстки следующего плана:

Табличная верстка:
+ полная кроссбраузерность макета, легкость в освоении;
+ легкое создание нескольких колонок;
+ наглядная и логическая структура колонок;
+ идентичное отображение и на мобильных устройствах;
- услосложненность и запутанность кода;
- трудная индексация поисковиками;
- нелогичность кода;

Блочная верстка:
+ меньше кода, легче манипулировать структурой;
+ СЕО-ориентированность кода, возможность расположить выбранный участок в коде вверху, а визуально в любом месте;
+ соответствие стандартам и логичность кода;
- не всегда корректная кроссбраузерность - особенно в 6 Ослике Ие;
- при нестандартных разрешениях и браузерах может "плыть" и "сбиваться";

Ну это с Вами мы и так знаем)
А теперь мой собственный опыт и впечателния о сравнении блоков с таблицами:
Миф 1. Блочная верстка самая лучшая - неправда, не самая. Есть целый ряд ситуаций когда лучше табличная. А наилучше всего смешанная.
Миф 2. Табличная верстка пережиток прошлого - какой уж там пережиток) Табличные данные вполне необходимо ею выводить, а блоки - контент, структура - блоками.
Миф 3. Верстальщик должен верстать только на блоках. Мда уж) Тогда я не верстальщик а Мери Попинс:)
Верстальщик должен уметь верстать кроссбраузерно, быстро, чисто и чтобы код было легко обслуживать. В первую очередь. В большинстве своих случаев мне смешанной вполне хватало.

И кроме мифов - собственные мысли.
Ну например, я не поклонник таблиц, но и не противник дивов. Все же, поправить поехавшую верстку на блоках гораздо проще через CSS, и не требуется лезть в код шаблона. Это 100% так.
Приходилось сталкиватся и с чужим кодом

<table border="1" cellspacing="0" cellpadding="5" align="right" style="margin-right: 10px">
<tr>
<td valign="top" width="60">Логин:</td>
<td valign="top" width=""><input name="login" type="text" id="login" /></td>
<td valign="top" height="30" valign="top">Пароль:</td>
<td valign="top"><input name="pass" type="password" id="pass" /></td>
<td valign="top"><input id="login_btn" type="submit" name="Submit" value="Вход" /></td>
<td valign="top"><a href="/passremind.html">Забыли пароль?</a></td>
<td valign="top"><a href="/registration">Регистрация</a></td>

</table>

Такие вещи я даже и не собираюсь править. Сразу стираю и делаю заново - дешевле и проще обходится.
Кроме того, DOM-манипуляции с HTML-кодом с блоками гораздо проще выходят. Позиционирование, анимация - все проще делать с блоками. Это я Вам с высоты 3х лет говорю.
Еще. Для блоков есть фреймворки - Blueprint, 960 GS. Для таблиц нет. Это ни хорошо ни плохо) Просто за рубежом уже многие не пользуют Осла ИЕ6:)! И блоки как бы стали стандартом.
А не пользуют ИЕ6 потому что у там парк машин поновее, ОС поновее. А у нас долго не обновляется, в итоге сидят люди за ИЕ6 и страдают бедные верстальщики... удовлетворяя требованиям заказчика.

Итого:
- таблицы живы, жили и буду жить. Но только в комплексе с дивами, и их роль все уменьшается.
- блоки осваивать НАДО. А еще Javascript.
И блинчики печь... и крестиком вышивать... Но это уже другая история)

Размещено в: Верстка и CSS | Прокомментировать

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>