Оптимизация для мобильного Интернета. Вебинар от Google Adsense.

Alex Agent
На сайте с 07.04.2011
Offline
304
#161
qilly:
Перечитал еще разочек весь топик. В принципе в целом все понятно. Не понял только одного - можно ли юзать блок 336х280 на мобильных (начиная от разрешения экрана 336)? При разрешении экрана в 320 понятно что нет, ибо не влазит, а если выше?

Да, можно. Но только не в верхней части страницы. Можно даже вручную "прибить" meta viewport шириной 360 пикселей и показывать 336x280 на любых смартфонах. Я так с весны делаю - кликают хорошо.

Сейчас на разных сайтах использую жесткие вещи😂:
1. Нетборды с CSS overflow hidden (кликабельность и доходы офигенные))
2. 336х280 с CSS overflow hidden (тоже норм!)
3. 300х250 на первом экране

Да вы, батенька, экстремал! Особенно пункт 1. Дам совет - адаптивный блок высотой 2048 пикселей, чтобы "мышь не проскочила".

Всему свое время. Все сами принесут и все сделают. Быстрый и выгодный перевод денег Россия ↔ Украина онлайн (http://smartwm.ru/referral/cea1f09842be).
qilly
На сайте с 28.03.2008
Offline
411
#162

Товарищи, я нефига не понял, как все-таки реализовать следующее...

Для мобильных у которых разрешения до 336 показывать блок 300х250

Для мобильных у которых разрешения от 336 показывать блок 336х280

То есть речь не об адаптивных блоках. Сори, если достал уже с этими 336х280 )

AlexStep
На сайте с 23.03.2009
Offline
353
#163
.blabla { width: 300px; height: 250px; }
@media(min-width: 336px) { .blabla{ width: 336px; height: 280px; } }

Может так?

Alex Agent
На сайте с 07.04.2011
Offline
304
#164
qilly:
Товарищи, я нефига не понял, как все-таки реализовать следующее...

Для мобильных у которых разрешения до 336 показывать блок 300х250
Для мобильных у которых разрешения от 336 показывать блок 336х280

То есть речь не об адаптивных блоках. Сори, если достал уже с этими 336х280 )

Можно и с неадаптивными - скрывать/показывать блоки через display: none/block средствами CSS @media в зависимости от выбранной ширины экрана. Сейчас это допустимо.

Пример: у меня есть три блока NetBoard с шириной 580 - для больших экранов, 336x280 и 300x250 - для мобильных.

.desktop_ad1 { display: block; }

.mobile_336_ad1 { display: none; }
.mobile_300_ad1 { display: none; }

@media (max-width: 639px) and (min-width: 360px) {

.desktop_ad1 { display: none; }
.mobile_336_ad1 { display: block; }
.mobile_300_ad1 { display: none; }

}

@media (max-width: 359px) {

.desktop_ad1 { display: none; }
.mobile_336_ad1 { display: none; }
.mobile_300_ad1 { display: block; }

}

Значение 640 пикселей выбрано на том основании, что ПК и планшет с меньшим разрешением уж точно не встретишь в Интернете. 360 пикселей для мобильных позволяют оставить отступы по краям.

qilly
На сайте с 28.03.2008
Offline
411
#165
AlexStep:
Может так?

Так это разве не для адаптивного блока вариант?

Alex Agent:
Можно и с неадаптивными - скрывать/показывать блоки через display: none/block средствами CSS @media в зависимости от выбранной ширины экрана. Сейчас это допустимо.

Разве display: none разрешен для всех блоков? Вроде только для адаптивных?

---------- Добавлено 24.09.2016 в 19:18 ----------

А вообще кто-нибудь получал предупреждения за размещение блока 336х280? Может и пофиг что на самых маленьких разрешениях блок не помещается немного по ширине и обрезается (если задать overflow: hidden в css)... я так понимаю основные предупреждения сейчас за размещение блоков 300х250 в первом экране и за одновременный показ двух блоков на одном экране.

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