Содержание
Веб-страницы должны загружаться быстро, но вложенные таблицы могут замедлить процесс. Никому не позволяйте говорить, что все больше людей пользуются широкополосным или высокоскоростным Интернетом, поэтому вам не нужно беспокоиться о скорости загрузки ваших страниц. С количеством контента в сети, на странице или сайте, который загружается медленно, будет меньше посетителей, чем на быстро загружаемом. Скорость важна.
Что такое вложенная таблица?
Вложенная таблица — это HTML-таблица, в которой есть другая таблица. Например, следующий код:
дает простую таблицу, которая выглядит следующим образом:
Вложенные таблицы заставляют страницы загружаться медленнее
Одна таблица на веб-странице не приведет к более медленной загрузке страницы. Но когда вы помещаете одну таблицу в другую, браузеру становится сложнее, поэтому страница загружается медленнее. И чем больше таблиц вы вкладываете, тем медленнее загружается страница.
Обычно, когда страница загружается, браузер запускается в верхней части HTML-кода и загружает его последовательно вниз по странице. Однако для вложенных таблиц необходимо найти конец таблицы, прежде чем он сможет отобразить все содержимое. Причина, по которой рендеринг замедляется, заключается в том, что браузер должен выполнять итерации документа HTML дополнительное время.
Таблицы для макета
Когда вы пишете действительный XHTML, таблицы вообще не должны использоваться для разметки. Таблицы предназначены для табличных данных, таких как электронные таблицы, а не для оформления страницы. Вместо этого вам следует использовать CSS для разметки — CSS-проекты визуализируются быстрее и помогают поддерживать действительный XHTML.
Проектирование таблиц с более быстрой загрузкой
Если вы разрабатываете таблицу с несколькими строками, она часто может загружаться быстрее, если вы пишете каждую строку как отдельную таблицу. Например, вы можете написать таблицу следующим образом:
Но если вы напишите одну и ту же таблицу в виде двух таблиц, она будет загружаться быстрее, потому что браузер отобразит первую, а затем — вторую, а не всю таблицу целиком. Хитрость заключается в том, чтобы убедиться, что каждая таблица имеет одинаковую ширину и другие стили (например, отступы, поля и границы).
Преобразование вложенных таблиц в одну таблицу
Преобразуйте вложенные таблицы в несколько более сложные одиночные таблицы, хорошо разбираясь в таких атрибутах, как Объединение столбцов, который при тщательном развертывании будет имитировать внешний вид вложенной таблицы, фактически не выполняя как:
Эта таблица также имеет преимущество в использовании меньшего количества символов, чем во вложенной таблице, поэтому она также будет загружаться быстрее.
