Сегодня очень сложно оставаться монопрофильным специалистом. И часто, делая новый сайт или внося различные правки, можно позаботиться заранее об основных вещах, которые помогут сразу сделать всё чисто и красиво не только с точки зрения программирования, но и с точки зрения SEO.


Так о чём же надо помнить, чтобы делать работу качественно, и SEO-специалисты были довольны вашей работой?

Подтягиваем общие знания


В первую очередь, пожалуй, следует подтянуть собственные знания по SEO (а может, и контекстной рекламе). Такие вещи в сфере интернет-маркетинга никогда не помешают, а вам дадут преимущество — делать всё осознанно, а не просто “как в ТЗ написано”. Кроме того, полезно и для самопроверки. Это — общая канва, на которую наслаиваются остальные пункты.

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



Если вы работаете с SEO-аудитами, наверняка вы знаете что такое внешние ссылки, циклические ссылки и висячие узлы.

В общем случае: внешние ссылки — это те, которые ведут на другие сайты и получается уводят ваших посетителей в другое место; циклические ссылки — ведут на самих себя (тоже плохо); висячие узлы — например, ссылки на скачивание документов, которые никуда не ведут на другие страницы. Всем таким ссылкам мы добавляем атрибут ‘rel=”nofollow”’, которые даст поисковым роботам понять, что по этой ссылке идти не надо и учитывать её не стоит. Таким образом мы сохраняем вес страницы. Внешним ссылкам лучше вообще добавить target=”_blank” — так ваш сайт останется открытым у пользователя, и шанс на его возвращение будет больше.

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

Наиболее типичные внешние ссылки — ссылка на разработчика сайта в подвале, ссылки на соцсети, источники новостей, клиенты компании, телефоны, почты и т д.

Склеиваем зеркала



Говоря об уменьшении дублей, нельзя не вспомнить о склейке зеркал. Это значит, что ваши страницы должны быть доступны только по 1 адресу. В то время как ваши могут быть доступны по:


То есть существует три основных вида зеркал: по протоколу (http / https), по наличию слеша в конце страниц и по наличию заветных трёх букв “www”.

При использовании редиректов — важно помнить, что для склейки он должен быть по умолчанию 301 (постоянный редирект), а не 302 (временный редирект).

Если у вас работают сортировки \ фильтры \ постраничная навигация через GET-параметры, как правило, это тоже создает дубль для поисковой системы. Поэтому на такие страницы лучше хотя бы вешать склейку. Для этого в <head> добавляется специальная ссылка <link href=”ссылка на основную страницу” rel=”canonical”>. Такая ссылка говорит роботу, что эта страница — не основная, а основная находится по адресу в атрибуте href. Это позволит избавиться как правило от многих дублей ваших страниц.

Устанавливаем правильные мета-теги и микроразметку



Не менее важны при разработке мета-теги страниц. Свойства title и description должны быть заполнены как минимум у основных страниц (главная, о компании, контакты, каталог, услуги), лучше — заранее позаботиться о правилах формирования мета-тегов у добавляемых впоследствии категорий, товаров или новостей. В качестве title можно брать название, а в качестве description — добавлять к названию общую информацию в стиле <meta name=”description” content=“Ваше описание. Больше подробной информации на сайте site.ru”>.

В идеальном мире можно сразу внедрить микроразметку. Ну хотя бы Open Graph. Чем дальше, тем чаще встречается этот пункт в различных аудитах на внедрение, делается обычно быстро и просто, но может дать приличный value в плане отображения сайта и его привлекательности для клиентов. Про микроразметку можно почитать тут.

Также создаем стандартный robots.txt. Обычно на просторах интернета можно найти такой для CMS, которую вы используете — для всех он разный. Во многих CMS есть автоматический генератор, либо плагины, которые возьмут этот пункт на себя.

Оптимизируем скорость загрузки сайта



Одним из основных факторов привлекательности сайта для пользователя является скорость его загрузки. Это и понятно — ждать по 2 минуты загрузки страницы было нормально в 2000-х, но сегодня скорость потребления информации в разы выше, как и потребности пользователя. Если тебе приходится больше 5 секунд смотреть на прелоадер, это начинает раздражать. Часто в вопросе скорости загрузки SEO-специалисты ориентируются на инструмент Google PageSpeed Insights.

