1  2  3  4  5  6  7  8  9  10

Составные изображения
Теперь поговорим еще об одном применении таблиц. А именно о составных изображениях.
Предположим, вы создали, получили в подарок от знакомого художника или нашли в Сети красивую картину. И теперь хотите поместить ее на сво­ей странице. Конечно, вы уже узнали, как это делается, в главе 4. А теперь предположим, что это не картина, а элемент оформления страницы, ска­жем, красивый заголовок. И этот заголовок содержит в себе несколько повторяющихся элементов. (А среди элементов оформления такое случается очень часто.)
Можно сделать так, как вы бы поступили с обычным графическим изобра­жением, т. е. просто поместить его на страницу. А можно поступить иначе, как это часто делают опытные Web -дизайнеры: сделать составное изобра­жение.
Что такое составное изображение! Ничего особенного, просто обычное изображение, но "разрезанное" на части, каждая из которых сохраняется в отдельном файле. Такие функции предлагаются всеми современными графическими пакетами, такими как Adobe Photoshop или Macromedia Fireworks В результате получается набор файлов — набор графических изображений-фрагментов. Ну и что, скажете вы? Но дело в том, что изображение это режется не наобум, а таким образом, чтобы количество этих самых файлов-фрагментов было минимально. Возьмем какойнибудь фрагмент, повторяющийся в изо­бражении несколько раз; если изображение умело разрезать, вместо множества файлов мы будем иметь один-единственный — с этим самым фрагментом. За счет этого размеры загружаемого изображения сильно уменьшатся.
Чтобы "собрать" воедино фрагменты изображения, используются особые таблицы, размеры ячеек которых жестко заданы и равны размерам соответствующих фрагментов. В каждую ячейку таблицы загружается свой фрагмент. Таким образом и формируется полное изображение.
В случае использования составного изображения можно организовать слож­ную графическую гиперссылку, аналогичную карте-изображению. Для этого в нужные ячейки таблицы просто помещаются соответствующие гиперссыл­ки. Естественно, сначала вам необходимо нарисовать соответствующее изображение.
Проблемы с таблицами и их решение
Напоследок давайте поговорим о том, какие проблемы подстерегают Web - дизайнера, решившего использовать таблицы, и как они преодолеваются.
Общие недостатки таблиц и их преодоление
Итак, поговорим о недостатках таблиц... Да, у HTML -таблиц есть серьезные недостатки. Что ж, в мире нет ничего совершенного!..
О первом недостатке уже говорилось. Это громоздкость и запутанность HTML - кода, используемого для создания таблиц. Но это уже проблемы конкретного Web -дизайнера; в самом деле, необходимо просто аккуратно писать и тщательно документировать HTML -код, чтобы не запутаться в нем. К тому же, для создания таблиц опытные Web -дизайнеры прибегают к помощи визуальных Web -редакторов. Последние, конечно, не столь интеллектуальны и артистичны, как человек, но работают не в пример внимательнее и аккуратнее.
Второй, и самый существенный, недостаток — очень медленные загрузка и отображение. Дело в том, что многие Web -обозреватели, в частности популярнейший Internet Explorer , просто физически не в состоянии вывести таблицу на экран, пока не загрузит ее целиком. А если таблица велика, то... да что вам рассказывать?! Неужели вы не видели в Сети страничек, содержащих таблицы совершенно диких размеров? И неужели вам никогда не надоедало ждать, пока этот монстр соизволит доползти до вас полностью и явится пред ваши очи?
Примечание
Разработчики Web - обозревателей Opera и Mozilla утверждают , что эти программы могут выводить таблицы на экран по мере загрузки .
Ох уж эти гигантские таблицы... Но замедление загрузки могут вызвать и не размеры таблиц. Есть еще целый ряд причин, из-за которых Web -обозревателю может потребоваться много времени, чтобы вывести таблицу на экран. Сейчас мы все их рассмотрим. И заодно приведем кое-какие не­сложные рекомендации, призванные сделать загрузку и отображение ваших таблиц более быстрыми.
Ранее уже говорилось о гигантах в мире таблиц. А рекомендации будут следующими. Прежде всего, не делайте больших таблиц. Если без этого не обойтись, то разбивайте каждую большую таблицу на несколько ма­леньких. Маленькие таблицы будут загружаться быстрее, и пользователь будет, видеть, что Web -страница нормально обрабатывается, и сможет прочитать хоть какой-нибудь текст.
Отображение таблицы может сильно замедлиться, если для нее или ее ячеек заданы относительные величины ширины и высоты. При этом Web - обозревателю сначала придется вычислить ширину и высоту родите­ля (самой Web -страницы или ячейки внешней таблицы). А точные значения ширины и высоты родителя он может получить только после того, как закончится обработка всей страницы, т. е. очень и очень нескоро. Здесь рекомендация может быть только одна: по возможности исполь­зуйте абсолютные значения размеров таблиц и ячеек (но именно по возможности, а не всегда).
Обработка и вывод Web -страницы могут сильно замедлиться, если в ней используются многократно вложенные таблицы. А если еще эти таблицы отформатированы с указанием относительных значений ширины и высо­ты, то... Рекомендации: тщательная проработка структуры таких таблиц и, естественно, оптимизация.
Ну вот, со скоростью загрузки и отображения таблиц закончили. Теперь давайте поговорим о причинах, по которым Web -обозреватель может отобразить таблицу неправильно. И, конечно, о решении этих проблем. Иногда Web - обозреватель не может корректно показать ячейку таблицы, если в ней ничего нет, т. е. ее код — < td ></ td >. Особенно этим страдает Navigator . Для решения данной проблемы достаточно поместить внутрь такой ячейки символ неразрывного пробела nbsp ; (как это делает по умолчанию Dreamweaver ): < TD > nbsp; </ TD >. Правда, некоторые рекомен­дуют для этой же цели уже знакомый вам "однопиксельный GIF ":
< TD >< IMG SRC =" lxl . gif "></ TD >, но об зтом мы поговорим ниже .
Если HTML -код таблицы содержит ошибки, будьте готовы, что Navigator выведет вам страницу без малейших следов этой самой таблицы. Вообще, Navigator исключительно чувствителен к ошибкам кода, в отличие от его "коллеги" Internet Explorer . Поэтому, если вы предпочитаете редактировать HTML -код таблиц вручную, тщательно проверяйте его на ошибки. А еще лучше: воспользуйтесь специальными программами проверки HTML -кода, которых сейчас довольно много на любом CD с програм­мами. Ну и, конечно, радикальный выход из положения: воспользуйтесь для составления таблиц визуальным Web -редактором — он таких ошибок не сделает.

1  2  3  4  5  6  7  8  9  10

Вверх