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

Чтобы таблица быстрее загружалась, укажите размеры графических изображений, вставляемых в ячейки таблицы. В следующем коде графическое изображение image.jpg загружается в ячейку таблицы, которую браузер делает такой же ширины и высоты, что и изображение:

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

ПРИМЕЧАНИЕ: При указании размеров изображений следите затем, чтобы значения атрибутов height и width соответствовали фактической ширине и высоте изображения, которое браузер должен поместить в ячейку. Если указанные вами высота и/или ширина отличаются от размеров изображения, Web-браузер растянет (или сожмет) изображение, чтобы привести его размеры в соответствие со значениями атрибутов height и width. В результате выведенное на экран изображение может исказиться.