Размещение рекламных блоков в зависимости от разрешения экрана

etonetot

9 октября 2014, 12:43

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

Например, при разрешении 1024*768 справа от контента места нет, нужен горизонтальный блок под контентом. Если экран шире, справа появляется место для вертикального блока.

Как правильно выйти из ситуациии?

Попробовал решить эту проблему в javascript, путем скрывания/показывания div-вов с рекламными блоками в зависимости от разрешения. Но результат самому не очень нравится, возможно сделал не совсем правильно - скприпт на onload-е и все эти телодвижения заметны юзеру.

Спасибо.

11 комментариев

Авторизуйтесь, чтобы оставить комментарий

Леонид Смирнов

27 января 2016, 23:49

в css можно указать видимость и положение различных блоков в зависимости от разрешения экрана. Ищите @media screen and max-width

Алексей

27 января 2016, 23:49

скажите, пожалуйста, а этот метод не будет расцениваться как накрутка? ведь скрипты внутри дивов все равно загружаются?

Леонид Смирнов

27 января 2016, 23:49

Вроде когда-то подобный вопрос здесь был, сказали что так можно. Во всяком случае пользователе вы точно никак не обманываете, если просто не показываете объявление. Только возможно искажается статистика, соотношение показов и кликов.

solustra

27 января 2016, 23:49

smirnovln78 говорит о том, что нужно не скрывать одни блоки и показывать другие. В зависимости от размеров экрана менять положение одного и того же блока. Если экран не широкий, то перемещать рекламный блок над/под содержимом страницы. Мне кажется, что этот способ самый лучший. Однако для этоготребуется тщательно подобрать формат блока (чтобы смотрелся и в "башне" и в "плоском варианте") и настроить @media в css.

Ниже maxsuharevv предложил более простой вариант, но он плох тем, что при изменении размеров экрана ширина изменится, а блок будет все там же.

Владимир

27 января 2016, 23:49

Подскажите пожалуйста, как менять расположение блока, в зависимости от разрешения?

thearnica

27 января 2016, 23:49

Надо не на onload, а dom-ready

robotti

27 января 2016, 23:49

Я раньше, до перехода на работу с RTB менял с помощью javascript переменные в коде в зависимости от разрешения экрана. В них указывал и тип блока и количество оъявлений.

bluestorm1

27 января 2016, 23:49

Скажите, а сейчас вы работаете чисто на РТБ ?

robotti

27 января 2016, 23:49

Ну пока еще не чисто, но на постепенно заменяю все рекламные блоки. С РТБ ситуация аналогичная, но вместо переменных в коде приходится подставлять индентификатор блока в зависимости от ширины окна.

27 января 2016, 23:49

Можешь попробовать вот так: Если разрешение больше 1024px, то показывается блок горизонтальный с 3 ссылками; если меньше 1024px то загружается блок флэт с одной ссылкой.

yandex_partner_id = xxxxxx;
yandex_site_bg_color = 'FFFFFF';
yandex_ad_format = 'direct';
yandex_font_size = 1.1;
yandex_direct_type = 'horizontal';
yandex_direct_limit = 3;
yandex_stat_id = 1;
yandex_direct_title_font_size = 3;
yandex_direct_links_underline = false;
yandex_direct_title_color = 'CC0000';
yandex_direct_url_color = '000000';
yandex_direct_text_color = '000000';
yandex_direct_hover_color = 'FF0000';
yandex_direct_favicon = false;
yandex_no_sitelinks = true;

if (document.body.clientWidth < 1024) {
yandex_font_size = 1;
yandex_direct_type = 'flat'; //показывает какой блок крутить при разрешение ниже 1024
yandex_direct_limit = 1; //количество ссылок
yandex_direct_title_font_size = 1;
}

zavetu

27 января 2016, 23:49

Ну правильно. Если нужно показывать блоки разных типов и с разным кол-вом ссылок, то правильно только так. Иначе, если решать проблему сокрытием ненужного блока, полностью будет нарушена статистика. (хотя не уверен, что такая проблема возникнет с ассинхронным кодом, возможно это предусмотренно)