Основное, на что делается упор в этом аудите — оптимизация изображений. Сейчас просто неприлично заливать огромные картинки, никаких их не обрабатывая и не сжимая. Если ваша картинка весит 2-3 мегабайта, обычно это говорит о том, что ваша страница будет грузиться намного дольше, чем могла бы, и вы не заботитесь о своём продукте. Этот пункт сразу отберет у вашей страницы порядка 40 очков (если всё совсем плохо) в том же PageSpeed Insights.

Также сервис предлагает перенести Javasciptы вниз страницы, т.к. их загрузка препятствует загрузке отображаемого контента, а также использовать сжатие файлов и кеш браузера. Для этого используются модули сервера, к которым обращаются через директиву .htaccess. Можно заранее подготовить себе правила, которые достаточно универсальны, со сроком кеширования и сжатия, чтобы вставлять их потом на проект.

Выглядит это примерно так:

<IfModule mod_expires.c>
  ExpiresActive on
  ExpiresDefault "access plus 6 hour"
  ExpiresByType image/jpeg "access plus 7 day"
  ExpiresByType image/gif "access plus 7 day"
  ExpiresByType image/png "access plus 7 day"
  ExpiresByType image/x-icon "access plus 7 day"
  ExpiresByType text/css "access plus 6 hour"
  ExpiresByType application/javascript "access plus 6 hour"
  ExpiresByType application/x-javascript "access plus 6 hour"
  ExpiresByType application/x-shockwave-flash "access plus 6 hour"
</IfModule>

<IfModule mod_deflate.c>
    <filesMatch "\.(js|css|html|php|jpg|jpeg|png|gif|svg)$">
        SetOutputFilter DEFLATE
    </filesMatch>
</IfModule>

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

Создаем страницу для 404 ошибки


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

Не забываем про адаптивную / мобильную версию



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

Закрываем от индексации среду разработки



Если вы разрабатываете новый сайт или работаете на поддомене, необходимо закрыть его для индексации, чтобы не попасть под аффилирование (несколько одинаковых сайтов, из которых система определит основной, и только у него все будет нормально). Обычно это делается через специальный файл robots.txt, в котором вся информация закрывается от всех роботов.

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

Вишенка на торте (страницы пагинации)



Для желающих особо выделиться и перфекционистов — прорабатываем страницы постраничной пагинации. Список действий при этом достаточно простой:

  1. Склеиваем тегом canonical страницы с основной (<link href=”ссылка на основную страницу” rel=”canonical”>).
  2. Добавляем в <head> специальные мета-теги, которые скажут роботу, где находятся предыдущая и следующая страницы. Для этого используем <link href=”адрес следующей страницы” rel=”next”> (на всех страницах, кроме последней), и <link href=”адрес предыдущей страницы” rel=”prev”> (на всех страницах, кроме первой). При этом если мы находимся на второй странице, к первой не должно добавляться параметров пагинации.
  3. На всех страницах, кроме первой, добавляем подписи “ — страница N” к тегам <title>, <description>, <h1> (где N — номер страницы). Это поможет нам избежать еще целой серии дублирования контента.

Комментируем правильно


Часто клиент решает убрать какой-либо баннер или просто блок, который пока не может наполнить. Но через полгода, а то и год “чудесным образом” о нем вспоминает и просит вернуть. Каким образом вы его достанете — это уже ваша проблема. Поэтому если надо скрыть какие то вещи, которые впоследствии могут оказаться опять нужными, лучше их закомментировать или сделать копию файла. Причем комментарий не должен быть вида <!----->, т.е. обычным html. Такой комментарий будет выводиться в коде страницы, его увидит поисковик и вполне возможно посчитает мусорным кодом. Кроме того, это увеличивает объем загружаемого html-кода. Поэтому лучше обернуть этот комментарий например в комментарий php. И не забывайте подписать, к чему он относится! Ибо не факт, что через год вы сами будете об этом помнить.

Итоговый чек-лист



Итого. Можем составить примерный чек-лист для себя любимого:

  • Закрываем циклические ссылки (меню, логотип, хлебные крошки), внешние ссылки (соцсети, источники, клиенты, телефоны, почты) и висячие узлы (документы для скачивания)
  • Склеиваем зеркала (www, http, /), а также страницы с GET-параметрами (фильтры, сортировка)
  • Проверяем, что все редиректы на сайте являются 301
  • Устанавливаем правила для мета-тегов
  • Микроразмечаем в максиразмерах
  • Оптимизируем скорость загрузки сайта (сжатие ресурсов, кеш браузера, оптимизация изображений, минифицированные версии скриптов и стилей, скрипты внизу страницы)
  • Не забываем проверять мобильную версию
  • Закрываем от индексации среду разработки
  • Оптимизируем страницы постраничной пагинации под поисковые системы
  • Комментируем код не в html-формате, а в php либо бэкапим отдельно
  • Не забываем создать страницу с ошибкой 404

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

