Техническая оптимизация в 2017.
Подробное руководство

Николай Оськин
Специалист по SEO
29 Августа 2017, 16:37
402
Время чтения: 15 минут

Так уж сложилось, что при разработке сайта, разработчики и программисты не сильно волнуются о его дальнейшей судьбе. Они не знают будет ли на сайт в дальнейшем привлекаться трафик, и если да, то какой. Заказчик, в свою очередь проверив работоспособность нескольких страниц сайта вручную, и удостоверившись в том, что “вроде бы всё работает”, принимает сайт от разработчиков и на этом всё заканчивается. Дальше встает вопрос о привлечении трафика, в том числе и бесплатного трафика из поисковых систем, но почему-то сайт не растет. О том почему так происходит и что необходимо делать для того, чтобы подготовить сайт к продвижению и пойдет речь в этой статье.

Техническое SEO, почему это важно

Результаты поиска формируются не людьми, а поисковыми алгоритмами. Люди, так называемые “ассесоры”, могут влиять на результаты поисковой выдачи, но влияют они не напрямую, а оценивают качество алгоритмов поисковой системы для того, чтобы поисковая система могла улучшить свои алгоритмы в будущем.

Индексация страниц сайта

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

То количество страниц, которое поисковые роботы могут обойти в единицу времени, например в сутки, на западе называется Crawl Budget.

Crawl Budget

Crawl budget зависит от многих факторов, на некоторые из них повлиять невозможно. Для примера рассмотрим какой-нибудь популярный новостной сайт, такой как cnn.com. В сутки на такой сайт могут быть добавлены сотни новостных публикаций и статей. И все из них моментально попадают в индекс поисковой системы. И давайте представим, что у вас относительно молодой интернет-магазин и вы добавляете по 100 товаров в сутки в свою базу, но индексируется только 5 страниц в сутки а то и меньше. Почему так происходит?

Дело в том, что популярный сайт обладает большим статическим весом в сравнении с молодым сайтом, то есть имеет больший PageRank. В основе алгоритмов большинства поисковых систем, именно статический вес (или PageRank) показывает насколько сайт популярен среди остальных сайтов. А поскольку он такой популярный, то логично предположить, что и для поисковой системы он важнее. Именно поэтому Crawl budget зависит от статического веса сайта, и чем больше PageRank, тем активнее поисковые роботы “бегают” по сайту и добавляют новые страницы в свою базу данных. Вы можете посмотреть активность ботов google в панеле Search Console в разделе “Статистика сканирования”.

Статистика сканирования

Но crawl budget зависит не только от статического веса. Ошибки в архитектуре сайта негативно влияют на скорость индексирования его страниц.

404 код ответа сервера

404 код ответа сервера

Существующие страницы сайта должны отдавать код ответа сервера 200.
Сервер отдает 404 код в ответ на запрос несуществующей страницы. Так и должно быть и в этом нет ничего криминального. Когда мы вбиваем в адресную строку браузера какую-то страницу, но ошибаемся в написании, то попадаем на 404-ую несуществующую страницу сервера.

Проблемы наступают тогда, когда внутри нашего же сайта мы ссылаемся на несуществующие страницы. Это может происходить по разным причинам, но чаще всего это происходит из-за неправильной настройки CMS (системы управления контентом) или редиректов.

Поисковые роботы, передвигаясь по сайту, видят, что на страницах расположены ссылки, которые ведут на несуществующие страницы, а значит пользователь может кликнуть по такой ссылке и не обнаружить там того, что он хотел. В лучшем случае он увидит сообщение о том, что “Страница не найдена”, как на скриншоте с сайта Ulmart.ru. В худшем случае он увидит пустую белую страницу с надписью “404”.

Если на сайте относительно небольшое количество страниц, то пробежаться по страницам можно вручную и исправить или удалить все ссылки ведущие на несуществующие страницы. Когда страниц на сайте достаточно много, то вручную это сделать проблематично и на помощь приходит специальный софт. В нашей работе мы пользуемся программой Screaming Frog.

Screaming Frog

Эта программа имитирует поисковых роботов и пробегается по всем страницам сайта, в том числе по всем картинкам, css и js файлам. Парсит самые главные строки html кода: заголовки title, мета теги description и keywords, заголовки разметки текста h1, h2, h3, h4 и т.д. Учитывает правила robots.txt, то есть игнорирует страницы, закрытые в robots.txt, бегает по редиректам, показывает количество ссылок внутри всего сайта на какую-то конкретную страницу. В общем must have для seo оптимизатора, особенно если это касается больших сайтов и интернет-магазинов.

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

Screaming Frog в работе

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

Во вкладке Response Codes можно увидеть страницы с разным кодом ответа сервера: 301, 302, 404 и т.д.

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

Screaming Frog показывает битые ссылки

Заходим на страницы-источники и удаляем все битые ссылки.

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

Промежуточные редиректы

