Как сделать адаптивный автобаннер Admitad

Евгений
Автор статьи: Евгений
Веб-мастер, SEO-специалист. Занимаюсь созданием и продвижением сайтов с 2012 года.
опубликовал: 135 статей

В партнёрской программе Admitad есть замечательный инструмент - автобаннер, т.е. ротатор который позволяет автоматически показывать несколько баннеров разных программ. К сожалению это ротатор не адаптивный. И даже техподдержка на вопрос о адаптивном автобаннере говорит что "К сожалению, на данный момент такой возможности нет."

Пришлось самостоятельно подобрать сили CSS, которые делают адаптивным это ротатор. Итак получаем код автобаннера в панели и оборачиваем в свой блок div с классом admitad-adaptive.

<div class="admitad-adaptive">
ТУТ КОД АВТОБАННЕРА
</div>

И прописываем соответствующие стили:

admitad-adaptive {
     margin:0 auto;
}
 .admitad-adaptive div div a img {
     display: block;
     max-width: 100%;
     height: auto;
}
 .admitad-adaptive div div {
     max-width: 100% !important;
}

Теперь Ваш автобаннер будет адаптивным!

Плагин — пакет хаков для Worpress

Евгений
Автор статьи: Евгений
Веб-мастер, SEO-специалист. Занимаюсь созданием и продвижением сайтов с 2012 года.
опубликовал: 135 статей
Лучшие хаки Wordpress

Все кто хоть раз сталкивался с настройкой WordPress знают, что просто "поставил и работает" не получится. В движке масса всяких нюансов, которые нужно дорабатывать, отключать ненужные функции. В этом частично помогают различные плагины типа Webcraftic Clearfy - плагин оптимизации для WordPress.

Но всё равно такие плагины не могут в достаточной степени оптимизировать движок WP  так как хотелось бы мне. А так как сайтов на WP у меня несколько и устанавливать там приходиться одно и тоже, возникла идея собрать все хаки в одном плагине и просто устанавливать такой плагин на каждый новый сайт. Итак представляю плагин All My Hack For WP (Все мои хаки для Worpress). Что может плагин:

  • Выводит изображения миниатюр записей в админке
  • Выводит миниатюры в RSS (удобно для автопостинга в соцсети)
  • Добавляет сообщение о политике конфиденциальности в форме комментария (и убирает дефолтное)
  • Отключаем srcset и sizes для картинок в WordPress (необходимо для работы плагинов Lazy Load)
  • Автоматически заполняет поле для атрибута alt изображения на основе заголовка при его загрузке вставке в контент поста.
  • Убираем значок wordpress и ссылку WP.org в верхнем баре админки

 

Скачать [версия 0.0.2]

 

 

Оптимизация сайта на WordPress для Google PageSpeed. Как нужно выполнять рекомендации сервисов?

Евгений
Автор статьи: Евгений
Веб-мастер, SEO-специалист. Занимаюсь созданием и продвижением сайтов с 2012 года.
опубликовал: 135 статей
Оптимизация сайта на WordPress для Google PageSpeed

В последнеее время все помешались на ускорении сайтов и подгонке их под требования PageSpeed Insights. Особенно это акутально для WordPress, где сам движок и плагины создают множество проблем при загрузке. Я тоже занялся этим вопросом и вот моё мнение. В погоне за "зелёненькими" цифрами оптимизаторы забывают про элементарную логику. Есть цифры в сервисах тестирования, а есть реальная скорость загрузки сайта, измеряющаяся в секундах. Поэтому для тестирования сайта и оптимизации я смотрю три сервиса:

Google PageSpeed (смотрим собственно цифры)

GTmetrix (5 в 1, собраны в удобном виде все метрики)

PingDom Tools (можно выбрать разные сервера для тестирования, показывает реальную скорость загрузки в секундах)

Задайте правила эффективного использования кеша для статических объектов

Например сервис часто требует, чтобы Вы осуществляли кеширования Google Analitics. Я сравнивал. Если убрать аналитику скорость загрузки уменьшается на 1,7 с! А это немало. Т.е. проще совсем убрать аналитику от Google. Тоже самое касается Яндекс.Метрики.

Но если Вы хотите выполнить это требование, то самый просто способ это сделать - использовать плагины, которые сохраняют analitics.js локально у Вас на сервере, и автоматически обновляют:

  • Webcraftic Clearfy
  •  CAOS | Host Google Analytics Locally

А за кеширование этих файлов будет отвечать любой установленный у Вас плагин: WP Fastest Cache, W3 Total Cache и т.д. Это позволит сэкономить 0,5-0,6 с и получить несколько баллов.

Устраните ресурсы, блокирующие отображение

Обычно это файлы стилей и скриптов, генериуемые темой и плагинами, которые загружаются в header. И если с объединением внутренних файлов и скриптов и переносом в footer прекрасно справляется плагин типа Autooptimaze, то с внешними скриптами всегда будут проблемы:

Устраните ресурсы, блокирующие отображение - jquery