Комментарии (21)


  1. unlor
    18.07.2018 11:29

    Ну стоит подтянуть знания. Точно стоит :)
    1. Забудьте про PageSpeed, пожалуйста. Если вы не знаете что с ним делать, то лучше вообще не трогать. 80% его рекомендаций просто бесполезно делать.
    2. Комментировать правильно — хорошо, но «понизить позиции за комментарии в коде»… хм. Этот сеошник сломался, несите следующего. Если, конечно речь не идет о том, чтобы закомментировать 100+ строк — это уже просто некрасиво.
    3. Закрывать пагинацию от индексации имеет смысл в том случае, если у вас есть страница с общим списком товаров (вот прям все 100500 телевизоров на обдной странице без всякого ajax). Да и это спорное решение.
    4. Canonical работать не будет, т.к. в предыдущем пункте вы закрыли весь контент от индексации, т.е. от анализа роботом, а для признания страницы канонической робот _должен_ сравнить контент обеих страниц.


    1. DasBinIch Автор
      18.07.2018 11:43

      Это некое обобщение многих-многих внедренных SEO-аудитов. Спорить не буду, учиться всегда есть чему и подтягивать знания) Учту ваш комментарий, спасибо)

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


      1. unlor
        18.07.2018 11:54

        Не сомневаясь в том, что вы внедряли, КМК, аудиты были на редкость скучные и однообразные?) А если аудит не помог, то во всем был обвинен коварный гуглояндекс?


        1. DasBinIch Автор
          18.07.2018 12:05

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


    1. demimurych
      18.07.2018 14:55
      +1

      О PageSpeed. Откуда Вы взяли цифру 80%? Приведите примеры бесполезных рекомендаций.
      PageSpeed это очень ценный инструмент, рекомендации которого нужно выполнять по нескольким причинам:
      1) эти рекомендации действительно работают. Разработчики которые знают что делают с легкостью добиваются оценки выше 90 балов.
      2) pagespeed дает вам относительную оценку которая учитывается гуглом при ранжировании проекта в выдаче. То есть даже если Вы правы, и какая то из рекомендаций действительно является глупостью, выполнить ее стоит хотя бы потому, что она даст проекту лишних попугаев в индексации.


      1. 4tlen
        19.07.2018 14:55

        Разработчики не пользуются Goggle Page Speed. Для этих целей есть Dev Tools со всеми метриками, таймингами и прочими FPS. Или Lighthouse. Или еще куча инструментов. Так что да, GPS это чисто сеошный фетиш, зачастую бесполезный.


        1. demimurych
          19.07.2018 15:35

          Повторяю то что вероятно от Вас ускользнуло —

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


          зачастую бесполезный.

          Пожалуйста примеры его бесполезности.

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

          Плюс несколько дополнительных рекомендаций связанных с SEO PWA и прочим, что является просто чек листом для нормального разработчика.


  1. apapacy
    18.07.2018 15:39
    +2

    Для желающих особо выделиться и перфекционистов — прорабатываем страницы постраничной пагинации. Список действий при этом достаточно простой:

    Ставим на все страницы, кроме первой, тег <meta name=”robots” content=”noindex, follow”>. Это скажет поисковому роботу, что контент индексировать не надо, но если встретит ссылки — то надо по ним перейти и проиндексировать новые страницы…



    Не совсем ясно. Текст с разделением на страницы содержит каждая страница свой контент. Почему его не следует индексировать кроме самой первой страницы?


    1. DasBinIch Автор
      18.07.2018 17:54

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


    1. DasBinIch Автор
      18.07.2018 18:11

      Проконсультировалась с SEO-специалистами) Робот может принять 2 и последующие страницы пагинации как целевые, и начнет туда гнать трафик, поскольку индексирует он именно текстовое содержимое страницы. Нам же важно, чтобы целевой была именно 1 страница. А от robots noindex, follow мы будем отходить, т.к. Google недавно заявил, что будет такие мета-теги воспринимать и как nofollow. Так что вывод — склеиваем канониклом) Статью сейчас обновлю.


      1. apapacy
        18.07.2018 19:51

        Все на так однозначно. Мне на ум приходят два варианта использования постраничного вывода.
        1-й условно назовем его динамичский — когда содержание страниц постоянно обновляются — например новости. Тогда действительно индексировать не нужно ни первую ни последующие страницы но обязательно чтобы каждая новость имела свою ссылку на отдельную страницу новости по которой будет проиндексирован ее контент.
        Первую страницу тоже можно приндексировать чтобы был вход на раздел с новостями например
        2-й условно назовем ее статический — когда содержание страниц не меняется со временем, например это статья, которая раззделена на несколько страниц или литературное произведение. Тогда контен нужно иденксировать и на первой и на последующей странице. И если мы захотим почитать про друга детства велкиого комбинатора Колю Остен-Бакена то нам гарантирована выдача этого контента на той странице где он и расположен см. petrov.com.ua/GoldCalf/pages/10.htm

        Я бы сказа другое. Обо всем этом можно забыть, если только страница не содержит старого доброго html (Я намекаю на динамически генерируемый контент на стороне браузера при помощи JavaScript/Angular/React/Vue) А это сейчас очеь даже актуально.


    1. Promobeat
      19.07.2018 14:55

      <meta name=”robots” content=”noindex, follow”> — лучший вариант для страниц пагинации. Многие используют canonical, что в корне неверно. Canonical используется если у вас есть одна страница, доступная по нескольким URL.


  1. ashumkin
    18.07.2018 16:26
    +1

    Комментируем код не в html-формате, а в php либо бэкапим отдельно

    комментируемый код — удаляем (YAGNI), а понадобится — use VCS, Luke


  1. SeoPitcher
    18.07.2018 17:53

    Не забыть создать 404 ошибку
    Добавить файл — robots.txt
    В next prev и canonical использовать абсолютный url, а не относительный
    И в зеркалах не забыть про index.php и index.html
    А так же что зеркала клеятся через 301, а не через 302 редирект


    1. DasBinIch Автор
      18.07.2018 17:57

      Редирект вроде в статье указан — да, должен везде быть 301.
      404 — верно, пожалуй докину в текст. Про роботс тоже можно отдельно дописать


  1. kuftachev
    19.07.2018 01:53

    "Блог компании Яндекс" точно есть на сайте, по идее Google тоже.


    В общем, странно читать что-то по поисковой оптимизации не от этих компаний.


    Кроме конкретных правил, которые дают сами поисковики, все остальное в SEO — это древний примитивный культ с кучей течений, но которые являются чисто догматами верований и никак не соответствует реальности.


    В общем, Хабр не место для такого!


    1. PashaNedved
      19.07.2018 06:44

      Без танца с бубном, SEO (рекомендации поисковых систем) не дает ожидаемых результатов. А рекомендации ПС, часто нуждаются в дополнении под конкретные случаи.


      1. kuftachev
        19.07.2018 08:43

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


        Написал от первого лица, но я не сеошник...


        В общем, Хабр — это технический ресурс. Даже если люди ошибаются в технических вопросах, то это измеряемо и другие могут на это указать, что нельзя сказать про SEO.


        1. PashaNedved
          19.07.2018 09:43

          Рекомендации ПС объективны

          Рекомендации пс тоже субъективны. Но они гораздо ближе к истине.
          Все остальное в SEO по принципу когда-то что-то показалось и теперь я считаю, что это правильно, хотя я мог ошибочно оценить результаты, например, не я что-то сделал хорошо, а конкурент плохо или раньше что-то помогало, а потом стало вредить вообще, но на основании того, что мне это помогало, я это уже не проверяю и использую.

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


  1. Pavel1114
    19.07.2018 07:36

    внешние ссылки — это те, которые ведут на другие сайты и получается уводят ваших посетителей в другое место;

    Всем таким ссылкам мы добавляем атрибут ‘rel=”nofollow”’, которые даст поисковым роботам понять, что по этой ссылке идти не надо и учитывать её не стоит.

    не думаю что данный аттрибут как то учитывается сейчас для внешних ссылок. Иначе это сродни «клоакингу» — для пользователей это значит довольно важные ссылки раз они есть, а вот поисковым системам их учитывать не надо.


    1. PashaNedved
      19.07.2018 09:57

      Гугл пишет, что учитывает https://support.google.com/webmasters/answer/96569?hl=ru.
      А вот утверждение

      Таким образом мы сохраняем вес страницы

      достаточно спорно, существует мнение, что вес утекает в небытие.