В некоторых CMS системах происходит перенаправление посетителей (и поисковых ботов) на страницы с помощью 302 редиректов. То есть в коде страниц вашего сайта находятся ссылки на промежуточные страницы, которые затем перенаправляют на другие (итоговые) страницы, хотя можно было сделать так, чтобы ссылка стояла сразу на итоговую страницу.

Почему таких редиректов стоит избегать?

Во-первых в индекс могут попасть не результирующие страницы, а промежуточные. У промежуточных страниц, как правило, не очень красивый URL адрес, он длинный и неявляется ЧПУ (человеко-понятный URL), например domain.com/?session_id=4215&order=time&url=/category/231.html

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

Во-вторых при переадресациях происходит потеря ссылочного веса.

передача ссылочного веса

Согласно алгоритма PageRank, страница-донор не полностью передает свой вес на страницу-акцептор, а отдает вес с потерями. В изначальной модели, считалось, что страница теряет 15% ссылочного веса, когда ссылается на другую страницу. Тоже самое происходит при редиректах. В последнее время специалисты из Google говорят, что теперь этого не происходит и ссылочный вес передается полностью. Но они имеют в виду 301 редирект, то есть Permanent Redirect, а не временный редирект 302, который проставляется большинством CMS систем.

Раньше считалось, что временные редиректы (302) вообще не передают никакого ссылочного веса на страницу акцептор, но это не так. Иначе бы результирующие страницы не попадали бы в индекс совсем. Ссылочный вес передается и через 302 редирект, но с потерями. Поэтому очевидно, что это негативно скажется на результатах продвижения и индексации в сравнении с прямыми ссылками без каких-либо редиректов.

“Обходитесь без лишних переадресаций, там где можно обойтись без них. Используйте переадресацию только тогда, когда URL адрес страницы изменился. При этом нужно использовать 301 редирект”.

Закрытие ссылок от индексации

Вспомнив теорию PageRank, согласно которой весь ссылочный вес в равной или неравной степени распределяется среди всех ссылок на странице, можно заметить, что на многих сайтах стоят ссылки на страницы, которые не являются посадочными и никак не продвигаются. Это ссылки на вход в личный кабинет или на форму регистрации, ссылки на текст лицензионного соглашения и т.д. При этом зачастую эти ссылки расположены на всех страницах сайта.

распределение веса на второстепенные страницы

Давайте приведем пример и посчитаем. Допустим на сайте 200 страниц и на каждой из них стоят 3 ссылки которые ведут на:

  • Вход в личный кабинет
  • На страницу регистрации
  • На страницу лицензионного соглашения

Эти 3 страницы никак не продвигаются. Если умножить количество таких ссылок на количество всех страниц, то мы имеем 600 ссылок по всему сайту на которые расходуется ссылочный вес.

На страницах статейного раздела часто бывает так, что первая ссылка, ведущая на статью это заголовок, вторая ссылка это картинка, а третья ссылка это кнопка “Читать статью” или “Подробнее”. В итоге мы имеем 3 ссылки ведущие на одну и ту же страницу. При этом учитывается только первая, которая стоит в HTML коде выше. В данном случае ссылка, которая является заголовком.

как правильно закрыть ссылки от индексации

Разумно закрыть эти ссылки от индексации поисковыми системами, при этом оставить возможность посетителям на них нажимать и переходить на эти страницы.

Закрыть эти ссылки можно с помощью JavaScript, jQuery или AJAX скриптов.

Поисковые системы уверяют, что они научились исполнять скрипты. Но это касается самых простых скриптов. Можно усложнить для них задачу и сделать так, чтобы поисковые системы не видели ссылок, а видели простой текст, а для посетителей (у которых включен JavaScript) этот текст будет отображаться в браузере как ссылка.

Рабочие методы закрытия ссылок

1.  <span class="hidden-link">скрытая ссылка</span>

Этот способ скрытия ссылки через jQuery, поэтому на страницах вашего сайта должна быть загружена библиотека jQuery, эта библиотека загружена на 90% современных сайтов.
Скрипт, который скрывает ссылку, выглядит так:

<script type="text/javascript">
// <![CDATA[ $('.hidden-link').replaceWith(function(){return'<a href="'+$(this).data('link')+'">'+$(this).html()+'</a>';}) // ]]>
</script>

2. Ссылка через button:<input class="button_buy" type="button" value="текст" />

В данном случае ссылка в коде выглядит как html элемент - input type="button" и не индексируется поисковыми системами как ссылка, но при клике на эту кнопку посетители могут перейти на страницу.

Использование вкладок, спойлеров и табов

Многие интернет магазины используют вкладки (табы) на карточках товаров и выглядит это так:

использование вкладок в интернет-магазинах

Делается это через jQuery скрипт таким образом, что неактивная вкладка скрывается в стилях через css атрибут display: none;, а при клике по вкладке блок с текстом принимает атрибут display: block; с помощью jQuery скриптов.

