table vs div+scc

[still swamp]

Потратил день, сверстал страницу div+css.

{top page}

{left}{body}

{bottom page}

Ужаснулся замысловатости глюков на разных браузерах. Переделал с position:absolute на float:left. Поразился громоздкости кода.

Потратил полчаса все убрал и передела на таблицу.

Вид тот же. Глюков нет. Все изящно.

Хочу узнать, что за дань моде заставляет говорить про некошерность верстки таблицами?

[psywalker]

Хочу узнать, что за дань моде заставляет говорить про некошерность верстки таблицами?

А ты правда наивно полагаешь, что если человек, который ничерта не разбирается в вёрстке, попробовал сверстать на слоях, обломался из-за того, что нихрена не понимает в этом, сверстал на таблицах, у него это получилось и из всего этого он сделал вывод, что таблицы лучше, значит это и правда так?

p.s. В следующий раз, перед тем как создавать подобные темы, хотя бы прочитай, как правильно писать аббревиатуру "css" :)

[still swamp]

Ну нет, почему же. У меня как раз получилось. Вроде даже работало, с областями выводимыми на разные устройства. Если бы не получилось, я бы просил помощи.

Вопрос то в другом. Назовите причину (кроме модной тенденции) заменять табличную верстку слоями.

Если причина будет достаточно внятная - буду благодарен.

Тему я могу создавать в силу технической возможности и заинтересованности. Так что...

Что касается scc -> css... я по запарке могу нарисовать прекрасную карту Америки, куда умудрюсь вклинить Японию... бывает.

Edited December 29, 2010 by still swamp

[psywalker]

Ну нет, почему же. У меня как раз получилось. Вроде даже работало, с областями выводимыми на разные устройства. Если бы не получилось, я бы просил помощи.

Вопрос то в другом. Назовите причину (кроме модной тенденции) заменять табличную верстку слоями.

Если причина будет достаточно внятная - буду благодарен.

Тему я могу создавать в силу технической возможности и заинтересованности. Так что...

Причин на самом деле масса, тут дело в другом. Просто если бы ты занимался чисто вёрсткой, каждый день имел бы дело с CSS, то ты бы понял разницу между таблицами и слоями. У слоёв много преимуществ перед таблицами, главное это то, в каких руках они находятся и как ты с ними обращаешься. Перечислять я принципиально не буду, потому что во-первых этих перечислений полон инет, а во-вторых это будет 1001-й холивар.

Да, и кстати я не имею ввиду, что таблицы говно, а слои лучше, и у таблиц бывают свои плюсы, всегда надо смотреть на ситуацию.

[still swamp]

Ну нет. Я не собираюсь на холивар.

Мне нужны конкретные причины делать так или эдак, потому что как показывает практика, нарушая некоторые правила можно через полгодика обнаружить крупные системные проблемы.

Я создал тему с целью вполне определенной - услышать на какие грабли я наступить могу. Из поисковиков я понял только то что таблицы - это не круто. Но почему бы не спросить?. Где то так.

[psywalker]

Я создал тему с целью вполне определенной - услышать на какие грабли я наступить могу. Из поисковиков я понял только то что таблицы - это не круто. Но почему бы не спросить?. Где то так.

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

[still swamp]

Благодарствую.

Это все та же система помощи, которую решил привести в порядок, из за того что навигацию обхаили.

Таблицы. http://catlair.net/index.asp?UIDMenu=280&a...IDSiteStyle=805

[psywalker]

Да можно было бы и на слоях смастерить, там же один сплошной поток. Две колонки, в левой меню, в правой делай чё хошь)

[still swamp]

Можно можно... только в чем рулез будет?

[arez]

только в чем рулез будет?

В семантической структуре документа и его доступности

[psywalker]

Можно можно... только в чем рулез будет?

Потом легче будет перестраивать вёрстку, если что. А вообще пример не очень хороший. Возможно да, тут даже лучше и таблицей сделать, так как на слоях будет заморочка с абсолютами, бордерами и т.д.

[still swamp]

В семантической структуре документа и его доступности

С точки зрения структуры таблица не уступает, и является одним из устоявшихся объектов. Да, она не атомарна, но и слои в данном случае не выходит сделать таковыми.

Что касается доступности. Доступности для кого? Верстальщика, поисковика, браузера?

Есть ли значительные технические последствия использования таблиц? Отказ от поддержки в будущем, тормознутость, ограниченность раскраса?

[psywalker]

Есть ли значительные технические последствия использования таблиц? Отказ от поддержки в будущем, тормознутость, ограниченность раскраса?

