Баннерная реклама

admin

Любая баннерная система оказывает влияние на скорость работы сайта. Баннерные системы обычно используют крайне не оптимизированные решения, включая:

Все это может значительно замедлить работу сайта. Но влияния на работу баннерных систем у разработчиков обычно нет (если только не используется что-то собственное). Существует хак, который позволит снизить эффект от медленных баннеров.

Асинхронная загрузка рекламы

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

Большинство баннерных кодов используют Javascript вызов document.write(). Это делает невозможным прямой запуск такого кода на событии body.onLoad(). Поэтому просто перенести код в асинхронный скрипт не выйдет.

Iframe

Самый просто вариант сделать асинхронную загрузку рекламы – перенести ее в iframe. Содержимое фрейма браузер грузит независимо от основного сайта, поэтому это никак не замедлит его загрузку.

Скрытая загрузка

Если возможности использовать iframe нет, тогда можно воспользоваться хорошим свойством современных браузеров. А именно – загрузка скрытого контента в последнюю очередь. Выводим картинку в скрытом блоке:

Она будет загружена после тех элементов, которые видны. В некоторых браузерах картинка вообще не будет загружена до того момента, пока блок не станет видимым. Как раз то, что нам нужно. Чтобы применить это к рекламе необходимо:

1. Все баннера показывать в скрытом контейнере

Оборачиваем всю рекламу в display:none элемент:

## Такой контейнер нужно использовать для всех баннеров

2. Показываем блоки с рекламой после загрузки контента

Используя jQuery:

## Покажет всю рекламу после загрузки документа

Самое важное

Этот небольшой трюк может снизить зависимость работы сайта от медленной рекламы. Стоит попробовать.

Останні статті

Что такое прокси-сервер: пояснение простыми словами, зачем нужны прокси

Прокси (proxy), или прокси-сервер — это программа-посредник, которая обеспечивает соединение между пользователем и интернет-ресурсом. Принцип…

21.11.2024

Что такое PWA приложение? Зачем необходимо прогрессивное веб-приложение

Согласитесь, было бы неплохо соединить в одно сайт и приложение для смартфона. Если вы еще…

19.11.2024

Как создать игру на телефоне: программирование с помощью конструктора

Повсеместное распространение смартфонов привело к огромному спросу на мобильные игры и приложения. Миллиарды пользователей гаджетов…

17.11.2024

Google Bard: эффективный аналог ChatGPT

В перечне популярных чат-ботов с искусственным интеллектом Google Bard (Gemini) еще не пользуется такой популярностью…

14.11.2024

Скрипт и программирование: что это такое простыми словами

Скрипт (англ. — сценарий), — это небольшая программа, как правило, для веб-интерфейса, выполняющая определенную задачу.…

12.11.2024

Дедлайн в разработке: что это такое простыми словами

Дедлайн (от англ. deadline — «крайний срок») — это конечная дата стачи проекта или задачи…

11.11.2024