[dmitryst]

Vlad Drakula То есть что, делать 2-3 варианта страницы? А сколько потом возни с переделыванием... неее, я делаю одну верстку, по возможности, универсальную, а фишечки можно через Java реализовать, ИМХО

[Vlad Drakula]

dmitryst

а фишечки можно через Java реализовать

1) не через Java а через JavaScript
2) для каждого броузера нужно будет писать свой JS...

То есть что, делать 2-3 варианта страницы?

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

по возможности, универсальную

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

многих эти проблеммы вообще не каснутся... веть не все верстают AJAX клиентов... в большенстве случаем можно обойтись и универсальной версткой, но к сожалению не во всех

[Vlad Drakula]

ссылка на хороший ресурс с полезными ссылками по теме векторной графики в HTML
http://xmlhack.ru/texts/06/ajax-html...nvas-ruby.html

[Vlad Drakula]

еще одно замечание:
изменение Z-INDEX не приводит к перезагрузки изображений и фильтров, что позволяет сильно оптимизировать работу елементов которые должны динамически изменять свой внещний вид при действиях пользователя, например изменять отображаемую картинку.

[Vlad Drakula]

DIV vs TABLE. Мифы сторонников тега TABLE
Миф 1. Поддержка таблиц идентична во всех популярных браузерах.

С первого взгляда может показаться, что это действительно так. И действительно, спецификация таблиц в стандарте HTML 4 достаточно удачна, и практически во всех современных браузерах она, в общем, реализована относительно одинаково. Действительно, табличная разметка надежна и предсказуема.

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

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

Миф 2. Табличная верстка проще, занимает меньше времени, и поэтому дешевле.

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

Но опять-таки, это только для общих простых случаев. А что делать, если нужны вложенные таблицы? А если многократно вложенные? А если ячейки должны быть закругленными, иметь разноцветные бордюры и фон, закрывающий лишь часть ячейки таблицы? Тут уже, если пользоваться табличной версткой, придется генерировать значительное количество HTML кода, а именно, открывающих и закрывающих вложенных тегов, таких как, например <TABLE CELLPADDING=0 CELLSPACING=0 BORDER=0>, <TR> и <TD>.

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

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

Миф 3. Отрисовка таблиц браузером происходит быстрее, чем DIV со стилями.

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

Но у таблиц есть не очень приятная особенность. Пока таблица не загрузится полностью, ее содержимое не отображается. Это происходит потому, что браузеру необходимо вычислить высоту и ширину ячеек таблиц, что часто невозможно сделать, не зная содержимого. Даже стиль table-layout: fixed не всегда помогает ускорять загрузку.

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

Миф 4. Использование стилей не дает выигрыша по трафику.

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

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

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

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


Миф 5. Таблицы не влияют на индексирование сайтов поисковиками.

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

Например, специалисты по SEO скажут, что допустим портал на базе PHPNuke раскручивать несколько сложнее, чем на Xaraya. Именно по этой причине.

Теперь обобщим.

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

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

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

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

Выводы.

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

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

взято здесь: http://www.west3co.com/articles/data/ic_articles/2/

еще одна интересная статья: http://www.west3co.com/articles/data/ic_articles/1/

[benya]

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

[Vlad Drakula]

benya
а вот можно... иногда сложно иногда не очень... но можно... конечно полностью всю функциональность таблиц не повторить... но большую часть можно...

если очень интересно могу описать как можно верстать подобные вещи... главное пример конкретный придумай...

[benya]

Vlad Drakula,
Простой (для таблицы) пример "таблица с ценами":

Код:

<table width="100%" border="0" cellpadding="2" cellspacing="1" style="BACKGROUND-COLOR: #cccccc">
                    <tbody>
                    <tr bgcolor="#eeeeee">
                      <td rowspan="2" nowrap="nowrap"><b>Заезды</b></td>
                      <td rowspan="2" nowrap="nowrap"><b>Даты заездов</b></td>
                      <td colspan="2" nowrap="nowrap"><b>Стоимость в грн.</b></td>
                    </tr>
                    <tr bgcolor="#eeeeee">
                      <td nowrap="nowrap"><b>1 день</b></td>
                      <td nowrap="nowrap"><b>20 дней</b></td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>1</td>
                      <td>05.06 – 24.06</td>
                      <td>110</td>
                      <td>2200</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>2</td>
                      <td>25.06 – 14.07</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>3</td>
                      <td>15.07 – 03.08</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr>
                    <tr bgcolor="#fefefe">
                      <td>4</td>
                      <td>04.08 – 23.08</td>
                      <td>117,5</td>
                      <td>2350</td>
                    </tr></tbody></table>

[Vlad Drakula]

benya
постепенно...
для начала самое простое...
строка с танными...

было:

HTML код:

<tr bgcolor="#fefefe">
  <td>3</td>
  <td>15.07 – 03.08</td>
  <td>117,5</td>
  <td>2350</td>
</tr>

стало:

HTML код:

		<div style="width:100%;position:relative;height:20px;background-color: #fefefe">
			<div style="position:absolute;left:0px:top:0px;width:25%;">3</div>
			<div style="position:absolute;left:25%top:0px;width:25%;">15.07 – 03.08</div>
			<div style="position:absolute;right:25%top:0px;width:25%;">117,5</div>
			<div style="position:absolute;right:0pxtop:0px;width:25%;">2350</div>
		</div>