Да, в твоём случае у таблиц минус, то что они например будут отрисовываться медленнее, чем слои. Отказ от поддержки врядли, так как это твоё личное дело, на чём верстать сайт и я например не слышал ещё про то, что таблицы скоро отменят.

Но в твоём случае всё-же да, таблицы лучше я считаю.

[Scrum]

Да, в твоём случае у таблиц минус, то что они например будут отрисовываться медленнее.

не медленнее, а до тех пор пока содержимое полностью не подгрузиться в отличии от слоев которые отрисовываются по мере подгрузки.

[arez]

С точки зрения структуры таблица не уступает, и является одним из устоявшихся объектов. Да, она не атомарна, но и слои в данном случае не выходит сделать таковыми.

Вы о чем?

Что касается доступности. Доступности для кого? Верстальщика, поисковика, браузера?

Для всех посетителей http://www.w3.org/TR/WCAG20/

[still swamp]

Потом легче будет перестраивать вёрстку, если что. А вообще пример не очень хороший. Возможно да, тут даже лучше и таблицей сделать, так как на слоях будет заморочка с абсолютами, бордерами и т.д.

Так и есть. Я на бордеры наступил.

<div style="float:left; width:20%; border 1px solid black;">
</div>
<div style="float:right; width:80%; border 1px solid black;">
</div>

Разъезжватеся. Приходится вложенные еще слоя делать и бордеры лепить туда.

<div style="float:left; width:20%;">
 <div style="border 1px solid black;">
 </div>
</div>
<div style="float:right; width:80%;">
 <div style="border 1px solid black;">
 </div>
</div>

С боттомом шаманство. Ну и так далее.

не медленнее, а до тех пор пока содержимое полностью не подгрузиться в отличии от слоев которые отрисовываются по мере подгрузки.

Ага, это уже кое что. Но в слое в любом случае есть свои div. Те некая иерархия лежащая за рамками основного шаблона.

Для всех посетителей http://www.w3.org/TR/WCAG20/

Ссылка в данный момент полностью бессмысленна так как содержит подавляющее большинство информации не относящейся к теме обсуждения. С таким же успехом можно было дать ссылку http://google.com.

Edited December 29, 2010 by still swamp

[psywalker]

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

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

[arez]

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

А какие там могут быть заморочки? Что сложного в этом примере?

Ссылка в данный момент полностью бессмысленна так как содержит подавляющее большинство информации не относящейся к теме обсуждения.

Это первое что быстро пришло в голову для того что бы объяснить что такое доступность, линковать на книги очень трудно

[psywalker]

А какие там могут быть заморочки? Что сложного в этом примере?

1. Колонки одинаковой высоты.

2. Бордеры вокруг сайта.

[still swamp]

1. Колонки одинаковой высоты.

2. Бордеры вокруг сайта.

Добавлю, боттом пришитый снизу и картинка кота, которая лежит и под боттомом и под правой колонкой.

[deadrash]

1. Колонки одинаковой высоты.

2. Бордеры вокруг сайта.

А чем не подходит?

<div>
  <ul>
	<li>элемент списка</li>
	<li>элемент списка</li>
  </ul>
  <p>Всё что справа</p>
</div>

<div><p>подвал</p></div>

Остальное в CSS

Edited December 29, 2010 by deadrash

[psywalker]

А чем не подходит?

<div>
  <ul>
	<li>элемент списка</li>
	<li>элемент списка</li>
  </ul>
  <p>Всё что справа</p>
</div>

<div><p>подвал</p></div>

Остальное в CSS

Да? А CSS продемонстрируй нам.

[deadrash]

Да? А CSS продемонстрируй нам.

ul {display:block;
width:300px;
float:left;
border-right:1px solid #000;}

футеру border-top:1px solid #000;

На скорую руку.

p.s. с контейнеру верхнему и футеру тоже флоат.

Edited December 29, 2010 by deadrash

[still swamp]

А чем не подходит?

<div>
  <ul>
	<li>элемент списка</li>
	<li>элемент списка</li>
  </ul>
  <p>Всё что справа</p>
</div>

<div><p>подвал</p></div>

Остальное в CSS

Хочу глянуть на подвал внизу, в случае когда левая и правая колонка менее 100%.

[psywalker]

ul {display:block;
width:300px;
float:left;
border-right:1px solid #000;}

футеру border-top:1px solid #000;

На скорую руку.

Полнейшая чушь)))

Хочу глянуть на подвал внизу, в случае когда левая и правая колонка менее 100%.

+1

[deadrash]

Подвал приклеить тоже не проблема, гугл вам подскажет как это сделать)

Я хотел только показать только контент, хотя да, css будет мудрёный.