В целом это очень удобно для посетителей, им не нужно скроллить страницу вниз, достаточно кликнуть по вкладке “Доставка и оплата” в примере выше, чтобы получить информацию о доставке и оплате.

Но с точки зрения SEO есть неприятный момент, по крайней мере в поисковой системе Google.

Сотрудник отдела качества поиска Google Gary Illyes официально заявил, что текст скрытый под вкладками учитывается в текстовом ранжировании страницы хуже, чем если бы он не был скрыт.

Вот подборка цитат на эту тему:

21 July 2015 – Google’s Gary Illyes, contributing to a Stack Overflow forum thread, provided clarification of this by stating that this type of content is given “way less weight in ranking”
27 July 2015 – In a separate Stack Overflow thread on the same topic, Gary Illyes again confirmed that “[Google] will index that but the content’s weight will be lower since it’s hidden”

Он пояснил, что скрытый текст индексируется поисковой системой Google, но его “вес” меньше, потому что он скрыт.

И что делать с вкладками?

Мы рекомендуем размещать текст с описанием товара с вашими ключевыми запросами в той вкладке, которая по умолчанию открыта. Например если вы хотите ранжироваться по запросу “товар + доставка”, то информацию о доставке размещать в открытой вкладке. А в закрытых вкладках размещать технические характеристики товара (размер, вес и т.д.).

Скорость загрузки

Скорость загрузки является фактором ранжирования в поисковых системах, а также влияет на Crawl Budget и конверсии. Особенно это актуально для мобильных версий сайта или адаптивный версий. Вряд ли посетители с мобильных будут ждать 5 секунд, чтобы страница вашего сайта загрузилась.

Существует множество сервисов оценки скорости загрузки сайта, порекомендуем некоторые из них:

https://developers.google.com/speed/pagespeed/insights/
https://gtmetrix.com/
https://www.webpagetest.org/

Проверяйте свои посадочные страницы в этих сервисах: страницы описания услуги, главные страницы, страницы категорий, карточки товара и т.д.

проверка скорости загрузки страницы

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

Рекомендации по увеличению скорости загрузки

  • Желательно подбирать хостинг под аудиторию вашего сайта. Если ваша компания оказывает услуги в Санкт-Петербурге, то разумно было бы использовать хостинг, который расположен в Санкт-Петербурге, это сократит ответ сервера на запрос пользователя.
  • Используйте кэш статических файлов. Любая графика на сайте повторяется от страницы к странице. Например, картинки в шапке сайта или футере такие как логотип, иконки используются на всех страницах сайта. Настроив кэширование javascript, css, jpeg, png файлов вы позволяете браузеру при первом посещении страницы скачивать всю графику на жесткий диск посетителям, таким образом при повторном посещении страницы или при переходе с одной на другую, графика будет подгружаться не с вашего хостинга, а с жесткого диска посетителя.
  • Используйте сжатие GZIP. Сжатие данных позволяет снизить размеры файлов, которые передаются от вашего сервера. Нужно обратиться к администратору вашего сервера (хостинга) для того, чтобы включить сжатие данных. Gzip позволяет сжимать некоторые файлы больше, чем в 2 раза.
  • Компрессия jpeg файлов. Часто бывает, что для страниц со статьями подбираются картинки, которые весят очень много и могут быть сжаты без потери качества. В сети существует масса сервисов, которые позволяют сжать картинки без потерь. Таким образом можно сократить размер картинок на 30-40%. Сервисы сжатия картинок: http://optimizilla.com/ru/
    https://compressor.io/
  • Располагайте свои css и js файлы перед закрывающим тегом <body>. Дело в том, что браузеры работают таким образом, что когда в HTML коде встречаются css или js файлы, то отображение страницы приостанавливается до тех пор, пока не скачаются эти файлы. Поэтому располагая эти файлы внутри html тегов, страница не начнет отображаться пока не скачаются все css файлы и скрипты. И если в случае одного css файла это оправдано, то в случае большого количества скриптов это сильно тормозит загрузку и отображение вашего контента.
  • Для перфекционистов. Используйте уменьшенные изображения для мобильных версий сайта. На мобильных устройствах через 3G соединения может быть проблематичным загрузка больших изображений весом 200кб и более. При вёрстке сайта с помощью media запросов можно использовать уменьшенные изображения для мобильной версии сайта. Особенно это касается статей с большим количеством иллюстраций. Изображения должны подгружаться не с помощью тега а с помощью CSS атрибута background-image, таким образом в media запросах для размеров экранов мобильных устройств мы можем указать подгрузку других, заведомо уменьшенных, файлов изображений.

Это, пожалуй, всё что можно рассказать на тему технической оптимизации. Часто этими методами оптимизации пренебрегают в пользу контента или внешней оптимизации. Но, “в бою все средства хороши” и если на сайте устранять и не допускать технических ошибок, то это повысит эффективность мероприятий по продвижению ресурса в поисковых системах.