Страница с «пересаживаемыми» Бегуном и АдСенсом

Эта часть страницы прогрузится сразу.
Ниже будет Бегун, если он удосужится меня проиндексировать. 8)

Тут еще кусок контента — тоже прогрузится сразу.
Ниже будет АдСенс:

И весь оставшийся контент — тоже виден. Потому что реклама еще не начала грузиться.
Вернуться к статье.
Тут я для пущей надежности контента немножко вывешу.

Ранее я уже писал про методику переноса рекламных блоков. Напишу еще раз — с примерами и прочим. Часть текста придется повторить. Прежде всего, зачем это надо. Все мы знаем, что код большинства систем контекстной (и не очень контекстной) рекламы вставляется посредством джаваскриптов. При этом само тело джаваскрипта хранится не на сайте-площадке, а непосредственно на серверах провайдера контекстной рекламы. Так вот: каким бы хорошим хостингом и скоростными серверами не располагал данный провайдер рекламы, все равно невозможно добиться того, чтобы у всех пользователей всегда был хороший коннект к рекламному серверу. А если возникает задержка в выполнении скрипта, то очень часто это приводит к тому, что медленно грузится сама страница. Поэтому ниже предлагается простенький хак для того, чтобы избежать медленной загрузок. Теоретически он должен подходить к большинству систем рекламы, использующих джаваскриптовые вставки.
Пример такой тормозящей страницы.
В чем заключается проблема: пока не прогрузился и не исполнился джаваскрипт, страница не продолжает отрисовываться браузером.
Решение: грузить джаваскрипты уже после того, как отрисован весь контент.
Плохой пример такого решения.
Что тут неприятно: если всю рекламу запихать в конец кода страницы, и если сайт сайт сверстан не слишком хитроумно, то придется удовлетвориться рекламой в подвале. А это не есть хорошо, потому что денег хочется. 8)
Тогда придется поднапрячься и сделать так, чтобы блоки из «подвала» «переезжали» на нужное место. Как именно это делается, я уже писал. Повторю вкратце.
1. В местах, где надо разместить рекламные блоки, пишем простенькие div'ы-«заглушки» и присваиваем им уникальные id, например, <div id="adv_place_1"></div>. На самом деле, вместо div'ов при необходимости можно использовать любые другие теги, но необходимость такая случается редко.
2. В самом конце старницы вывешиваем все наши рекламные коды внутри других div'ов. Этим div'ам мы тоже присваиваем уникальные id, например, <div id="adv_block_1"></div>.
3. Под каждым из блоков дописываем джаваскриптик, который будет заниматься пересадкой каждого div'а с рекламой в положенный ему div-зуглушку:

<script type="text/javascript">
<!--
document.getElementById('adv_place_1').appendChild(document.getElementById('adv_block_1'));
//-->
</script>

Пример.
Побочный эффект: при «пересадке» блоков страница заметно дергается. Избежать этого полностью нельзя. Частично можно — попросту заранее задав высоту div'а-заглушки через свойство CSS height (код добавить в header страницы или в подключаемый stylesheet):

<style type="text/css">
#adv_place_1, #adv_place_2, #adv_place_3 {height: 3.25em;}
</style>

Пример. Небольшое подергивание все же есть, но не столь заметное.