Ускоряем загрузку графики

Многие начинающие web-дизайнеры, разрабатывая свой первый
самостоятельный проект, сталкиваются иногда с весьма трудной задачей,
связанной с отображением графики в документах HTML. Проблема
заключается в том, что согласно изученным вами ранее «постулатам»
web-дизайна каждый html-документдолжен быть максимально компактным,
тогда как большое количество иллюстраций, появляющихся, например, при
создании виртуального фотоальбома, значительно перегружает файл,
пропорционально увеличивая время его считывания с сервера.
Решить эту проблему, оптимизировав объем итогового html-документа,
можно двумя методами.

Первый метод заключается в следующем.
Создавая фотоальбом, подготовьте две копии каждого изображения: одну
— нормального размера и качества, такую, которую вы и хотели бы
поместить на свою web-страничку, вторую — в уменьшенном масштабе и с
низким разрешением. Разместите на web-странице уменьшенные копии
картинок, назначив для каждой из них свойства гиперссылки с атрибутом
TARGET="_blank", которая перенаправит пользователя к большому
графическому файлу. В документ вставьте пояснение для посетителей о том,
что щелчок кнопкой мыши на любом рисунке приведет к его загрузке в
отдельном окне броузера в увеличенном масштабе. Тогда пользователю, не
заинтересованному в разглядывании ваших фотографий, не придется
подолгу дожидаться окончания считывания странички с удаленного узла.
Если же он все-таки захочет полюбоваться на некоторые из опубликованных
вами иллюстраций, ему не составит труда выбрать наиболее интересные из
них. Такой подход к представлению графики в Интернете носит название
«предварительного просмотра», или, по-английски, «preview».
Если мы назовем файл, содержащий уменьшенную копию картинки,
picture1.jpg, а файл нормального размера — picture2.jpg, то html-код
гиперссылки, описанной выше, будет выглядеть следующим образом:
<А HREF="picture2.jpg" TARGET="_blank"><IMG SRC="../picture1.JPG"
WIDTH="100" HEIGHT="98" АLT="Уменьшенная картинка" BORDER="0"></A>

Второй метод ускорения загрузки графических файлов с сервера несколько
отличается от предыдущего. Если, предположим, ваш сайт содержит фото
галерею, доступ к которой открывается с пятой — шестой странички по
счету, все содержащиеся в ней графические файлы можно загрузить в
клиентский компьютер заранее, на предыдущих страницах, выводя их на
экран размером 1x1пиксел. Код, осуществляющий подобный вывод графики,
выглядит так: <IMGSRC="URL графического файла" WIDTH="1"
HEIGHT="1">. Изображение при этом станет невидимым для посетителя
сайта, но сохранится в кэше его машины, а при последующем открытии
данной картинки она будет загружаться уже с жесткого диска локального
компьютера. Таким образом, у пользователя создается впечатление, что
изображение выводится на экран очень быстро. Однако за все надо платить:
время загрузки предыдущих страниц при этом пропорционально
увеличивается. Дабы посетитель вашего сайта не скучал, в процессе
выгрузки графики его можно развлечь чем-нибудь другим: например,
предложить почитать новости или подборку свежих анекдотов.

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

Еще статьи о заработке Webmoney
 
Сайт создан в системе uCoz