Табличная верстка. Оптимизация таблиц.

верстка

Табличная верстка мертва ? Не совсем! Оптимизация таблиц — просто и  все еще аккуратно.

Что это — табиличная верстка ? Или даже не так — мертва или еще актуальна ? Большинству опытных web-мастеров известно, что браузер отображает содержимое страниц  постепенно, по мере загрузки частей страницы. Конечно,   скорость доступа к всемирной сети все время растет, но развитие мобильного интернета все еще идет медленными шажками в плане увеличения скоростей. постепенная загрузка предполагает, что сначала посетитель увидит текст страницы, после чего постепенно подгружается графика — картинки. баннеры , флешь анимация  и прочие ее элементы. Для пользователей это достаточно удобно, поскольку позволяет ознакомиться с частью информации и найти необходимые ссылки без ожидания завершения загрузки.

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

Выход из создавшейся ситуации нам предлагают создатели броузеров, которые вводят собственные расширения HTML и CSS для оптимизации работы своих броузеров. Предлагаю Вам ознакомиться с возможностями броузера Microsoft Intenet Explorer. Возможности Netscape Navigator я рассмотрю в следующий раз.

Производительность построения таблицы в IE может быть значительно увеличена, если установить для этой таблицы стиль table-layout в значение fixed. При этом размеры таблицы будут определяться в следующем порядке: С использованием атрибута width тэгов COL и COLGROUP. Путем анализа форматирования первой строки таблицы.
Равным делением ширины таблицы на количество ее ячеек.

Если применен стиль table-layout со значением fixed, то броузер не будет дожидаться загрузки всего содержимого таблицы, начав отображать ее строки сразу, по мере загрузки. При использовании тэгов COL необходимо задать атрибут width для каждого из них и для тэга TABLE. Если теги COL не указаны, броузер проанализирует формат первой строки таблицы и будет строить все остальные строки, используя полученную информацию. Если невозможно определить формат первой строки и не указаны тэги COL, то размер таблицы делиться поровну между всеми ее колонками.

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

Author: admin