Маленькая хитрость с баннером
Излагаю простой приемчик. Позволяет немного облегчить жизнь беднягам на диалапе и медленных линиях. Прием касается очередности загрузки баннеров и контента (или чего-то там за чем мы пришли на сайт)
Проблема не придуманная и мозги мне прокомпостировала уже не раз пока я сидел на dialup. Может это только у меня такой провайдер? :(
Проблема
Вы переходите на какой-либо сайт. Но если сайт более или менее посещаемый - присутствует баннер. И если хозяин хочет много денег :) то баннер этот в самом верху страницы. И вот картина - грузится баннер (очень красивый) и доооооолго грузится (баннерокрутилка слабая например). А ты сидишь и на него “втыкаешь”. Потому что пока он не загрузится - не появится контент-или-картинки-или-почта за которой вы пришли… :(
Решение
Решение чрезвычайно простое - хотя подходит не для всех случаев. Проблема эта возникает из-за того что баннер находится в коде в самом верху страницы - потому и грузИться начинает первым.
Идея в том, чтобы перенести код баннера в конец HTML - тогда баннер начнет грузиться лишь после того, как весь контент загружен. Как перенести баннер в конец кода, а визуально оставить вверху, описано ниже.
По крайней мере сначала, юзер будет смотреть на загружающийся контент, а не на тормозящий баннер.
Технически
Элементарный HTML+CSS даёт нам нужный результат.
HTML:(с баннером в конце)
- <div id=”page”>
- <div id=”content”>
- a lot of content goes here
- </div>
- <div id=”banner”>
- </div>
- </div>
CSS:(исправляющий положение)
- #page{
- position:relative;
- padding-top:80px; /*Высота баннера, пускай 770х80*/
- }
- #banner{
- position:absolute;
- top:0;
- }
Вот и все. Теперь баннер будет визульно вверху - но грузиться будет последним. Такую фичу я сделал на укр.нет. Их топ-баннер в коде находится самым последним - и можно попасть в свой почтовый ящик до его загрузки.
Конец
Кроме того что мы выигрываем в ощущениях пользователей - мы так же немного улучшаем свою индексируемость поисковиками - ведь больше ценятся слова вверху страницы.
К тому же иногда выигрыш бывает просто огромным. Вот взять к примеру pravda.com.ua.
В шаблоне отображения новости 3(!!!) баннера и 2-3 килобайта нужного юзеру контента. Конечно такое кол-во баннеров - неправильно, но не нам судить. А представьте юзер бы ждал 2 баннера для чтения 10 строк новости? Там я тоже применил эту маленькую хитрость.
Вот такой вот tip. Был бы рад услышать чьё-нибудь мнение.
Для тех кто не знает что такое absolute
Хорошая статья Дага Баумана:
ты зашарил:)
класс. спасибо. будем юзать :)
Большой минус
К хорошему БЫСТРО привыкаешь. Source Order всегда важен
Когда научишься (хотя правильно писать “заточишься”) в абсолютном позиционировании потом трудно с этого спрыгнуть.
:) Надеюсь это полезный коммент :))
Очевидная фича, которую должен юзать любой кодер даже если его аудитория исключительно на лане сидит - мы ведь не баннеры рассматривать приходим!
Сколько еще нужно таких текстов по сетке, чтобы это правило вошло в этику кода?
Кстати, вот еще одна фича для бедняг на бесплатных хостингах…
В начале кода пишем див с z-index=999 белый, 100% всего.
На нем ваяем все остальное, что планировали.
Зачем подложка? Закрыть уродливые баннеры хостеров.
Работает пока везде…
1) Фичу эту юзать конечно стоит только с согласия хозяина сайта - не все ставят во главу угла юзеров…
2) Ну если хостер смотрит по загрузке какой-то картинки - то поможет - но иногда делают по другому.
И хотя прием нормальный - если уж ты так заботишься о внешнем виде проще сменить хостинг.
В любом случае спасибо за sharing tip’а :)
Отличная идея, единственная проблема, если это будет реклама которая приносит вам денег, то это будут финансовые потери
Насколько я уже успел понять - те кто действительно зарабатывает на рекламе(укрнет правда…) - приоритет ставят прежде всего на пользователей и их удовлетворение. Это мой скромный опыт.
Потери конечно будут но они зависят от каждого сайта отдельно. Исходя из моего опыта - небольшие. А у нас баннерный бизнес в той стадии когда платят в основном не за показы а за неделю “висения”… :)
В любом случае доречне зауваження! 10x.
О каких потерях вы говорите, CTR у баннеров настолько низок что люди которые хотят на этом заработать обманывают сами себя (а в некоторых случаях ещё и “унижаются” перед клиентами)
Лучший способ заработок рекламмы это текстовые ссылки, они и приносят прибыль и не мешают клиентам
Просто у баннеров своя ниша - раскрутка брэндов как правило - текстом ты запоминания брэнда не добьешься…
Я думаю что хотя ЦТР для баннеров низкий - но не зря иногда платят за их показы, а не клики…
Иногда, но далеко не всегда (я даже сказал бы редко) для раскрутки гараздо выгоднее прямые ссылки
- повышается тИЦ рекламируемого сайта
- не мешает посетителям рекламирующего сайта (не раздражает)
- почти никто не режит их (всякими Adblock-ами и Outpost-ами)..
Хотя согласен, для “навязывания” брэнда 468х60 это именно то что доктор прописал…
[…] и любимый) редизайн очень посещаемого украинского новостного ресурса - Украинская Правда Маленькая хитрость с баннером - очень простая “хитрость”, как улучшить user experienc […]
“повышается тИЦ рекламируемого сайта” - при ссылки на картинке тоже повышается. особенно если alt не забыть.