Яндекс вбиває бізнес, або будьте обережні з блоком #main

Заголовок, звичайно, абсолютно жовтий. Я хочу розповісти коротку детективну історію про те, як великий та могутній Яндекс вирішив зруйнувати бізнес (не спеціально, звичайно, абсолютно випадково, помилково) нашому маленькому і затишному сайту, і про те, чому при створенні розширень для браузерів, які повинні працювати тільки на певних сайтах — важливо в коді прописати, щоб розширення працювало тільки на певних сайтах, і ні на які більше.

Суть в тому, що пару місяців тому нам почали надходити запити від користувачів, з скаргою, що вони не можуть розміщувати оголошення на сайті, тому що футер наїжджає на кнопку «додати», зі скріншотами, типу таких:



Здавалося б, просто поїхала верстка, футер став наїжджати на контент, при чому тут Яндекс?

Браві верстальники відразу ж кинулися розслідувати проблему, але повторити помилку ніяк не виходило — у всіх браузерах, навіть самих старих і дивних версій, верстка коректно відображати, футер не наїжджав на кнопку «додати», і взагалі краса і ідилія.



Користувачі, які писали про проблему, в результаті заходили через IE або FF і вдало додавали свої оголошення — але це ті, хто був зацікавлений у цьому. А яке-то кількість користувачів, які не хотіли морочитися з тех. підтримкою та іншими браузерами, ми, очевидно, втрачали — при цьому ми ніяк не могли з'ясувати, в чому причина.

Так було до тих пір, поки, нарешті, один з технічно підкованих скаржаться не скинув нам повний список встановлених у нього розширень на Chrome:
Music sig vkontakte 3.1.15, Альтернативний пошук 8.17.0, Візуальні закладки 2.26.2, Пошук і стартова — Яндекс 8.15.0,


Після того, як ми встановили собі ці розширення і зайшли на сайт, проблема підтвердилася — дійсно футер став наїжджати на контент!

Щоб проблема була зрозуміліше, поясню, що на сайті ми використовували класичний спосіб приклеювання підвалу до низу сторінки, коли створюється три блоки

<body>
<div id="wrap">
<div id="main">Контент</div>
</div>
<div id="wrap-footer"></div>
</body>


* {
margin: 0;
}
html, body {
height: 100%;
}
#wrap {
min-height: 100%;
margin: 0 auto -155px; 
}
#main { 
padding: 0 0 155px 0;
}
#wrap-footer {
height: 155px; 
}


І цей код ідеально працював рівно до тих пір, поки компанія Яндекс не створила чудове розширення Альтернативний пошук 8.17.0.



Ідея розширення абсолютно блага:
Швидке перемикання між пошуковими сервісами — Яндексом, Google, Mail.ru, Bing, YouTube або пошуком по відео ВКонтакте.

Ви можете в один клік отримати відповідь на своє питання від Яндекса, Google, Mail.ru, Bing, YouTube або пошуку по відео ВКонтакте. Розширення доступно на всіх перерахованих сайтах.


За фактом ж це розширення дійсно, як заявлено, на всіх перерахованих сайтах (Яндекса, Google, Mail.ru, Bing, YouTube) додає панель швидкого перемикання між пошуковими системами.

А ось на всіх інших (не перерахованих) сайтах воно навіщо прибирає padding-bottom у блоку з id main.
Тобто просто при завантаженні сторінки робить
<div id="main" style="padding-bottom:0;"></div>


Таким чином Яндекс своїм розширенням просто заблокував додавання оголошень на нашому сайті всім користувачам, у яких воно встановлено. Не дуже-то красиво з їх боку :-)

На даний момент встановлено розширення вже майже у 97 424 користувачів Google Chrome, і підозрюю, що воно поширюється разом з якимись іншими додатками, або пропонується до установки на сайтах яндекса, тому що наші користувачі, за їх словами, самі це розширення не встановлювали, і не користуються ним.

Якщо на вашому сайті теж є блок #main — перевірте, чи не ламає це розширення і вашу верстку.

Баг-репорт відправлений, верстка на сайті змінено — замість паддінга вниз сторінки доданий блок-пушер відповідної висоти.

Happy end.

Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.