В данном случае PageSpeed требует чтобы мы устранили проблему с JQuery и даже говорит что так мы сэкономим 270 мс. Логичным было бы сохранить этот файл у себя на сервере в подпапке и подгружать локально. Сделать это несложно, но только (неожиданно) это вообще никак может не ускорить загрузку. Потому что файл этот всё равно должен загрузиться, а сервера Google могут оказаться более скоростными чем Ваш собственный shared hosting.

В моём случае сайт был расположен на серверах в USA и прирост всё-таки был. В итоге показатели Page Speed растут с 68/88 до 74/95, а по PingDom Tools время загрузки (Load time) улучшилось на 61 мс: с 1.04 с до 979 мс. Это конечно не 270 мс, но тоже неплохо.

Итак применяя 2 несложных приёма: сохранение у себя на сервере и кеширование Google Analitics и JQuery, мы легко добиваемся "зелёных" цифр для компьютеров. С мобильными уже всё обстоит немного иначе.

Оптимизация под мобильные устройства

Рассмотрим оптимизацию страницы блога типичного сеошника.

Оптимизация загрузки в Page speed

Как видим цифры красненькие. Но для данного блога сеотрафик неважен. У него основной трафик реферальный.

Однако, если задаться целью и начать оптимизацию, то Page Speed сам нам подсказывает, что нужно оптимизировать. Выделил на скриншоте первый экран. Именно эти элементы надо оптимизировать в первую очередь, чтобы получить "зелёненькие" цифры. Самый простой способ - убрать баннер в заголовке. Всё что находится ниже первого экрана - а там могут быть виде, картинки и прочее -намного меньше влияют на показатели. Ими можно заняться в последнюю очередь.

Итак, если в первом экране на мобильном у Вас: большие изображения, реклама, баннеры или видео - то можете смело их убирать и получите значительный рост в показателях анализатора. Другое дело, что реклама в первом окне увеличивает вероятность клика, а значит заработка. Но тут уж Вам выбирать как лучше.

И да. Осторожнее с Lazy load. Изображения на первом экране (логотип, миниатюрка и т.д.) должны загружаться быстро и без Lazy load. Иначе, Вы сами себе создадите проблемы, откладывая загрузку изображений на первом экране.

Отключите граватары, Identicon или другие аватарки комментаторов

Проходим в Настройки - Обсуждение и отключаем аватарки полностью. У меня они давали плюс 2-3 секунды загрузки. Если жде они Вам очень нужны, то ставим простую аватарку по-умолчанию. Это даст плюс 2-5 баллов. Если конечно у Вас есть комментарии на сайте.

Аватар по-умолчанию

Чтобы выставить пользовательский аватар для Администратора, можно установить плагин WP User Avatar, и загрузить необходимую картинку. Тогда она будет кешироваться плюс Вы не зависите от скорости загрузки со стороннего сервера.

 

Буду информировать Вас о том что можно сделать в этом направлении.

Кавычки в заголовках статей: как ставить правильно

Евгений
Автор статьи: Евгений
Веб-мастер, SEO-специалист. Занимаюсь созданием и продвижением сайтов с 2012 года.
опубликовал: 135 статей

Раньше не задавался вопросом какие кавычки в заголовках статей на сайте можно ставить. Просто ставил любые. В итоге в некоторых были двойные кавычки  " ", а в других были ёлочки « ». Вы сами можете просмотреть как отображаются Title Вашего сайта через оператор site:site.ru. Вот и я проверил. И что мы видим:

А теперь смотрим как выглядят сниппеты если кавычки вида "":

Заголовок с кавычками

Вывод из этого простой: Кавычки-ёлочки в Google обрезают отображаемый заголовок, поэтому предпочтительно ставить обычные двойные кавычки "". Что я и сделал - массово поменял все.

Яндекс.Метрика и индексация скрытого контента

Евгений
Автор статьи: Евгений
Веб-мастер, SEO-специалист. Занимаюсь созданием и продвижением сайтов с 2012 года.
опубликовал: 135 статей
Яндекс метрика и индексация закрытого контента

Яндекс.Метрика установлена на многих сайтах и, как известно, исправно "стучит" Яндексу обо всём. Т.е. если у вас много ссылок на парнёрские программы, редиректы на рекламодателей или, не дай бог, партнёрка от Амиго - Метрику надо с сайта убирать.

И не помогут тут ни директивы Disallow в robots.txt, ни метатеги:

<meta name="robots" content="noindex, nofollow" />

ни даже закрытие через JS и AJAX. А всё потому, что если ссылки в контенте ещё можно скрыть, то клик по этой ссылке скрыть невозможно, как и адрес сайта куда перешёл посетитель. Всё это печально, но частично можно проблему с закрытием некоторых разделов и страниц сайта от индексации элементарно установив галочку в настройка Я.метрики, при получении кода. Это настройка "Запрет отправки на индексацию страниц сайта".

В код счетчика будет добавлено свойство ut:"noindex" для объекта Ya.Metrika и параметр ut=noindex после //mc.yandex.ru/watch/XXXXXX в noscript-части кода.

Показываю:

Запрет отправки на индексацию страниц сайта

Так, что есть смысл пройтись по своим сайтам и заменить код метрики.

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